AWS APIGateway Weird behavior trying to find local file

Question

I am following this article https://awsteele.com/blog/2022/10/15/cheap-serverless-containers-using-api-gateway.html to set up a cost-saving apigateway to fargate path using cloudmap instead of alb.

My app is on port 5230. When I finish set up and deploy APIGateway, it throws the error in the console.

caught (in promise) TypeError: Failed to register a ServiceWorker for scope ('https://xxxxxx.execute-api.us-east-1.amazonaws.com/') with script ('https://xxxxxx.execute-api.us-east-1.amazonaws.com/sw.js'): A bad HTTP response code (404) was received when fetching the script.

sw.js is registered in my index.html like this navigator.serviceWorker.register("/sw.js");, looks like APIGateway is trying to find files locally. Wonder how can I do to resolve this , thank you!

I tried to turn off serviceWorker in chrome but it throws same type of error trying to find local resources.

Answer 1

APIGateway isn't throwing that error, your application running in the web browser is throwing that error.

This sentence:

"looks like APIGateway is trying to find files locally"

makes no sense to me at all.

The error message specifically states that the web browser is trying to load the sw.js file from your web server. If your web server isn't serving that file, at the path you specified, then this is never going to work. There's nothing "local" happening.

Your code:

navigator.serviceWorker.register("/sw.js")

Tells the web browser to load that file from a relative URL. The web browser is going to take the domain name of the website, which is https://xxxxxx.execute-api.us-east-1.amazonaws.com and append the path to that. So the web browser is going to try to load the remote file from the web server, via the url https://xxxxxx.execute-api.us-east-1.amazonaws.com/sw.js. Your web server isn't returning that file when it is requested at that path, so the web browser prints that error in the console.

If you paste the URL https://xxxxxx.execute-api.us-east-1.amazonaws.com/sw.js directly into a web address bar, it should load a JavaScript file in the browser. If that isn't happening, for example if it is returning a 404 error or something instead, then you need to look into your web server and API Gateway configuration to determine why that path isn't mapping to that file on your server.