nginx管理靜態(tài)文件的location配置問(wèn)題,nginx轉(zhuǎn)發(fā)到nodejs的問(wèn)題

nginx 管理靜態(tài)頁(yè)面，然后將數(shù)據(jù)頁(yè)面的請(qǐng)求轉(zhuǎn)發(fā)到nodejs，為什么只能拿到index.html？
頁(yè)面數(shù)據(jù)請(qǐng)求該如何轉(zhuǎn)發(fā)到nodejs--8080端口應(yīng)該不需要防火墻開(kāi)放吧

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include            mime.types;
    default_type       application/octet-stream;
    sendfile           on;
    keepalive_timeout  65;
    gzip  on;

    server {
        listen        80;
        rewrite ^(.*)$  https://$host$1 permanent;
    }

    server {
        listen       443 ssl;
        server_name  ljwzz.xyz;

        ssl_certificate      1.crt;
        ssl_certificate_key  1.key;

        ssl_protocols        TLSv1 TLSv1.1 TLSv1.2;
        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;

        ssl_ciphers          ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers  on;



        location  / {
            root   html;
            index  index.html;
           }

        location /favicon.ico {
            root   html;
        }

        location ^~ /static/ {
            root    html/static;
        }


        # location / {
        #     proxy_pass http://127.0.0.1:8080/;
        # }

        error_page 404    /404.html;

        error_page 500 502 503 504  /50x.html;

        location = /50x.html {
            root   html;
        }
    }
}

瀏覽器錯(cuò)誤（）

網(wǎng)址/:1 GET https://網(wǎng)址/static/css/app.788ade4b8ad34482e3f85e0ee52745fb.css net::ERR_ABORTED
網(wǎng)址/:1 GET https://網(wǎng)址/static/js/manifest.2ae2e69a05c33dfc65f8.js net::ERR_ABORTED
網(wǎng)址/:1 GET https://網(wǎng)址/static/js/app.fba152483a9d7ae39f17.js net::ERR_ABORTED
網(wǎng)址/:1 GET https://網(wǎng)址/static/js/vendor.65142fefac425d6e5f53.js net::ERR_ABORTED
網(wǎng)址/:1 GET https://網(wǎng)址/static/js/app.fba152483a9d7ae39f17.js net::ERR_ABORTED

文件結(jié)構(gòu)

.
|-- 50x.html
|-- index.html
`-- static
    |-- css
    |   |-- app.788ade4b8ad34482e3f85e0ee52745fb.css
    |   `-- app.788ade4b8ad34482e3f85e0ee52745fb.css.map
    |-- fonts
    |   `-- element-icons.6f0a763.ttf
    `-- js
        |-- app.fba152483a9d7ae39f17.js
        |-- app.fba152483a9d7ae39f17.js.map
        |-- manifest.2ae2e69a05c33dfc65f8.js
        |-- manifest.2ae2e69a05c33dfc65f8.js.map
        |-- vendor.65142fefac425d6e5f53.js
        `-- vendor.65142fefac425d6e5f53.js.map

回答

編輯回答

祉小皓

如果是新配https，建議一開(kāi)始先用302跳轉(zhuǎn)而不是301，因?yàn)?02是臨時(shí)轉(zhuǎn)移而301是永久，而后者通常會(huì)被瀏覽器緩存，即便變配的話(huà)默認(rèn)也會(huì)跳轉(zhuǎn)，而一旦配置有問(wèn)題的話(huà)就會(huì)一直無(wú)法訪(fǎng)問(wèn)（當(dāng)然清緩存能解決），影響對(duì)出錯(cuò)位置的判斷。
30x跳轉(zhuǎn)不用寫(xiě)那么復(fù)雜，直接return 301 https://域名$request_uri;就行。
看到幾個(gè)location塊里的root是重復(fù)的，可以提出來(lái)共享。
可以加條pid指令，變配時(shí)平滑重啟會(huì)比較方便（省得去找pid了）。
location /里可能要加個(gè)try_files指令。
有時(shí)候懶得手寫(xiě)可以用NginxConfig生成，順便還把縮進(jìn)啥的做好了……

試試：

worker_processes  1;
pid logs/nginx.pid;

events {
    worker_connections  1024;
    multi_accept on;
}
http {
    charset            utf-8;
    include            mime.types;
    default_type       application/octet-stream;
    sendfile           on;
    tcp_nopush         on;
    tcp_nodelay        on;
    keepalive_timeout  65;
    
    gzip  on;
    
    access_log logs/access.log;
    error_log logs/error.log warn;

    server {
        listen         443 ssl;
        server_name    ljwzz.xyz;
        root           html;
        index          index.html

        ssl_certificate      1.crt;
        ssl_certificate_key  1.key;

        ssl_protocols        TLSv1 TLSv1.1 TLSv1.2;
        ssl_session_cache    shared:SSL:1m;
        ssl_session_timeout  5m;
        ssl_ciphers          ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers  on;

        location  / {
            index       index.html;
            try_files   $uri $uri/ /index.html;
        }

        location ~ /\. {
            deny all;
        }

        error_page 404   /404.html;
        error_page 500 502 503 504  /50x.html;
    }
    server {
        listen 80;
        server_name *.ljwzz.xyz;
        return 302 https://www.ljwzz.xyz$request_uri;
    }
}

2017年9月1日 05:52

編輯回答

玩控

1、static既然已包含在html目錄中，那么location ^~ /static/ {的配置可以刪掉了；
2、如果使用了vue-router，那么location /配置中還需要添加try_files $uri $uri/ /index.html last;，來(lái)保證路由頁(yè)面刷新可訪(fǎng)問(wèn)；

參考配置：

# FrontEnd
location / {
    root   html;
    index  index.html;
    try_files $uri $uri/ /index.html last;
}
# 可選配置，如果static不包含在html目錄或在其他路徑
location /static {
    alias   /path/static/; # 注意使用 alias 而非 root
}
# Node API
location /api/ {
    proxy_pass http://127.0.0.1:3000;
}

2018年1月28日 09:37

編輯回答