javascript - 如何从 html 页面中的静态 url 获取 JSON

Question

我正在用 html 和 node.js 编写一个简单的应用程序这是我的第一个 node.js、javascript 和 html 应用

我想通过 Node 发送一个 json，当调用一个 url 时(在我的本地机器上，下面的 ip 被称为:127.0.0.1/local)

当我调用该地址时，预期的信息正确地返回给了浏览器。此外，我在我的 html 页面中添加了一个按钮，需要调用上面的地址，以获取 JSON 数据。

我已经在 here 尝试过接受答案的解决方案

但是我得到了这个错误:

XMLHttpRequest cannot load http://127.0.0.1/local Origin server is not allowed by Access-Control-Allow-Origin node.js

有什么问题？我认为提供的信息已完成，但如果未完成，请告诉我以共享我的代码。

• 更新

好的，我知道我需要解释我的确切目标并提供我的代码；

我正在用 Node.js 开发一个程序我有一个 mysql 数据库，我想从数据库中获取一些信息并显示在 html 页面上。我在我的数据库 js 文件上使用了 bookshelf、express、lodash、router，所以我通过调用

从 db 获取数据

127.0.0.1:3002/local

我的 html 页面上有一个按钮；并且需要在用户触摸时获取信息。我的 html 页面运行在

127.0.0.1:8080

所以我觉得没必要提供Access，db和html都跑在一台服务器上。

也许我通过 XMLHttpRequest 调用数据库数据的解决方案不是正确的解决方案。我想问的是这是否是调用数据的唯一方法？

Answer 1

您的页面和 Json 资源位于 2 个不同的端口(3002 和 8080)上。这就是导致 Access-Control-Allow-Origin 错误的原因。它作为浏览器针对跨脚本的安全性。

在ajax中，一般情况下，页面和资源应该同源，同源策略依赖于主机名和端口。

您的解决方案是在同一端口上访问您的主页和 JSON 资源。

• 127.0.0.1:8080/index.html -> 获取您的主页。
• 127.0.0.1:8080/local -> 获取您的 JSON

通过 XMLHttpRequest 访问它没有问题，这是正确的做法，并且被许多框架使用，例如 angular。