Nginx发现css，但不会将其加载到index.html中 [英] Nginx finds css but doesn't load it into index.html
问题描述
我的nginx服务器提供了一个index.html文件，它加载了一个css文件和一些js文件。 css文件被加载（NO 404），但风格没有出现。
文件夹：
/ src
/资产
/ images
...
/ sounds
...
/ css
/style.css
/ js
...
index.html
由js文件加载的声音和图像完美地工作。
/ etc / nginx / sites-enabled / default /：
server {
listen 8080;
server_name jumpnrun jumpnrun.vm;
access_log /var/log/nginx/jumpnrun.access.log;
error_log /var/log/nginx/jumpnrun.error.log;
位置/ {
try_files $ uri $ uri / index.html;
}
location〜^ /（assets / | css / | js / | index.html）{
root / src;
index index.html;
access_log off;
}
位置/socket.io {
add_header访问控制 - 允许来源*;
proxy_set_header升级$ http_upgrade;
proxy_set_header连接升级;
proxy_set_header X-Forwarded-For $ proxy_add_x_forwarded_for;
proxy_set_header主机$主机;
proxy_http_version 1.1;
proxy_pass http：// node-server;
}
}
index.html：
<！DOCTYPE html>
< html lang =en>
< head>
< meta charset =UTF-8/>
< title>跳转n'运行< /标题>
< link href =css / style.csstype =text / css =stylesheet/>
< / head>
< body>
< canvas id =gamewidth ='1000'height ='500'>< / canvas>
< button class =sound>< / button>
< / body>
<！ - JS - >
< / html>
如果我转到localhost：8080它会给我索引页面，但没有任何样式和开发工具不会显示任何错误。
感谢您的帮助！
编辑：
整个事情都在docker容器中。现在每次浏览到localhost：8080 nginx都会死掉。错误日志是某种程度上不可访问的。
我有类似的问题，并通过确保 http 在我的nginx.conf中加载正确的 mime.types 映射：
http {
include /etc/nginx/mime.types;
}
my nginx server serves an index.html file, which loads a css file and some js files. the css file is loaded (NO 404), but the style doesn't appear.
folders :
/src
/assets
/images
...
/sounds
...
/css
/style.css
/js
...
index.html
sound and images loaded by the js files work perfectly.
/etc/nginx/sites-enabled/default/ :
server {
listen 8080;
server_name jumpnrun jumpnrun.vm;
access_log /var/log/nginx/jumpnrun.access.log;
error_log /var/log/nginx/jumpnrun.error.log;
location / {
try_files $uri $uri/index.html;
}
location ~ ^/(assets/|css/|js/|index.html) {
root /src;
index index.html;
access_log off;
}
location /socket.io {
add_header Access-Control-Allow-Origin *;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_http_version 1.1;
proxy_pass http://node-server;
}
}
index.html :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Jump n' Run</title>
<link href="css/style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<canvas id="game" width='1000' height='500'></canvas>
<button class="sound"></button>
</body>
<!-- JS -->
</html>
if i go to localhost:8080 it gives me the index page but without any styling and the dev tools doesn't show me any errors.
thanks for your help!
EDIT:
The whole thing is in a docker container.. Now every time i browse to localhost:8080 nginx dies. error log is somehow not accessible..
I had a similar problem and resolved it by making sure the http block in my nginx.conf was loading the proper mime.types mappings:
http {
include /etc/nginx/mime.types;
}
这篇关于Nginx发现css，但不会将其加载到index.html中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
