Question

我最近决定从Apache2切换到Nginx。我在CentOS服务器上安装了Nginx并设置了基本配置。当我尝试在浏览器（FF / Chrome）中加载我的网站时，我注意到没有加载css文件。我检查了错误控制台并看到了这条消息：

Error: The stylesheet http://example.com/style.css was not loaded because its MIME type, "text/html", is not "text/css".

我检查了Nginx配置，一切似乎都很好：

http {
    include /etc/nginx/mime.types;
    ..........
}

css文件的mime类型在/etc/nginx/mime.types中正确设置。

text/css css;

一切似乎配置得很好，但我的css文件仍未加载。我没有解释。

另一件值得一提的事。最初我使用epel存储库安装了Nginx，我得到了一个旧版本：0.8 ...在我看来，我的问题是该版本中的一个错误所以我卸载了0.8版本，将nginx存储库添加到yum然后安装了最新版本：1.0。 14。我认为新版本将解决我的问题，但不幸的是它没有解决我的想法。

我感谢任何帮助。

配置文件：

/etc/nginx/nginx.conf

user  nginx;
worker_processes  1;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


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  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;
}

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

server {
    listen       80;
    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:9000;
         fastcgi_index  index.php;
         fastcgi_param  SCRIPT_FILENAME  /usr/share/nginx/html$fastcgi_script_name;
         include        fastcgi_params;
    }

    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    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
    ..........................................
}

Answer 1

