Refused to execute script runtime.js because MIME type is not executable
Question
This is the error I'm getting when performed browser inspect -> Console tab of index.html file.
Refused to execute script from ' http://localhost:63342/runtime.js ' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.
My app is an integration of spring-boot and Angular. I believe this is also the cause for spring-boot not serving the frontend js and .html file content on UI. Although backend application works fine but on tomcat service start, it doesn't show any UI on http://localhost:8080 .
Angular CLI: 6.0.8
Node:10.0.0
OS: darwin x64
Angular: 6.1.7
The generated index.html has tags:
<script type="text/javascript" src="runtime.js"></script>
<script type="text/javascript" src="polyfills.js"></script>
<script type="text/javascript" src="styles.js"></script>
<script type="text/javascript" src="vendor.js"></script>
<script type="text/javascript" src="main.js"></script>
Changing type manually to "text/html" resolves the error, but still doesn't show anything on UI. Is this an issue due to particular angular-cli version? Are my two issues (spring not serving frontend static resources) related? Or is base href wrong? Is there a way to not resolve this without manually changing the type in script tag? Because index.html gets generated on running ng build and gets placed in resources directory. And I'm doing this to make deployment easier. Here is the whole generated index.html file:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Welcome App</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
<script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body>
</html>
I am a new bee in this, please provide help.
This is what I see in browser inspect -> Network -> Headers (When open the file from browser option in Intellij and tomcat isn't running). Response header for one of the generated angular file:
HTTP/1.1 304 Not Modified
content-type: text/html
server: IntelliJ IDEA 2018.1.2
date: Sun, 16 Sep 2018 16:08:39 GMT
X-Frame-Options: SameOrigin
X-Content-Type-Options: nosniff
x-xss-protection: 1; mode=block
But when tomcat is up and running,notice 200 response on inspect :
HTTP/1.1 200
Content-Type: application/json;charset=UTF-8
Since its app/json and I see [ ] in response, which I think is wrong and should have been an html response.
Are these script tags that gets added on ng build in index.html an issue for not showing the content on UI or something else? I didn't think so because I copy pasted my static content in a demo gradle project(from https://start.spring.io/ ) and it shows UI on webpage so changing 'text/javascript' to 'html' isn't really an issue I believe; but not sure. And this is what I see in response for working UI:
HTTP/1.1 200
Accept-Ranges: bytes
Content-Type: text/html;charset=UTF-8
Any suggestions?
1 answers
solution1
0 2018-09-17 16:12:24
If you are using apache2, check apache2.conf in /etc/apache2/
Make sure you have this line:
AddType text/javascript .js
Make sure mod:mime is installed and enabled:
sudo a2enmod mime
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.