Nginx failing to load CSS and JS files (MIME type error)

Nginx加载静态文件失败的解决方法(MIME type错误)

上线新的页面,需要在nginx上配置路由, 配置完成后发现页面没有正常加载,提示:style.css未加载,因为其MIME类型“text / html”不是“text / css” ; 线下nginx的配置是正常的,因此对比两者配置发现线上的ng的http 部分多了一行

add_header Content-Type 'text/html; charset=utf-8';

将其注释即可;

重启nginx ,刷新后有时正常(两台机器修改了一台),说明已经生效;重启另外一台ng问题得到解决;

其他的解决办法:

配置文件:

/etc/nginx/nginx.conf

user  nginx;
worker_processes ; error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid; events {
worker_connections ;
} http {
include /etc/nginx/mime.types;
default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on;
#tcp_nopush on; keepalive_timeout ; #gzip on; include /etc/nginx/conf.d/*.conf;
}

/etc/nginx/conf.d/default.conf

server {
listen ;
server_name localhost; #charset koi8-r;
#access_log /var/log/nginx/log/host.access.log main; location / {
root /usr/share/nginx/html;
index index.html index.htm index.php;
fastcgi_pass 127.0.0.1:;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME /usr/share/nginx/html$fastcgi_script_name;
include fastcgi_params;
} #error_page /.html; # redirect server error pages to the static page /50x.html
#
error_page /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
} # proxy the PHP scripts to Apache listening on 127.0.0.1:
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#} # pass the PHP scripts to FastCGI server listening on 127.0.0.1:
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#} # deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}

/etc/nginx/mime.types

types {
text/html html htm shtml;
text/css css;
text/xml xml;
image/gif gif;
image/jpeg jpeg jpg;
application/x-javascript js;
application/atom+xml atom;
application/rss+xml rss;
..........................................
other types here
..........................................
}

放置include /etc/nginx/mime.types;下的位置/ {而不是下http

Nginx failing to load CSS and JS files (MIME type error)的更多相关文章

  1. 在vue项目npm run build后,index.html中引入css和js 报MIME type问题

    问题: 1.在vue项目中,build打包后,index页面打开会报错, MIME type ('text/html') ;报错内容:because its MIME type ('text/html ...

  2. nginx实现动态分离,解决css和js等图片加载问题

    改帖专门为使用nginx,通过nginx把请求转发到web服务器再返回客户端的时候,解决css和js和图片加载不出来的问题. 如果没安装nginx,请访问一下地址进行安装 http://www.cnb ...

  3. nginx 无法加载css/js图片等文件 404 not fund

    刚配置Nginx反向代理,Nginx可能会出现无法加载css.js或者图片等文件,这里需要在配置文件*.conf里面加上如下配置项. location ~ .*\.(js|css|png|jpg)$ ...

  4. JQuery 加载 CSS、JS 文件

    JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) { var head = document.getElementsByTagN ...

  5. html、css、js的命名规范

    最佳原则 坚持制定好的代码规范. 无论团队人数多少,代码应该同出一门. 项目命名 全部采用小写方式, 以下划线分隔. 例:my_project_name 目录命名 参照项目命名规则: 有复数结构时,要 ...

  6. wp加载本地HTML(附带图片,CSS,JS)

    wp加载本地HTML(附带图片,CSS,JS) Windows Phone:Load Local HTML with Img,Css,Js by 唐小崇 http://www.cnblogs.com/ ...

  7. Django2.0引入css、js、img文件

    Django2.0引入css.js.img文件 一.文件结构 二.settings.py的配置 # Static files (CSS, JavaScript, Images) # https://d ...

  8. ASP.NET 打包多CSS或JS文件以加快页面加载速度的Handler

    ASP.NET 打包多CSS或JS文件以加快页面加载速度的Handler, 使用<link type="text/css" rel="Stylesheet" ...

  9. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

随机推荐

  1. sass学习笔记(一)接上个 持续学习中..(还发现个讲解的bug) sass至少我现在学的版本支持局部变量了

    6.全局变量 sass暂时没有局部变量 局部定义变量会覆盖全局变量 新出!global 不过要sass 3.4版本以后        (这句呢,,我觉得是错的 开始写的时候没测试 现在发现我觉得他是有 ...

  2. 汉诺塔问题-递归实现-JAVA

    public class hanio { /** * @param args */ public static void main(String[] args) { // TODO Auto-gene ...

  3. C# WebAPI分页实现分享

    第一次分享代码,不足或不对之处请指正.. 需求:微信端传递不同的参数调用WebAPI进行分页查询菜谱计划点评结果 思路:基于视图来查询,根据传递的不同参数拼接分页查询Sql来查询. 分页的sql如下 ...

  4. css中关于单位的一些问题

    Css中关于单位的一些问题 相对字体长度: Em:Em 是一个相对单位.起初排版度量时是基于当前字体大写字母”M”的尺寸的.当改变font-family时,它的尺寸不会发生改变,但在改变font-si ...

  5. pytorch 读数据接口 制作数据集 data.dataset

    [吐槽] 啊,代码,你这个大猪蹄子 自己写了cifar10的数据接口,跟官方接口load的数据一样, 沾沾自喜,以为自己会写数据接口了 几天之后,突然想,自己的代码为啥有点慢呢,这数据集不大啊 用了官 ...

  6. [转载] java多线程总结(二)

    转载自:http://www.cnblogs.com/lwbqqyumidi/p/3817517.html 作者:Windstep 四.Java多线程的阻塞状态与线程控制 上文已经提到Java阻塞的几 ...

  7. centos7 十万并发 关健配置

    vim /etc/sysctl.conf,添加 --开机启动加载内核参数:fs.file-max = 65535kernel.sem=250 32000 100 128 /proc/sys/kerne ...

  8. python—函数

    # 函数:1.减少重复代码:# 2.使程序变的可扩展# 3.使程序变的易维护# 永远只能且返回一个值#def 定义内容# a,b = 5,8# c = a** b# print(c)## def ca ...

  9. 我的第一篇博客:vue-cli配置项目

    注意:在安装vue-cli之前一定要确保安装了node和vue 安装配置node:下载node(https://nodejs.org/en/)然后一路无脑安装 查看安装是否成功:node –versi ...

  10. python爬虫,使用urllib2库报错

    urllib2发生报错URLError: <urlopen error [Errno 10061]:首先检查网址是否正确其次如果报这种错误,是因为ie里设置了代理,取消即可, 步骤: 打开IE浏 ...