带有 Rest API 的 Backbone.js

Posted 2023-03-03

【中文标题】带有 Rest API 的 Backbone.js

【英文标题】：Backbone.js With RestAPI

【发布时间】：2013-01-14 01:29:08

【问题描述】：

我是 javascript 的菜鸟，特别是 Backbone.js 我正在关注tutorial 并将模型和 URL 调整到我自己的 Rest Services（JaxRS）。但是，在浏览器 (Chrome) 中运行应用程序时出现以下错误XMLHttpRequest cannot load http://localhost:1232/abc. Origin null is not allowed by Access-Control-Allow-Origin

在寻找一些解决这个错误的方法时，

我阅读了关于 SO 的帖子以使用参数 --allow-file-access-from-files – 启动 chrome 但是，我不确定这种方法。由于某些原因，我也无法尝试。 我还读到，在纯 javascript 中，此类问题通常使用xmlDomainObject 处理。但这不是骨干的情况。

所以我正在寻找的是一些可以通过骨干本身解决问题的方法。我也不明白，为什么在任何关于将主干与 RestApi 结合使用的教程中都没有解决这类问题

【问题讨论】：

如果你的机器上安装了 python，你可以通过 cding 进入你的目录然后输入“python -m SimpleHTTPServer”来创建一个小的 Web 服务器，因此你应该在 localhost:8080 下有该目录可用并充分利用http协议。

【参考方案1】：

这与 Backbone 无关。您正在使用 file:/// URL 加载页面，问题是 AJAX 跨域请求。

有一些方法可以解决它 - 您可以通过运行 REST 服务的服务器加载您的网页。或者，您可以允许跨源请求。我会让你搜索如何做到这一点。

编辑 如果您正在开发 PhoneGap 应用程序，那么一旦您实际运行该应用程序，您就不会遇到问题，因为它不会抱怨跨源请求。那时它是一个本地应用程序，因此请求不是跨域的。 在开发时解决这个问题的方法是 --allow-file-access 标志，您说您无法开始工作。您需要确保关闭所有其他打开的 Chrome 窗口，然后使用该标志启动一个新实例。

【讨论】：

我怀疑骨干的原因是因为在我提到的所有教程中，我找不到任何 ajax 调用。所以我假设，主干正在处理跨源请求。我找到了解决办法，我不得不重写 collections.fetch 并使用数据类型为 jsonp 的 ajax 调用。

Backbone 不负责任何跨域请求。您应该查看文档或主干源代码。

您实际上不需要重写任何方法或使用 jsonp。如果您不想运行 Web 服务器来服务页面，您仍然可以在 REST API 上允许跨源请求，正如我在回答中提到的那样。如果您也不想这样做，那么您可以使用 jsonp。

我选择 jsonp 而不是在服务器上修改代码的原因是因为我希望客户端处理这个问题。让我澄清一下我想在这里建立什么。这是一个 phonegap 应用程序，带有用于 MVC 的主干和用于 UI 的 JQM。服务器实现 JaxRS。而且我对所有技术都是新手，因为我最近从 android 转移。如果您有任何其他建议，我很乐意欢迎他们。我涵盖的方面越多，我就能更好地调整这些组件。

答案已更新 - 您无需重写 PhoneGap 应用程序的方法

【参考方案2】：

您可以在允许跨源请求的 ajax 调用中使用 JSONP

在here 和here 了解更多信息

编辑：

使用 jsonp 需要返回一个 json 对象，它不适用于 xml。因此，您可能需要在从服务器发送之前将您的 XML 包装成 json，或者将您的 xml 解析为 json。

this、this 和 this 可能会有所帮助:)

【讨论】：

使用jsonp解决的问题。虽然 jsonp 尝试返回 xml，但导致 Resource 被解释为 Script 但以 MIME 类型 application/xml 传输。错误。任何指针？我检查了服务器响应，那边没有问题。