yunqueai/ai_dianshang

Fork 0

Files

sjk 5683f35942 web

2025-11-28 15:18:10 +08:00

4.0 KiB

Raw Blame History

HTTPS 跨域问题解决方案

问题说明

你的 Web 前端部署在 https://gvizee.com/（HTTPS），而后端 API 在 http://104.244.91.212:8060（HTTP）。

这会导致两个问题：

混合内容错误：HTTPS 页面无法访问 HTTP 接口（浏览器安全策略）
CORS 跨域：需要正确配置 Origin

✅ 推荐解决方案：使用 Nginx HTTPS 反向代理

步骤 1：在服务器上生成 SSL 证书

# SSH 连接到你的服务器 104.244.91.212
ssh user@104.244.91.212

# 创建证书目录
sudo mkdir -p /etc/nginx/ssl

# 生成自签名证书（有效期 365 天）
sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
  -keyout /etc/nginx/ssl/server.key \
  -out /etc/nginx/ssl/server.crt \
  -subj "/C=US/ST=State/L=City/O=Organization/CN=104.244.91.212"

步骤 2：配置 Nginx

# 将项目根目录的 nginx-https-proxy.conf 上传到服务器
# 然后执行：

# 复制配置文件
sudo cp nginx-https-proxy.conf /etc/nginx/sites-available/api-https

# 创建软链接
sudo ln -s /etc/nginx/sites-available/api-https /etc/nginx/sites-enabled/

# 测试配置
sudo nginx -t

# 如果测试通过，重启 Nginx
sudo systemctl restart nginx

步骤 3：配置防火墙

# 允许 HTTPS 端口
sudo ufw allow 443/tcp

# 检查防火墙状态
sudo ufw status

步骤 4：验证 HTTPS 访问

# 测试 HTTPS 健康检查
curl -k https://104.244.91.212:8060/health

# 测试 API
curl -k https://104.244.91.212:8060/api/v1/banners

步骤 5：前端配置已更新

前端代码已经更新，gvizee.com 域名会自动使用 HTTPS：

// web/assets/js/api.js 已更新为：
if (hostname.includes('gvizee.com')) {
    return 'https://104.244.91.212:8060/api/v1';
}

后端 CORS 也已添加 HTTPS 支持。

🔧 方案二：临时使用 HTTP（仅测试）

如果暂时无法配置 HTTPS，可以：

选项 1：使用 HTTP 访问前端

访问 http://gvizee.com/（HTTP）而不是 https://gvizee.com/（HTTPS）

选项 2：临时修改前端配置

在浏览器控制台执行：

// 临时使用 HTTP
API_DEBUG.setBaseURL('http://104.244.91.212:8060/api/v1')
location.reload()

注意：这只是临时方案，刷新页面后会失效。

📋 生产环境推荐：使用 Let's Encrypt 免费证书

对于生产环境，建议使用 Let's Encrypt 的免费 SSL 证书：

# 安装 Certbot
sudo apt update
sudo apt install certbot python3-certbot-nginx

# 自动配置 HTTPS（需要域名）
sudo certbot --nginx -d gvizee.com -d www.gvizee.com

# 证书会自动续期
sudo certbot renew --dry-run

🔍 常见问题

Q1: 浏览器显示"不安全"警告？

A: 这是因为使用了自签名证书。在浏览器中点击"高级" → "继续访问"即可。生产环境请使用 Let's Encrypt 证书。

Q2: CORS 错误还是存在？

确认后端服务已重启
检查 Nginx 日志：sudo tail -f /var/log/nginx/api_error.log
在浏览器开发者工具中检查请求头的 Origin

Q3: 端口 8060 还需要监听吗？

A: 是的。架构是：

浏览器 → Nginx (443端口，HTTPS) → 后端服务 (8060端口，HTTP)
Nginx 作为反向代理处理 HTTPS，后端继续使用 HTTP

📊 架构示意图

浏览器 (https://gvizee.com)
    ↓ HTTPS
Nginx (443 端口)
    ↓ HTTP (内网)
Go 后端服务 (8060 端口)

✅ 检查清单

完成配置后，请检查：

SSL 证书已生成
Nginx 配置已更新并重启
防火墙 443 端口已开放
后端服务运行在 8060 端口
后端 CORS 配置包含 https://gvizee.com
前端代码已更新使用 HTTPS
浏览器能访问 https://104.244.91.212:8060/health

需要帮助？检查以下日志：

Nginx 错误日志：/var/log/nginx/api_error.log
Nginx 访问日志：/var/log/nginx/api_access.log
后端日志：查看 Go 服务的控制台输出

4.0 KiB Raw Blame History Unescape Escape