gpt4 book ai didi

javascript - 使用 CORS 请求设置 Cookie

转载 作者:IT老高 更新时间:2023-10-28 23:25:24 25 4
gpt4 key购买 nike

我这几天一直在尝试解决这个问题。在 CORS 请求上设置 cookie。我看过相互矛盾的文章和答案,有人说只要 XHR 请求将 withCredentials 设置为 true,并且服务器发送适当的 header ,浏览器就应该尊重 Set-Cookie header 。但是,在我的测试中,情况并非如此。

示例代码:

index.js(Node.js 服务器)

const http = require('http');
const fs = require('fs');

// Pretty colors

const colors = {
purple: '\033[95m',
orange: '\033[93m',
blue: '\033[97m',
underline: '\033[4m',
bold: '\033[1m',
reset: '\033[0m'
}

const server = http.createServer(function (req, res) {

//Console logs to verify what's getting hit.

console.log(colors.purple + colors.underline + 'Hit it!' + colors.reset);
console.log(colors.orange + colors.bold + 'url:' + colors.reset, req.url);

if (/\/cookie/.test(req.url)) {
console.log(colors.blue + 'We need to cook(ie) Jesse\n' + colors.reset);

// Generate a random string in a rather convoluted way.
var randomStr = Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36) +
Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36) +
Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36);
randomStr = new Buffer(randomStr.toString(), 'binary').toString('base64');

// All .dev domains pointed to localhost via dnsmasq, though a hosts file
// Update should also do the trick.
res.writeHead(200, {
'Set-Cookie': 'ajaxTestCookie=cookie' + randomStr + '; Domain=.example.dev; HttpOnly',
'Access-Control-Allow-Origin': 'http://example.dev:3999',
'Access-Control-Allow-Credentials': 'true',
'Access-Control-Allow-Methods': 'GET, POST',
'Access-Control-Allow-Headers': 'Content-Type, Set-Cookie, *'
});
return res.end('OK!');
}

console.log(colors.blue + 'We\'re having fun at the HTML!\n' + colors.reset);

// Send out html file.
fs.readFile('./cookies.html', function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Failure to launch!');
}
res.end(data.toString());
});
});

server.listen(3999);

cookies.html

<html>

<head>
<title>Cookie Test</title>
</head>

<body>
<button class="getCookie">Get Cookies!</button>
<script>
(function() {
document.querySelector(".getCookie").addEventListener("click", function(e) {
console.log("test");
var req = new XMLHttpRequest();
req.open("GET", "http://localhost:3999/cookie", true);
req.onload = function() {
console.log(req.responseText);
};
req.withCredentials = true;
req.send();
});
}());
</script>
</body>

</html>

我已尝试在 Firefox 开发者版和 Chrome 上对此进行测试,除非直接访问该页面,否则不会设置 cookie。

为了让 cookie 处理 CORS 请求,我有什么遗漏吗?

最佳答案

不是很明显的是服务器设置的 cookie,至少在 CORS 请求中,并且可能(可能)在所有请求中都被限制在与服务器相同的域中。

index.js(Node.js 服务器)

const http = require('http');
const fs = require('fs');

// Pretty colors

const colors = {
purple: '\033[95m',
orange: '\033[93m',
blue: '\033[97m',
underline: '\033[4m',
bold: '\033[1m',
reset: '\033[0m'
}

const server = http.createServer(function (req, res) {

//Console logs to verify what's getting hit.

console.log(colors.purple + colors.underline + 'Hit it!' + colors.reset);
console.log(colors.orange + colors.bold + 'url:' + colors.reset, req.url);

if (/\/cookie/.test(req.url)) {
console.log(colors.blue + 'We need to cook(ie) Jesse\n' + colors.reset);
// Generate a random string in a rather convoluted way.
var randomStr = Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36) +
Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36) +
Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(36);
randomStr = new Buffer(randomStr.toString(), 'binary').toString('base64');
// All .dev domains pointed to localhost via dnsmasq, though a hosts file
// Update should also do the trick.
res.writeHead(200, {
'Set-Cookie': 'ajaxTestCookie=cookie' + randomStr + '; domain=.example.dev; HttpOnly',
'Access-Control-Allow-Origin': 'http://example.dev:3999',
'Access-Control-Allow-Credentials': 'true',
'Access-Control-Allow-Methods': 'GET, POST',
'Access-Control-Allow-Headers': 'Content-Type, Set-Cookie, *'
});
return res.end('OK!');
}
console.log(colors.blue + 'We\'re having fun at the HTML!\n' + colors.reset);
// Send out html file.
fs.readFile('./cookies.html', function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Failure to launch!');
}
res.end(data.toString());
});
});

server.listen(3999); // api.example.dev:3999, for example

cookies.html

<html>

<head>
<title>Cookie Test</title>
</head>

<body>
<button class="getCookie">Get Cookies!</button>
<script>
(function() {
document.querySelector(".getCookie").addEventListener("click", function(e) {
console.log("test");
var req = new XMLHttpRequest();
// Request succeeds, but cookie will not be set!
// req.open("GET", "http://localhost:3999/cookie", true);
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
// This line, however, will work, assuming this page is on
// the same domain, or a subdomain of the same domain.
// (For example test.example.dev and api.example.dev)
// As long as the Access-Control-Allow-Origin Header is
// properly set to allow the domain.
req.open("GET", "http://api.example.dev:3999/cookie", true);
req.onload = function() {
console.log(req.responseText);
};
req.withCredentials = true;
req.send();
});
}());
</script>
</body>

关于javascript - 使用 CORS 请求设置 Cookie,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36365409/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com