为什么本地 HTML、JS、JSON 文件会出现跨域问题？

跨域问题的本质是浏览器的 同源策略（Same-Origin Policy） 限制。即使文件都在本地，以下情况也会触发跨域：

1. 文件协议不同（核心原因）

当直接用浏览器打开本地 HTML（file:///C:/project/index.html）时，源（Origin）会被视为 null。

如果此 HTML 中的 JS 尝试通过 fetch 或 XMLHttpRequest 加载同目录的 JSON 文件（file:///C:/project/data.json），浏览器会判定为跨域请求（源 null → file:// 协议），导致失败。

即使协议相同，如果 HTML 文件和 JSON 文件的目录路径不同（例如：file:///C:/project1/index.html 和 file:///C:/project2/data.json），也会触发跨域。

浏览器禁止从 file://协议发起网络请求（包括本地 JSON），因为本地文件可能包含敏感信息，同源策略会阻止 JS 随意读取它们。

通过工具启动一个本地 HTTP 服务器，使所有文件通过 http://localhost 协议访问：

Python 内置服务器：

通过浏览器启动参数禁用安全策略：

通过本地服务器加载 JSON：

浏览器同源策略不会因为文件在本地就放宽限制。本地开发务必使用 HTTP 服务器（如 http-server 或 Live Server），这是最安全、规范的解决方案。直接双击打开 HTML 文件必然触发跨域问题。

搭建自己的技术博客有什么意义？

windows修改服务器远程桌面端口图文教程

当前文章地址：http://www.shangwukj.cn/post/5940/27527.php