angular - FCM service worker not working in production

Question

When running the production build in localhost, the fcm is working properly, but when i run it in my aws ec2 instance i got the following error :

Unhandled Promise rejection: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ('https://mydomain/firebase-cloud-messaging-push-scope') with script ('https://mydomain/firebase-messaging-sw.js'): The script has an unsupported MIME type ('text/html'). (messaging/failed-service-worker-registration). ; Zone: ; Task: Promise.then ; Value: FirebaseError: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ('https://mydomain/firebase-cloud-messaging-push-scope') with script ('https://mydomain/firebase-messaging-sw.js'): The script has an unsupported MIME type ('text/html'). (messaging/failed-service-worker-registration).

I have put the firebase-messaging-sw.js file in the root folder, also set mime type in httpd.conf file but the error still persists. I looked into similiar problems in SO but mostly they use react while i'm using angular. Please help me fix this issue, thank you

question from:https://stackoverflow.com/questions/65650025/fcm-service-worker-not-working-in-production

Answer 1

It turn out that my apache configuration causing all js file treated as 'text/html'.

In /etc/httpd/conf.d/php.conf there is this line

AddType application/x-httpd-php .html .php .xml .js

i changed it to AddType application/x-httpd-php .html .php .xml

restarting httpd and the service worker registered successfully.