JavaScript跨域核心难点是PNA与CORS叠加：PNA在请求发出前拦截（需Access-Control-Allow-Private-Network:true或HTTPS+代理），CORS在响应后拦截（需后端配全CORS头）；企业内网必须分层解决，开发用多级代理，生产收敛至统一HTTPS反向代理。
在复杂的企业内网中处理 JavaScript 跨域，核心难点不是单纯的“浏览器拦请求”，而是多层网络隔离、混合协议（HTTP/HTTPS）、私有地址（如 10.x.x.x、192.168.x.x、localhost）、安全策略（如 Private Network Access）、以及后端服务分散部署带来的协同成本。此时单纯配 CORS 或简单代理往往失效，需组合策略+分层应对。
识别真实拦截环节：先分清是 PNA 还是 CORS
企业内网常见报错不止 CORS policy，还常出现：
-
The request client is not a secure context and the resource is in more-private address space→ 浏览器“私有网络访问限制”（PNA）触发，发生在请求发出去之前； -
Blocked by CORS policy: No 'Access-Control-Allow-Origin' header→ 请求已发出且后端响应了，但缺少或不匹配 CORS 头。
二者必须分开处理：PNA 是浏览器强制安全策略，CORS 是服务端协商机制。若同时存在，必须先解 PNA，再解 CORS。
解决私有网络访问限制（PNA）
Chrome、Edge、Firefox 自 2022 年起默认阻止公网页面（如 https://hr.company.com）通过 JS 访问内网 HTTP 接口（如 http://10.1.5.20:8080/api/user）。解决方案分服务端和客户端两路：
立即学习“Java免费学习笔记（深入）”；
- 服务端响应头必须加：
Access-Control-Allow-Private-Network: true（注意：仅对 HTTPS 页面有效，且需配合其他 CORS 头）； - 若前端为 HTTP 协议（如本地
http://localhost:3000），则无法绕过 PNA —— 此时必须改用 HTTPS 开发服务（如 Vite 的server.https: true+ 自签名证书），或统一走代理中转，让浏览器始终与 HTTPS 同源地址通信； - 开发调试阶段可临时关闭浏览器 PNA 检查（仅限本机）：
Chrome/Edge：访问chrome://flags/#block-insecure-private-network-requests→ 设为 Disabled；
Firefox：about:config→ 搜索network.http.referer.hidePrivateNetworks和network.http.referer.blockInsecurePrivateNetworks→ 全部设为 false。
代理配置要穿透多级内网拓扑
企业内网常含防火墙、DMZ 区、API 网关、多个后端集群（如 HR 系统跑在 172.16.10.5:8001，审批系统在 10.20.30.100:9002）。前端开发代理不能只写一个 target，而应按业务域拆分，并支持动态路由：
- Vite 中配置多代理规则（
vite.config.ts）：/hr-api→http://172.16.10.5:8001/oa-api→http://10.20.30.100:9002/auth→https://gateway.intra.company.com/auth（带 TLS） - 关键参数必须开启：
changeOrigin: true（重写 Host 头，避免网关拒绝）；secure: false（对接 HTTP 内网服务时必需）；rewrite去前缀，确保路径语义一致； - 若某后端要求固定
Origin头（如某些老 OA 系统），可在代理中注入：headers: { Origin: 'https://intranet.company.com' }。
生产环境必须收敛到同源或反向代理
开发期用代理只是权宜之计。上线后绝不能让前端直连内网地址（暴露 IP、绕过网关鉴权、违反安全审计）。正确做法是：
- 所有内网 API 统一由公司级 Nginx / API 网关反向代理，对外暴露
https://api.company.com/hr/...等路径； - 前端构建时将 API 基地址设为
import.meta.env.VITE_API_BASE = '/api'，所有请求走相对路径； - Nginx 配置示例：
location /api/hr/ { proxy_pass http://172.16.10.5:8001/; }location /api/oa/ { proxy_pass http://10.20.30.100:9002/; }
同时在proxy_set_header中补全 CORS 和 PNA 头，实现一次配置、全局生效。
