从移动的WebView CORS饼干凭据本地加载与文件：// [英] CORS cookie credentials from mobile WebView loaded locally with file://

问题描述

忍耐一下，这个需要一点解释。

Bear with me, this one needs a bit of explanation.

我帮助建立一个混合移动网络应用程序。主要codeBase的是HTML5和JavaScript，将被包裹在一个本地移动Web视图（一拉PhoneGap的）。

I am helping to build a hybrid mobile web app. The main codebase is HTML5 and JavaScript, which will be wrapped in a native mobile Web View (a la Phonegap).

部分功能需要的应用程序来发布信息，由我们的一个客户控制的Web服务。很少有范围改变这个Web服务，因为它是被他人使用。我们发送使用JSON的HTTP POST和接收来自服务器的响应。这种反应一部分是JSESSIONID的cookie它与服务器管理我们的会议。最初的 initSession（）调用之后，我们需要与每一个（AJAX）请求发送JSESSIONID的cookie。

Part of the functionality requires the app to post information to a web service controlled by one of our clients. There is very little scope to change this web service as it is being used by others. We send JSON using an HTTP POST and receive responses from the server. Part of this response is a JSESSIONID cookie which manages our session with the server. After the initial initSession() call, we need to send the JSESSIONID cookie with every (AJAX) request.

当部署在移动设备上，Web应用程序包在本地Web视图，它通过浏览文件启动Web应用程序：///path/to/app/index.html 。

When deployed on a mobile device, the web app is wrapped in the native Web View, which starts the web app by browsing to file:///path/to/app/index.html.

我们尝试的第一件事是问我们的客户设置访问控制 - 允许 - 产地：* 在他们的响应头，让CORS。然后，我们试图发送到服务器：

The first thing we tried was asking our client to set Access-Control-Allow-Origin: * in their response header to allow CORS. We then tried posting to the server:

$.ajax({
  url: 'http://thirdparty.com/ws',
  data: data,
  type: "POST",
  dataType: "JSON",
  success: successCallback,
  error: failedCallback
});

监视的请求，这是明显的是，没有被包括在饼干。在仔细检查有处理用户凭据的，其中包括会话cookie在CORS规范中的一个专门章节。所以我修改了AJAX调用包括这样的：

Monitoring the requests, it was apparent that the cookies were not being included. On closer inspection there is a special section in the CORS spec for dealing with user credentials, which includes session cookies. So I modified the AJAX call to include this:

$.ajax({
  url: 'http://thirdparty.com/ws',
  data: data,
  type: "POST",
  dataType: "JSON",
  success: successCallback,
  error: failedCallback,
  xhrFields { withCredentials: true }
});

另一个错误，这一次从浏览器。更多阅读产生如下：

Another error, this time from the Browser. More reading yielded the following:

如果第三方服务器没有与响应访问控制，允许-凭据：真正的头的响应会被忽略，而不是提供给Web内容。

If the third party server did not respond with an Access-Control-Allow-Credentials: true header the response would be ignored and not made available to web content.

重要提示：当响应资格的请求时，服务器必须指定域名访问控制 - 允许 - 原产地头，并且不能使用野生梳理。

Important note: when responding to a credentialed request, the server must specify a domain in the Access-Control-Allow-Origin header, and cannot use wild carding.

所以，我们需要改变服务器的头文件，包括访问控制 - 允许-凭据：真正的和访问控制 - 允许 - 原产地我们的原点。

So we need to change the server's headers to include Access-Control-Allow-Credentials: true and Access-Control-Allow-Origin to our Origin.

在这里，我们终于来到了我的问题：<一href="http://stackoverflow.com/questions/3595515/xmlhtt$p$pquest-error-origin-null-is-not-allowed-by-access-control-allow-origin">when //协议，从Web查看发送的原产地请求头设置为空。因此，它不能被服务器解析，因此服务器无法将其设置在访问控制 - 允许 - 原产地。但是，如果服务器不能设置访问控制 - 允许 - 原产地来的东西比其他* 我们不能发送凭据，包括饼干。

Here we finally come to my problem: when loading a web page using the file:// protocol, the Origin request header sent from the Web View is set to null. It therefore can't be parsed by the server and so the server can't set it in Access-Control-Allow-Origin. But if the server can't set Access-Control-Allow-Origin to something other than * we can't send credentials, including cookies.

