Вопросы Теги

Nginx not serving CSS correctly in simple PHP project

I've seen several examples of this now: Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:3001/assets/css/bootstrap.min.css". But, I've not been able to understand what might be causing it.

The CSS files in my simple PHP project are not being served. The status code is 200, and the file does load and its contents can be viewed from the developer console. I also checked the /etc/nginx/mime.types file and it has an entry for text/css. Finally, here's my site config:

server {
    listen 3001 default_server;
    listen [::]:3001 default_server;

    server_name _;

    location / { 
        root /media/common/code/projects/newdf;
        try_files $uri $uri/ =404;
        include fastcgi_params;
        fastcgi_index index.php;
        fastcgi_split_path_info ^(.+\.php)(/.+)$;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $document_root/$fastcgi_script_name;
    }   
}

Even in the code, the HTML tags specify the type as text/css:

<link rel="stylesheet" type="text/css" href="<?php echo $server_url; ?>/assets/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo $server_url; ?>/assets/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo $server_url; ?>/assets/css/animate.css">
<link rel="stylesheet" type="text/css" href="<?php echo $server_url; ?>/assets/css/style.css">

I'm at a loss to understand what's going on.

Interestingly, JS files are loaded without error, and if I run the site on the built-in PHP server, there are no problems.

3
задан 19 June 2017 в 17:36
1 ответ

Основная проблема заключается в том, что вы обслуживаете весь контент через php-fpm , как статический, так и динамический контент. Обычно nginx разрешает обслуживать статический контент, и в этом случае nginx отвечает за установку заголовка Content-Type на основе расширения файла.

В вашей текущей конфигурации все передается в php-fpm и получает значение по умолчанию Content-Type из text / html . Предположительно, вы отключили security.limit_extensions , чтобы эта работа работала.

Вы можете использовать два блока location , один для статического содержимого и один для динамического содержимого. Следующее основано на вашем вопросе и этом примере из nginx вики : 

server {
    listen 3001 default_server;
    listen [::]:3001 default_server;

    root /media/common/code/projects/newdf;
    index index.php;

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

    location ~ [^/]\.php(/|$) {
        fastcgi_split_path_info ^(.+?\.php)(/.*)$;
        if (!-f $document_root$fastcgi_script_name) {
            return 404;
        }

        include fastcgi_params;
        fastcgi_index index.php;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
        fastcgi_param HTTP_PROXY "";
        fastcgi_param SCRIPT_FILENAME $document_root/$fastcgi_script_name;
    }   
}

РЕДАКТИРОВАТЬ: Добавлен следующий упрощенный пример для приложений, которым не требуется информация о пути: 

server {
    listen 3001 default_server;
    listen [::]:3001 default_server;

    root /media/common/code/projects/newdf;
    index index.php;

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

    location ~ \.php$ {
        try_files $uri =404;

        include fastcgi_params;
        fastcgi_pass unix:/run/php/php7.0-fpm.sock;
        fastcgi_param HTTP_PROXY "";
        fastcgi_param SCRIPT_FILENAME $request_filename;
    }   
}
3
ответ дан 3 December 2019 в 06:27

Теги

Похожие вопросы