NGINX can not load css

Question

I am newbie in nginx server.

My server is Centos.

I search on many web how to setup a server using LEMP. My website is using .htaccess to rewrite url which nginx is not supported, then I find try_files that help me do that but the CSS can not load.

> Resource interpreted as Stylesheet but transferred with MIME type
> text/html: "http://stg-owners.tamahome.jp/style.css".

I searched on google but nothing help

Here is my config

server {
listen       80;
server_name  localhost;

#charset koi8-r;
#access_log  /var/log/nginx/log/host.access.log  main;
#root   /var/www/owners;

#auth_basic "Secret Area";
#auth_basic_user_file "/etc/nginx/htpasswd/.owners_htpasswd";

location / {
    alias /var/www/owners/htdocs;
    index index.php index.html index.htm;
    include        /etc/nginx/mime.types;

    location ~ {
        root           /var/www/owners/htdocs;
        include        /etc/nginx/mime.types;
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME   $document_root$fastcgi_script_name;
        #fastcgi_param  PATH_INFO $uri;
        include        fastcgi_params;
        try_files $uri $uri/ /index.php?$args;
    }

    #location ~ .*\.(css|CSS)$ {
       #add_header Content-Type    text/css;
        #try_files $uri $uri/ *.css;
    #}

    #if ($request_filename ~* ^.*?/([^/]*?)$){
        #set $filename $1;
    #}

    #if ($filename ~* ^.*?\.css$){
        #add_header Content-Type    text/css;
    #}

    #location ~ \.css$ {
        #add_header  Content-Type    text/css;
    #}
    #location / {
        #if ($script_filename !~ "-f") {
            #rewrite !\.ico$ /index\.php break;
        #}
    #}
}

location /admin {
    alias   /var/www/admin;
    index  index.html index.htm index.php;
}

location /phpmyadmin {
    alias /usr/share/phpMyAdmin;
    index index.php;
    location ~ ^/phpmyadmin/(.+\.php)$ {
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_split_path_info ^/phpmyadmin/(.+\.php)(.*)$;
        fastcgi_param  SCRIPT_FILENAME  /usr/share/phpMyAdmin/$fastcgi_script_name;
        include        fastcgi_params;
    }
    break;
}


#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;
}
}

Here is the .htaccess

DirectoryIndex index.html index.php bukken.php

# rewrite関連
RewriteEngine On

RewriteRule .*/\.svn/.* / [F]
RewriteRule \.svn/.* / [F]

RewriteCond %{SCRIPT_FILENAME} !-f
RewriteCond %{SCRIPT_FILENAME} !-d
RewriteRule !\.ico$ index\.php [L]

# php.ini関連
php_flag session.auto_start 0
php_flag magic_quotes_gpc 0
php_value session.use_trans_sid 0
php_value session.use_cookies 1
php_value session.use_only_cookie 0
php_value session.gc_maxlifetime 14400
php_value upload_tmp_dir /tmp/upload
php_value post_max_size       32M
php_value upload_max_filesize 32M

php_value url_rewriter.tags "a=href,area=href,frame=src,form=,fieldset=,img=src"

Please help. Sorry for because my bad english

kodu.cloud · Accepted Answer · 2016-11-28 12:19:03Z

You should use something like that (that is just an example):

server {
listen       80;
server_name  localhost;

# In fact, it is not needed, it should be included by default in main config
include        /etc/nginx/mime.types;

#charset koi8-r;
#access_log  /var/log/nginx/log/host.access.log  main;
#root   /var/www/owners;

#auth_basic "Secret Area";
#auth_basic_user_file "/etc/nginx/htpasswd/.owners_htpasswd";

location ~* ^.+\.(jpg|jpeg|gif|png|svg|js|css|mp3|ogg|mpe?g|avi|zip|gz|bz2?|rar|swf)$ {
    root           /var/www/owners/htdocs;
    expires 10d;
} 
location / {
    root /var/www/owners/htdocs;
    index index.php index.html index.htm;


        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_param  SCRIPT_FILENAME   $document_root$fastcgi_script_name;
        #fastcgi_param  PATH_INFO $uri;
        include        fastcgi_params;
        try_files $uri $uri/ /index.php?$args;

    #location ~ .*\.(css|CSS)$ {
       #add_header Content-Type    text/css;
        #try_files $uri $uri/ *.css;
    #}

    #if ($request_filename ~* ^.*?/([^/]*?)$){
        #set $filename $1;
    #}

    #if ($filename ~* ^.*?\.css$){
        #add_header Content-Type    text/css;
    #}

    #location ~ \.css$ {
        #add_header  Content-Type    text/css;
    #}
    #location / {
        #if ($script_filename !~ "-f") {
            #rewrite !\.ico$ /index\.php break;
        #}
    #}
}

location /admin {
    alias   /var/www/admin;
    index  index.html index.htm index.php;
}

location /phpmyadmin {
    alias /usr/share/phpMyAdmin;
    index index.php;
    location ~ ^/phpmyadmin/(.+\.php)$ {
        fastcgi_pass   127.0.0.1:9000;
        fastcgi_index  index.php;
        fastcgi_split_path_info ^/phpmyadmin/(.+\.php)(.*)$;
        fastcgi_param  SCRIPT_FILENAME  /usr/share/phpMyAdmin/$fastcgi_script_name;
        include        fastcgi_params;
    }
    break;
}


#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;
}
}

So nginx will serve static files without proxying and use Content-Type defined in /etc/nginx/mime.types

Collectives™ on Stack Overflow

NGINX can not load css

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related