所以，我坚持。该怎么办？ 我看到这里类似的问题贴，但我真的不明白的建议回答。任何帮助将是非常美联社preciated！

So I'm stuck. What to do? I saw a similar question posted here but I don't really understand the proposed answer. Any help would be much appreciated!

推荐答案

我意识到这个问题是旧的，但我想我会扔在它无论如何。在CORS请求的情况下，浏览器preflights它们。这意味着 - 尽管无论 $阿贾克斯（）您使用，一个选项请求发送方法。到服务器。

I realize this question is old, but I figured I'd throw in on it anyhow. In the case of CORS requests, the browser preflights them. What this means is - in spite of whatever $.ajax() method you are using, an OPTIONS request is sent to the server.

这是什么preflighted 选项要求实际上正在做的是说：

What this preflighted OPTIONS request is actually doing is saying:

嘿，国外服务器从-一些，其他的域，我要送你一个不是简单的请求（简单的REQ的不是preflighted）。我不是简单的请求，将有这类标题和内容类型等。你能告诉我这是不是没事吧？

"Hey there, foreign-server-from-some-other-domain, I want to send you a not-simple request (simple req's are not preflighted). My not-simple request going to have these kinds of headers and content type and so on. Can you let me know if this is okay?"

然后，服务器将尽一切它（可能检查一些配置或数据库），并使用允许的原点（s）时，允许报文头（S）反应，和/或允许的方式（S）。

Then the server will do whatever it does (probably check some configuration or database) and respond with the allowable origin(s), the allowable header(s), and/or the allowable method(s).

最后 - 如果preflight 选项请求接收到的响应，使实际 $阿贾克斯（）方法去 - 它会

Finally - if that preflight OPTIONS request has received response that allows the actual $.ajax() method to go - it goes.

CORS是不一样的JSONP

CORS is not the same as JSONP.

所有这一切说 - 尽管 withCredentials preflight成功需要响应携带访问控制 - 允许-证书头（在这个问题说），这是除了访问控制 - 允许 - 起源和访问控制 - 可以让方法值，其中必须包括旨在要求的方面。

All that said - while withCredentials preflight success requires the response to carry a Access-Control-Allow-Credentials header (as stated in the question), that is IN ADDITION to Access-Control-Allow-Origins AND Access-Control-Allow-Methods values, which must include the facets of the intended request.

例如 - 如果你是一个CORS POST 从原产请求 http://foo-domain.com 页眉 someValue中到 http://bar-domain.com ，一个preflight 选项请求将走出去，以实际岗位要求作出 http://bar-domain.com 中， 选项的要求将需要接受与访问控制 - 允许 - 起源价值，包括<$ C $响应C> http://foo-domain.com 。这可能是原产地的名称本身或 * 。该回应还需要有一个访问控制 - 允许 - 方法价值，包括 POST 。这也可能是 * 。最后，如​​果我们希望允许我们的 someValue中头，响应必须包含一个访问控制 - 允许 - 头价值，包括我们的 someValue中头键或 * 。

For example - if you are making a CORS POST request from origin http://foo-domain.com with headers somevalue to http://bar-domain.com, a preflight OPTIONS request would go out and in order for the actual post request to be made to http://bar-domain.com, the OPTIONS request would need to receive a response with an Access-Control-Allow-Origins value that included http://foo-domain.com. This could be the origin name itself or *. The response would also need to have an Access-Control-Allow-Methods value that included POST. This may also be *. And Finally if we want our somevalue header to be allowed, the response must contain a Access-Control-Allow-Headers value that includes our somevalue header key or *.

要绕回来 - 如果你无法控制服务器，或者有没有办法使服务器能够让你的CORS请求，你总是可以使用JSONP或者一些urlEn codeD数据类型和/或不作简单的请求自定义页眉。 GET ， HEAD 和全 POST 请求通常简单请求。

To circle back - if you can't control the server, or have no way to allow the server to allow your CORS requests, you could always use JSONP or some urlEncoded datatype and/or make simple requests without custom headers. GET, HEAD, and full POST requests are usually simple requests.

这篇关于从移动的WebView CORS饼干凭据本地加载与文件：//的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！