使用 JQuery（和 Sinatra）进行 POST 时如何避免跨源请求问题答案

【问题标题】：How do I avoid Cross origin requests issues when doing POST with JQuery (and Sinatra)使用 JQuery（和 Sinatra）进行 POST 时如何避免跨源请求问题
【发布时间】：2013-11-13 07:00:00
【问题描述】：

我在我的机器上的 Apache 下部署了一个 HTML + KnockoutJS + JQuery 站点，可通过http://daily/admin.html（或http://localhost/admin.html）访问。后端在 Sinatra 中构建并在 rackup 下运行，所以我可以通过 http://localhost:9292/api/items 访问它的 API 问题是，如果我执行 AJAX GET 请求，我会得到：

XMLHttpRequest cannot load http://localhost:9292/api/items. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

我的解决方法是在 Sinatra 应用程序中添加以下行：

headers['Access-Control-Allow-Origin'] = 'http://daily'

问题是现在我无法使用 Ajax 进行 POST。我收到以下消息：

Cross origin requests are only supported for HTTP.

JSONP 是一种选择吗？我可以使用 JSONP 进行 POST 吗？

【问题讨论】：

错误信息让我很困惑。你在使用 HTTPS 吗？
不，我猜是同源策略
令我困惑的是“仅用于 HTTP”。因为，好吧，还应该支持什么？当然是 HTTP，因为这就是浏览器在说的... => 奇怪的错误消息。

标签： javascript jquery ajax knockout.js sinatra

【解决方案1】：

您可以在这种情况下使用 JSONP。

使用上面的这段代码，我想你错过了什么

headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept'
headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS'

【讨论】：

嗯，所以 POST 应该与 JSONP 一起使用？我得试试。另一方面，我必须考虑如何部署它，这样我就不会遇到这个问题。不想使用 Sinatra 模板..