2012-04-09 32 views
52

Gần đây tôi đã quyết định chuyển từ Apache2 sang Nginx. Tôi đã cài đặt Nginx trên máy chủ CentOS và thiết lập cấu hình cơ bản. Khi tôi cố gắng tải trang web của mình trong trình duyệt (FF/Chrome), tôi nhận thấy rằng tệp css không được tải. Tôi đã kiểm tra các lỗi giao diện điều khiển và thấy thông báo này:Nginx không tải được các tệp css

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

Tôi đã kiểm tra cấu hình Nginx và mọi thứ có vẻ là tốt:

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

Các loại mime cho các tập tin css được thiết lập một cách chính xác trong/etc/nginx/mime.types.

text/css css;

Tất cả mọi thứ dường như được cấu hình tốt nhưng file css của tôi vẫn chưa được nạp. Tôi không có lời giải thích.

Một điều đáng nhắc đến khác. Ban đầu tôi cài đặt Nginx sử dụng kho chứa epel và tôi có phiên bản cũ: 0.8 ... Có vẻ như vấn đề của tôi là lỗi trong phiên bản đó nên tôi đã gỡ cài đặt phiên bản 0.8, thêm nginx repository vào yum rồi cài đặt phiên bản mới nhất: 1.0. 14. Tôi nghĩ rằng phiên bản mới sẽ giải quyết vấn đề của tôi, nhưng tiếc là nó không vì vậy tôi đang chạy ra khỏi ý tưởng.

Tôi đánh giá cao bất kỳ trợ giúp nào.

file cấu hình:

/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 
    .......................................... 
} 
+0

hãy dán mã cấu hình của bạn. thường bạn đã xử lý tốt các loại khác và bỏ qua phần tệp công khai của bạn khiến nội dung như css và hình ảnh trả lại lỗi 404 hoặc trong trường hợp của bạn, lỗi loại mime – Kristian

Trả lời

21

Tôi tìm thấy giải pháp thay thế trên web. Tôi thêm vào /etc/nginx/conf.d/default.conf sau đây:

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

Vấn đề bây giờ là một yêu cầu đến file css của tôi không được chuyển hướng tốt, như thể gốc không được thiết lập một cách chính xác. Trong error.log tôi thấy

2012/04/11 14:01:23 [lỗi] 7260 # 0: * 2 open() "/etc/nginx//html/style.css"

Vì vậy, như một workaround thứ hai tôi đã thêm gốc vào từng vị trí được xác định. Bây giờ nó hoạt động, nhưng có vẻ hơi dư thừa. Gốc không được kế thừa từ/vị trí?

+2

Đây có phải là lỗi nginx không? Đây là cách duy nhất tôi có thể làm cho nó hoạt động. Bằng cách này tôi đang sử dụng Arch Linux, nginx 1.4.1-3. – tprk77

+0

@ tprk77 không phải là một lỗi, câu trả lời được chấp nhận là một công việc xung quanh, cho một giải pháp thích hợp xem câu trả lời của tôi http://stackoverflow.com/a/23282158/1481489 – zamnuts

57

