解决docker容器静态资源404

原因

今天在部署私有代码仓库的时候,发现使用nginx反向代理之后,部分静态资源出现404,解决过程这里记录下

反向代理

反向代理配置如下;之前的也是使用docker部署,但是并未出现

Nginx

location / {
         # 反向代理
         proxy_pass http://IP:端口号;
         proxy_set_header Host $host:$server_port;
         proxy_set_header X-NginX-Proxy true;
         proxy_set_header X-Real-IP $remote_addr;
         proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header X-Forwarded-Proto $scheme;
         proxy_set_header REMOTE-HOST $remote_addr;
         # 缓存
         add_header X-Cache $upstream_cache_status;
         add_header Cache-Control no-cache;
         expires 12h;
}

解决方法

核心原因是因为需要给静态文件也添加一个反向代理,需要在80端口和443都添加。若没有TLS可只添加80端口一项配置如下:

Nginx

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
    expires 30d;
    #解决反向代理无法访问图片
    proxy_pass http://127.0.0.1:8080; #反向代理地址和端口
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
location ~ .*\.(js|css)?$ {
    expires 12h;
    #解决反向代理无法访问图片
    proxy_pass http://127.0.0.1:8080; #反向代理地址和端口
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

完整配置如下

Nginx

server {
    listen 80;
    #listen [::]:80;
    server_name test.zdynb.cn;
    return 301 https://test.zdynb.cn$request_uri; #301强制https,不通过http访问
    #error_page   404   /404.html;
    # Deny access to PHP files in specific directory
    #location ~ /(wp-content|uploads|wp-includes|images)/.*\.php$ { deny all; }
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
        expires 30d;
        #解决反向代理无法访问图片
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    location ~ .*\.(js|css)?$ {
        expires 12h;
        # 解决反向代理无法js/css
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    location ~ /.well-known {
        allow all;
    }
    location ~ /\. {
        deny all;
    }
    location / {
        return 301 https://test.zdynb.cn$request_uri; # 此处为let`s encrypt自动续签必须添加的配置
        # 反向代理
        proxy_pass http://localhost:8080;
        proxy_set_header Host $host:$server_port;
        proxy_set_header X-NginX-Proxy true;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header REMOTE-HOST $remote_addr;
        # 缓存
        add_header X-Cache $upstream_cache_status;
        add_header Cache-Control no-cache;
        expires 12h;
    }
    access_log off;
}
server {
    listen 443 ssl http2;
    #listen [::]:443 ssl http2;
    server_name test.zdynb.cn;
    ssl_certificate /usr/local/nginx/conf/ssl/code.zdynb.cn/fullchain.cer;
    ssl_certificate_key /usr/local/nginx/conf/ssl/code.zdynb.cn/code.zdynb.cn.key;
    ssl_session_timeout 5m;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
    ssl_prefer_server_ciphers on;
    ssl_ciphers "TLS13-"; #此处md5已删除
    ssl_session_cache builtin:1000 shared:SSL:10m;
    # openssl dhparam -out /usr/local/nginx/conf/ssl/dhparam.pem 2048
    ssl_dhparam /usr/local/nginx/conf/ssl/dhparam.pem;
    # Deny access to PHP files in specific directory
    #location ~ /(wp-content|uploads|wp-includes|images)/.*\.php$ { deny all; }
    include enable-php.conf;
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$ {
        expires 30d;
        #解决反向代理无法访问图片
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    location ~ .*\.(js|css)?$ {
        expires 12h;
        # 解决反向代理无法js/css
        proxy_pass http://127.0.0.1:8080;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
    location ~ /.well-known {
        allow all;
    }
    location ~ /\. {
        deny all;
    }
    location / {
        # 反向代理
        proxy_pass http://localhost:8080;
        proxy_set_header Host $host:$server_port;
        proxy_set_header X-NginX-Proxy true;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header REMOTE-HOST $remote_addr;
        # 缓存
        add_header X-Cache $upstream_cache_status;
        add_header Cache-Control no-cache;
        expires 12h;
    }
    access_log off;
}

重载nginx配置

修改完成之后我们重启nginx或者重载配置

Bash

nginx -t; # 检查配置文件是否有错,有错会导致nginx无法启动
nginx -s reload # 重新加载nginx配置文件
声明:本站为非盈利个人记录网站多数图片来自于正版授权,少部分转载自网络,原创内容版权归本站所有,转载内容归原作者所有。如有内容、图片、信息侵犯到您的合法权益,请联系我(7@7zz.cn)做删除处理。

给TA打赏
共{{data.count}}人
人已打赏
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索