将include /etc/nginx/mime.types;放在location / {下而非http {下解决了这个问题。

Answer 2

我在网上找到了一种解决方法。我在/etc/nginx/conf.d/default.conf中添加了以下内容：

location ~ \.css {
    add_header  Content-Type    text/css;
}
location ~ \.js {
    add_header  Content-Type    application/x-javascript;
}

现在的问题是对我的css文件的请求没有很好地重定向，就像没有正确设置root一样。在error.log中我看到了

2012/04/11 14:01:23 [错误] 7260＃0：* 2 open（）“/ etc / nginx//html / style.css”

因此，作为第二种解决方法，我将根添加到每个定义的位置。现在它有效，但似乎有点多余。不是root继承自/ location吗？

Answer 3

style.css实际上是通过fastcgi处理的，因为你的位置/＆＃34;指示。所以fastcgi是提供文件（nginx > fastcgi > filesystem），而不是直接提供文件系统（nginx > filesystem）。

由于某个原因我还没弄明白（我确定那里有指令），NGINX将mime类型text/html应用于从fastcgi提供的任何内容，除非明确后端应用程序另有说法。

罪魁祸首就是这个配置块：

location / {
     root    /usr/share/nginx/html;
     index  index.html index.htm index.php;
     fastcgi_pass   127.0.0.1:9000;
     fastcgi_index  index.php;
     fastcgi_param  SCRIPT_FILENAME  /usr/share/nginx/html$fastcgi_script_name;
     include        fastcgi_params;
}

应该是：

location ~ \.php$ { # this line
     root    /usr/share/nginx/html;
     index  index.html index.htm index.php;
     fastcgi_split_path_info ^(.+\.php)(/.+)$; #this line
     fastcgi_pass   127.0.0.1:9000;
     fastcgi_index  index.php;
     fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name; # update this too
     include        fastcgi_params;
}

此更改确保只从fastcgi请求*.php个文件。此时，NGINX将应用正确的MIME类型。如果您正在进行任何URL重写，则必须在位置指令（location ~\.php$）之前处理此，以便派生正确的扩展并正确路由到fastcgi。

请务必查看this article regarding additional security considerations using try_files。鉴于安全隐患，我认为这是一个功能而不是错误。

Answer 4

我也遇到过这个问题。在我意识到错误之前，它让我很困惑：

你有这个：

include       /etc/nginx/mime.types;
default_type  application/octet-stream;

你想要这个：

default_type  application/octet-stream;
include       /etc/nginx/mime.types;

似乎是nginx中的错误或文档中的缺陷（这可能是预期的行为，但它很奇怪）

Answer 5

我从其余的答案中得到了一些提示，发现这些奇怪的行为有所帮助（至少在我的情况下）。

1）我在服务器块中添加了以下内容：

location ~ \.css {
 add_header Content-Type text/css;
}

我重新加载了nginx并在error.log中得到了这个：

2015/06/18 11:32:29 [错误] 3430＃3430：* 169 open（）“/ etc / nginx / html / css / mysters.css”失败（2：没有这样的文件或目录）< / p>

2）我删除了行，重新加载了nginx并得到了工作css。我无法解释发生了什么，因为我的conf文件变得像以前一样。

我的案例是关于VirtualBox，nginx / 1.9.2上的干净xubuntu 14.04，/ etc / hosts中的行127.51.1.1 mysite以及带有服务器块的非常简单的/etc/nginx/nginx.conf：

user nginx;
worker_processes 1;

error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include /etc/nginx/mime.types;

    server {
        listen 80;
        server_name mysite;

        location / {
            root /home/testuser/dev/mysite/;
        }
    }
}

Answer 6

我也面临这个问题，我尝试了很多解决方案，但没有一个对我真正有用

这是我的解决方法；

A 。将域文档根目录的所有权（例如我的根目录为/var/www/nginx-demo）授予Nginx用户（www-data），以避免任何权限问题：

sudo chown -R www-data: /var/www/nginx-demo

B。确认您的虚拟主机服务器块符合此标准（例如，我使用localhost作为我的server_name，而我的根目录是/var/www/nginx-demo/website）

server {
   listen 80;
   listen [::]:80;

   server_name localhost;

   root /var/www/nginx-demo/website;
   index index.html;

   location / {
            try_files $uri $uri/ =404;
   }
}

C 。测试Nginx配置的语法是否正确：

sudo nginx -t

如果配置语法中没有错误，则输出将如下所示：

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

D。重新启动Nginx服务以使更改生效：

sudo systemctl restart nginx

E。。使用键盘键 Ctrl + F5 或 Ctrl + Fn + F5硬刷新您的网站，以避免缓存的文件具有错误的标题。

仅此而已。

我希望这会有所帮助。

Answer 7

对我来说，这是网络浏览器上安装的广告拦截器。不允许加载style.css

Answer 8

我在Windows中遇到了同样的问题。我解决了它添加： include mime.types; 在我的nginx.conf文件中的 http {下。然后它仍然没有工作..所以我看了 error.log 文件，我注意到它试图从文件路径收取.css和javascript文件但是带有/ http之间的文件夹例如：我的.css在：＆＃34; C：\ Users \ pc \ Documents \ nginx-server / player-web / css / index.css＆＃34; 它取自：＆＃34; C：\ Users \ pc \ Documents \ nginx-server / html /player-web/css/index.css" 所以我在一个html文件夹中更改了我的player-web文件夹并且它有效;）

Answer 9

我实际上花了我的时间在这个页面上完成了上述所有答案，但无济于事。我刚碰巧使用以下命令更改了目录和子目录的所有者和权限。我使用以下内容将/usr/share/nginx/html中的Web项目目录的所有者更改为root用户：

chown root /usr/share/nginx/html/mywebprojectdir/*

最后使用：

chmod 755 /usr/share/nginx/html/mywebprojectdir/*

注意：如果拒绝，您可以使用 sudo

Answer 10

我遇到了同样的问题，以上内容均对我没有任何影响。什么工作是将我的位置php置于其他任何位置块之上。

location ~ [^/]\.php(/|$) {
fastcgi_split_path_info  ^(.+\.php)(/.+)$;
fastcgi_index            index.php;
fastcgi_pass             unix:/var/run/php/php7.3-fpm.sock;
include                  fastcgi_params;
fastcgi_param   PATH_INFO       $fastcgi_path_info;
fastcgi_param   SCRIPT_FILENAME $document_root$fastcgi_script_name;
}
** The below is specifically for moodle **
location /dataroot/ {
internal;
alias <full_moodledata_path>; # ensure the path ends with /
}

Answer 11

您应该在浏览器中完全刷新该网站，例如使用ctrl + f5刷新，以避免获得带有错误标题的缓存文件。

Answer 12

在您的nginx.conf文件中，将mime.types添加到http正文中，如下所示：
```
http {
    include /etc/nginx/mime.types;
    include /etc/nginx/conf.d/*.conf;
}
```
现在转到终端并运行以下命令以重新加载服务器：
```
sudo nginx -s reload
```
打开您的Web浏览器并进行硬重装：右键单击重装按钮，然后选择硬重装。在Chrome上，您可以执行 Ctrl + Shift + R

Answer 13

Debian 10.6上的Nginx 1.14.2出现了相同的问题。

可以通过设置CStudent *student = dynamic_cast<CStudent*>(Persons[i]); if (student) { // use student->getMatrikulNr() as needed... }变量来解决。通过在charset指令下面添加到服务器块中，将执行以下操作：

server_name

Answer 14

将此添加到您的ngnix配置文件

add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://ssl.google-analytics.com https://assets.zendesk.com https://connect.facebook.net; img-src 'self' https://ssl.google-analytics.com https://s-static.ak.facebook.com https://assets.zendesk.com; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://assets.zendesk.com; font-src 'self' https://themes.googleusercontent.com; frame-src https://assets.zendesk.com https://www.facebook.com https://s-static.ak.facebook.com https://tautt.zendesk.com; object-src 'none'";

Nginx无法加载css文件

14 个答案: