离线HTML网站开发中如何规避CORS问题？

刚好之前处理过不少类似的离线文档场景，给你整理几个实用的方案，全是针对无服务器、纯本地文件访问的情况，完全适配你说的这种极简架构（一个index.html加一个resources文件夹）：

• 优先使用相对路径，绝对别碰绝对路径或file://协议路径
  这是最基础也最有效的办法。比如你要引用resources里的图片，直接写./resources/logo.png或者resources/script.js就行，绝对不要写file:///D:/usb/resources/logo.png这种带盘符或完整file路径的地址。
  另外你提到的document.domain，在离线场景下完全不需要设置——因为根本没有域名，强行设置反而会触发浏览器的安全检查，直接忽略这个属性就好。

• 把资源内联到HTML中（超极简场景首选）
  如果你的网站真的很简单，直接把所有资源塞进index.html里：CSS写在<style>标签里，图片转成Base64编码嵌入<img>标签，JS写在<script>标签里，甚至把JSON数据直接定义成全局变量（比如<script>const appData = {"name": "xxx"};</script>）。
  这样整个网站就是一个独立的HTML文件，完全不存在跨域的可能，特别适合U盘里的便携文档，用户打开就能用，不用管任何设置。

• 调整浏览器启动参数（针对需要JS读取本地文件的场景）
  如果你的JS需要读取本地其他文件（比如resources里的JSON数据），且用相对路径还是触发了CORS拦截，可以让用户调整浏览器的启动参数：

  • Chrome/Edge：右键快捷方式，在目标栏最后加上 --allow-file-access-from-files（注意前面有空格），启动后就能允许file协议下的跨域请求；
  • Firefox：在地址栏输入about:config，找到security.fileuri.strict_origin_policy，把值改成false。
    不过要注意，这是临时的兼容方案，适合开发测试或者给有一定技术基础的用户说明，普通用户可能嫌麻烦，所以优先用前两个方案。

最后再提个小提醒：别在代码里用任何跨域相关的配置（比如CORS头、document.domain），离线场景下这些配置不仅没用，还可能帮倒忙。

内容来源于stack exchange