表单无法下载本地资源报错：Not allowed to load local resource

这个报错是浏览器的安全策略在起作用——浏览器禁止网页直接访问本地磁盘的file://资源，防止恶意网站未经授权读取你本地的文件内容，这是出于安全保护的考虑。你直接把本地路径D:\classes.zip写在form的action里，浏览器肯定会拦截这个请求。

下面是具体的解决步骤：

• 第一步：把文件放到Web服务器的可访问目录中
  你需要将classes.zip移动到你的Web项目目录下（比如项目根目录，或者专门创建一个downloads文件夹），这样服务器才能正确映射到这个文件，让网页可以合法请求它。

• 第二步：修改表单代码的路径
  把form的action改成相对路径，同时优化按钮的显示文本（不用写本地路径，用户看着也更清晰）。修改后的代码示例：

  <form method="get" action="classes.zip">
    <div class="col-xs-2">
      <input class="btn btn-profil btn-sm" name="downloadZIP" value="下载classes.zip" type="submit">
      <span class="btn-download"></span>
    </div>
  </form>
  

  如果文件放在downloads子文件夹里，就把action改成action="downloads/classes.zip"。

• 额外提示：本地测试的正确姿势
  如果你是直接用浏览器打开本地HTML文件（file://协议），即使改成相对路径，有些浏览器还是会有安全限制。建议用本地服务器来运行你的项目，比如：

  • 用Python的内置服务器：在项目目录下运行python -m http.server（Python3）或python -m SimpleHTTPServer（Python2）
  • 用XAMPP、WAMP这类集成服务器软件，把项目放到服务器的根目录（比如XAMPP的htdocs文件夹）

这样调整后，点击按钮就能正常触发文件下载了。

内容的提问来源于stack exchange，提问作者Chayma Atallah