javascript - 为什么我下载这个 Plnkr 后不起作用？

Question

我是 Angular.js 的新手，一直在 Plnkr 上使用它 http://plnkr.co/edit/jR9VfaEhjUfY0vN7mfWd

Plnkr 预览显示选项卡和部分加载正常，但当我下载它时，我的计算机上只有选项卡工作，为什么部分不显示？希望这张截图能解释我的困境:

谢谢

Answer 1

您需要使用网络服务器获取页面，这样就不会出现“Access-Control-Allow-Origin”违规。当来自 example1.com 的脚本尝试向 example2.com 发出 AJAX 请求时，浏览器首先检查 example2.com 是否允许从其他网站访问。这是通过读取 example2.com 的 Access-Control-Allow-Origin header 来完成的。大多数网站通常不允许 AJAX 访问。

在您的情况下，来源是 file:///... ，它不会设置 Access-Control-Allow-Origin header ，并且由于默认是阻止请求，您会收到错误。

要解决这个问题，请执行以下操作(确保您安装了 ruby​​ 或 python)-

1. 打开命令提示符
2. 使用 cd 命令切换到您的项目目录 ( tutorial )

3. 键入任一命令

   python -m SimpleHTTPServer for python
   

   或

   ruby -run -e httpd -- -p 8000 . for ruby.
   

这将在端口 8000 运行基本 HTTP 服务器。HTTP 服务器将允许访问您运行命令的目录中的文件。因此，如果目录中有 index.html ，您可以执行 http://localhost:8000/index.html

<小时/>

看截图，你可以做到这一点 -

1. 打开命令提示符

2. 运行

   cd C:/Users/Jonny/Desktop/plunker
   

3. 启动服务器

   python -m SimpleHTTPServer
   

4. 在浏览器中打开 http://localhost:8000/index.html#/invoices。