javascript - 在 Chrome 中使用 JavaScript POST 将自定义 cookie 发送到另一个域

Question

我想在 POST 请求中将自定义 cookie 从本地主机发送到另一个域(我的域)

我通过 document.cookie="test=test"设置cookie；我可以通过 console.log(document.cookie) 正确地看到它的设置，现在当我使用下面的代码时，cookie 不会被发送。

  $.ajax({
        url: 'https://secure.domain.com',
        type: 'POST',
        data: "hi",
        cache: false,
        contentType: false,
        processData: false,
        xhrFields: {
            withCredentials: true
        },
        crossDomain: true
    });

我什至通过运行以下命令禁用了 chrome 安全

 -args --disable-web-security --user-data-dir 

仅发送以下 header

Accept: */*
Content-Type: text/plain;charset=UTF-8
Origin: http://localhost:8888
Referer: http://localhost:8888
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.30 Safari/537.36

注意:这仅供我个人使用，因此我可以禁用 chrome 安全性或修改任何内容以供我使用。

Answer 1

修改 chromium 源代码是个坏主意，对于这个任务你可以只创建扩展来修改请求头，不需要参数 -disable-web-security

创建名称类似于 headers_ext 的文件夹并添加以下文件

list .json

{
  "manifest_version": 2,
  "name": "Modify Request Headers",
  "version": "1.0",
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "<all_urls>",
    "tabs",
    "webNavigation"
  ],
  "background": {
    "scripts": ["background.js"]
  }
}

backround.js

function modifyRequestHeaders(request) {
  for (var headers = request.requestHeaders, i = 0; i < headers.length; ++i) {
    if (headers[i].name.toLowerCase() == 'accept') {
      // set Cookie from 'Accept' header value
      headers.push({"name" : "Cookie", "value" : headers[i].value});
      // normalize 'Accept' header value
      headers[i].value = '*/*';
    }
  }
  return {requestHeaders: headers};
}

function modifyResponseHeaders(response) {
  for (var headers = response.responseHeaders, i = 0; i < headers.length; ++i) {
    if (headers[i].name.toLowerCase() == 'access-control-allow-origin') {
      headers.splice(i, 1);
      break;
    }
  }

  // Allow cross domain
  headers.push({"name": "Access-Control-Allow-Origin", "value": "*"});
  return {responseHeaders: headers};
}

var webRequestOptions = {urls: ["<all_urls>"], types: ["xmlhttprequest"]};

chrome.webRequest.onBeforeSendHeaders.addListener(modifyRequestHeaders,
  webRequestOptions, ["blocking", "requestHeaders", 'extraHeaders']);
chrome.webRequest.onHeadersReceived.addListener(modifyResponseHeaders,
  webRequestOptions, ["blocking", "responseHeaders"]);

现在，在 Chrome 扩展程序页面中单击 Load unpacked extension 并找到目录。

上面的扩展只会修改xmlhttprequest请求头和使用Accept header value 作为Cookie值，它也修改响应头以允许交叉通过添加 header Access-Control-Allow-Origin: * 来请求域。

对于 Chrome 而言，DPR、Downlink、Save-Data、Viewport-Width、Width header 似乎尚未列入安全列表，因此我使用 Accept header 来代替避免使用 OPTIONS 或 Preflight请求，因为很多网站不支持这个。 extraHeaders 是允许修改或创建 Cookie 的过滤器。

有关 CORS 的更多信息，请阅读 here

确保您使用的是最新的 Chrome 并像这样创建请求

$.ajax({
  url: 'https://example.com',
  type: 'POST', // or GET or HEAD
  headers: {
    // it will used for 'Cookie' value by extension
    'Accept': "cookieName=cookieValue" 
  }
});