Nginx https反向代理http无法加载静态文件的问题

本文详细介绍如何通过修改Nginx配置文件,实现从HTTP到HTTPS的无缝切换,解决HTTPS页面加载HTTP静态资源的问题。包括配置重定向、SSL证书设置及HTTPS服务器块的详细步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

从阿里云拿到CA证书配置完后,域名能够成功跳转到https页面,但是由于ccs和js等静态组件是从http网站链接过来的,在https页面中无法正常加载,因此需要对nginx目配置文件进行修改,将http资源转换为https。
博主在这提供一个懒人方法,在nginx/.conf/添加一个 *.conf文件,复制以下内容。(如果你正在使用halo,用以下内容覆盖halo.conf,并根据注释做相应修改)

server {
       listen 80;
   
       server_name localhost;  #将localhost修改为您证书绑定的域名,例如:www.example.com。
       rewrite ^(.*)$ https://$server_name$1 permanent;   #将所有http请求通过rewrite重定向到https。
       client_max_body_size 1024m;
  }
  
# HTTPS server
  server {
  listen 443 ssl;   #SSL协议访问端口号为443。此处如未添加ssl,可能会造成Nginx无法启动。
  server_name localhost;  #将localhost修改为您证书绑定的域名,例如:www.example.com。
  root html;
  index index.html index.htm;
  ssl_certificate /etc/nginx/conf.d/cert/4273053_zkspace.top.pem;   #将domain name.pem替换成您证书的文件名。
  ssl_certificate_key /etc/nginx/conf.d/cert/4273053_zkspace.top.key;   #将domain name.key替换成您证书的密钥文件名。
  ssl_session_timeout 5m;
  ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;  #使用此加密套件。
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2;   #使用该协议进行配置。
  ssl_prefer_server_ciphers on;
 
  location / {
  
      add_header Content-Security-Policy upgrade-insecure-requests; #这里这个就是处理https反向代理http时候静态资源的关键
      proxy_set_header HOST $host;
      proxy_set_header X-Forwarded-Proto $scheme;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  
      proxy_pass http://127.0.0.1:端口/;                                                                                                            
 }
 }

  • ps:
    1.localhost可填写多个,用空格分隔。
    2.127.0.0.1指向服务器自身,端口值填写自己需要代理的服务端口。
    3.ssl_certificate和ssl_certificate_key的路径根据实际*.pem及*.key存放路径填写。


评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值