Đặt include /etc/nginx/mime.types; dưới location/{ thay vì dưới http { giải quyết được vấn đề cho tôi.

+2

cũng lưu ý, rằng nếu bạn đang bắt đầu cấu hình từ đầu - ngoại trừ các loại mime có thể - 'include mime.types;' thực hiện công việc của nó, vì (ít nhất là trên các cửa sổ, nginx 1.5.2) nó chỉ tương đối so với các tệp cấu hình khác. – omilke

+4

cũng lưu ý rằng bạn nên làm mới hoàn toàn trang web trong trình duyệt của mình, ví dụ: sử dụng ctrl + f5 để làm mới để tránh bị lưu các tệp có tiêu đề không đúng. – CarelZA

+0

Điều này thật đáng ngạc nhiên! Cai gi??! – rclai

5

Tôi cũng gặp sự cố này.Nó bối rối tôi cho đến khi tôi nhận ra những gì đã sai:

Bạn có thế này:

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

Bạn muốn điều này:

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

dường như thể là một lỗi trong nginx hay sự thiếu hụt trong tài liệu (điều này có thể là hành vi dự định, nhưng nó là lẻ)

+3

điều này không giải quyết được vấn đề trên cửa sổ với nginx/1.6.0 – zamnuts

15

style.css thực sự đang được xử lý qua fastcgi do chỉ thị "vị trí /" của bạn. Vì vậy, nó là fastcgi được phục vụ lên các tập tin (nginx > fastcgi > filesystem), và không phải là hệ thống tập tin trực tiếp (nginx > filesystem).

Vì lý do tôi chưa tìm ra (tôi chắc chắn có chỉ thị ở đâu đó), NGINX áp dụng loại mime text/html cho bất kỳ thứ gì được phân phối từ fastcgi, trừ khi ứng dụng phụ trợ rõ ràng nói khác.

Thủ phạm chính là này khối cấu hình cụ thể:

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

Nó nên là:

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

Sự thay đổi này làm cho chắc chắn chỉ *.php file được yêu cầu từ fastcgi. Tại thời điểm này, NGINX sẽ áp dụng kiểu MIME chính xác. Nếu bạn có bất kỳ việc viết lại URL nào xảy ra, bạn phải xử lý số này trước chỉ thị vị trí (location ~\.php$) để phần mở rộng chính xác được bắt nguồn và định tuyến chính xác đến fastcgi.

Hãy nhớ xem this article regarding additional security considerations using try_files. Với những tác động bảo mật, tôi coi đây là một tính năng chứ không phải lỗi.

+1

đây phải là câu trả lời được chấp nhận, xem thêm: http://forum.nginx.org/read.php?2,155222 , 155261 # msg-155261 –

+1

Dường như đây vẫn là vấn đề, hơn 4 năm sau câu hỏi gốc. Cấu hình chính xác trông như thế nào nếu bạn chỉ phục vụ nội dung tĩnh, tức là ** không ** PHP? – rob

0

Tôi đã làm theo một số mẹo từ các câu trả lời còn lại và phát hiện ra rằng những hành động kỳ quặc này đã giúp (ít nhất là trong trường hợp của tôi).

1) Tôi thêm vào khối máy chủ như sau:

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

tôi nạp lại nginx và nhận được điều này trong error.log:

2015/06/18 11:32:29 [lỗi] 3430 # 3430: * 169 mở() "/etc/nginx/html/css/mysite.css" không thành công (2: Không có tệp hoặc thư mục như vậy)

2) Tôi đã xóa các hàng, tải lại nginx và nhận css làm việc. Tôi không thể giải thích điều gì xảy ra vì tệp conf của tôi đã trở thành như trước đây.

trường hợp của tôi là Xubuntu 14.04 sạch trên VirtualBox, nginx/1.9.2, một hàng 127.51.1.1 mysite trong/etc/hosts và /etc/nginx/nginx.conf khá đơn giản với một khối máy chủ:

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/; 
     } 
    } 
} 
-1

thêm tệp này vào tệp conf ngnix của bạn

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'"; 
0

Tôi gặp sự cố tương tự trong Windows. Tôi đã giải quyết thêm: bao gồm mime.types; dưới http { trong tệp nginx.conf của tôi. Sau đó, nó vẫn không hoạt động .. vì vậy tôi đã xem tập tin error.log và tôi nhận thấy nó đang cố gắng tính phí các tệp .css và javascript từ đường dẫn tệp nhưng với thư mục/http giữa. Ví dụ: .css của tôi là: "C: \ Users \ pc \ Documents \ nginx-server/máy chủ-web/css/index.css" và đã lấy từ: "C: \ Users \ pc \ Documents \ nginx-server/html /player-web/css/index.css " Vì vậy, tôi đã thay đổi thư mục web-player của mình bên trong thư mục html và nó hoạt động;)

Các vấn đề liên quan