部署在Vercel的ChatUI应用出现net::ERR_CERT_AUTHORITY_INVALID错误

问题根源 #

你添加的upgrade-insecure-requests标签会强制将页面内所有HTTP请求升级为HTTPS，但你的目标API仅支持HTTP，且没有配置有效的SSL证书。当浏览器尝试访问该API的HTTPS地址时，会因为证书不被信任抛出ERR_CERT_AUTHORITY_INVALID错误。

可行解决方案 #

方案1：为API配置合法HTTPS证书 #

给你的API服务器（3.111.128.67）部署有效的SSL证书（比如Let's Encrypt的免费证书），确保HTTPS可以正常访问。之后将前端请求地址改为https://3.111.128.67/assignment/chat?page=0，即可解决证书验证问题。

方案2：在Vercel配置反向代理（推荐） #

通过Vercel的代理功能，让前端请求走同域名的HTTPS接口，由Vercel转发到目标HTTP API，避免浏览器直接发起跨协议请求：

1. 在项目根目录创建vercel.json文件
2. 添加以下代理配置：

   {
     "routes": [
       {
         "src": "/api/chat(.*)",
         "dest": "http://3.111.128.67/assignment/chat$1"
       }
     ]
   }
   

3. 修改前端代码中的请求地址为/api/chat?page=0，部署后Vercel会自动将该请求转发到目标API。

补充说明 #

upgrade-insecure-requests的作用是强制升级HTTP请求为HTTPS，但它无法解决目标地址无有效HTTPS证书的问题，这也是为什么添加标签后仍报错的原因。

内容的提问来源于stack exchange，提问作者Gaurav Tak