在使用纯Javascript的跨域请求的AJAX请求中包括Cookie [英] Including Cookies on a AJAX Request for Cross Domain Request Using Pure Javascript

问题描述

我正在开发Google Analytics（分析）应用程序，我需要一种方法来唯一地识别每个用户设备。为此，我所遵循的方法是从服务器端创建一个cookie。所有网页点击和跟踪将使用Ajax请求更新到服务器。

I am developing Analytics application and I need a way to identify each user device uniquely. For this, the approach I am following is creating a "cookie" from a server side. All page clicks and tracking will be updated to server using Ajax requests.

我的问题是，我在xyz.com上有我的分析。 Abc.com和123.com是安装我的插件（javascript）代码的应用程序。在第一次访问时，我创建一个cookiesha1来唯一地标识每个用户/设备，在每个连续的请求，我需要检查服务器是否存在cookiesha1，基于应该采取必要的操作。由于我对服务器进行Ajax调用，并且由于它是跨域请求，因此不会向请求中添加任何Cookie。我已经看过各种可用的选项，包括cookie请求像设置withCredentials = true，crossDomain = true，但没有成功。

My problem is, I have my analytics in xyz.com. Abc.com and 123.com are the applications which installs my plugin(javascript) code. On the first visit, I am creating a cookie "sha1" to identify each user/device uniquely, on each consecutive requests, I need to check in server whether cookie "sha1" exists, on based on that should have to take necessary action. Since I am making Ajax calls to the server and since it is a cross domain request, no cookies are added to the request. I have looked at various options available to include cookies to request like setting "withCredentials=true", "crossDomain=true", but with no success.

使用纯JavaScript，真的会感激，如果有人帮助我。

I want the solution using Pure Javascript and would be really grateful if any one help me out. Also I am open to change my approach, if any feasible and easy to implement solution is recommended.

推荐答案

这里有一个XMLHttpRequest（）方法， ）示例，我已经使用cookie的cookie凭证成功在Chrome，FF 3.5+，Safari 4+，IE10 +。如果这不起作用，则可能是服务器配置或浏览器兼容性有问题。

Here is an XMLHttpRequest() example that i have used for CORS with cookie credentials successfully in Chrome, FF 3.5+, Safari 4+, IE10+. If this does not work, it is probably something wrong with server configuration or browser compatibility.

// GET request
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.responseType = 'application/json';
xhr.processData = false;
xhr.contentType = false;
xhr.onload = function() {
    // Successful request
    if (xhr.status == 200) {
        success(xhr.response);
    }
};
xhr.onerror = function() {
    // Crossdomain request denied
    if (xhr.status === 0) {
        corsFailed(xhr.response);
    }
};
xhr.crossDomain = true;
xhr.withCredentials = true;
xhr.send();

我知道safari和IE10 +要求用户在浏览器首选项中允许第三方Cookie。我不认为有没有任何方法，使用自定义标头代替Cookie和设置Access-Control-Allow-Headers在服务器上包括自定义标头。我相信你需要访问控制允许标题：内容类型。

I know that safari and IE10+ require the user to allow third party cookies in their browser preferences. I don't think there is any way around this without using custom headers in place of cookies and setting the Access-Control-Allow-Headers on the server to include the custom headers. Also I believe you need Access-Control-Allow-Headers: "Content-Type".

要回到IE8 / 9，你需要实现回退到XDomainRequest（），但是不支持cookie凭据。

To go back as far as IE8/9, you would need to implement a fallback to XDomainRequest(), but those do not support cookie credentials.

processData和contentType标志可能只对POST请求是必需的。我在执行POST时使用FormData（）对象，而不是JSON。

The processData and contentType flags may only be necessary for POST requests. I use FormData() objects when doing POSTs, not JSON.

这篇关于在使用纯Javascript的跨域请求的AJAX请求中包括Cookie的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！