开幕雷击:AJAX就不是干这个
ajax只有向服务器发送请求时带上cookie的功能可选。
不存在ajax向服务器get的时候带回来cookie的功能。
解决
把AJAX代码改成原始的js代码来完成需求:
正确的js
document.addEventListener('DOMContentLoaded', function() {
document.querySelector('.form-signin').addEventListener('submit', function(event) {
event.preventDefault(); // 阻止表单默认的提交行为
var form = this;
var url = form.getAttribute('action');
var formData = new FormData(form);
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://localhost:8080/login', true);
xhr.withCredentials = true; // 允许发送跨域Cookie
xhr.onload = function() {
if (xhr.status === 200) {
console.log(xhr.responseText);
console.log(xhr.status);
var setCookieHeader = xhr.getResponseHeader('Set-Cookie');
if (setCookieHeader) {
var cookies = setCookieHeader.split(';');
for (var i = 0; i < cookies.length; i++) {
document.cookie = cookies[i];
}
}
// 跳转到主页
// window.location.href = 'http://localhost:63342/attendance/managView/index.html';
} else {
// 处理请求错误的情况
}
};
xhr.onerror = function() {
// 处理请求错误的情况
};
xhr.send(formData);
});
});
错误存根
为了助于理解这里保留一份错误的ajax代码
悲剧的ajax
$(document).ready(function() {
$('.form-signin').submit(function(event) {
event.preventDefault(); // 阻止表单默认的提交行为
var form = $(this);
var url = form.attr('action');
var formData = form.serialize();
$.ajax({
type: 'POST',
url: 'http://localhost:8080/login',
data: formData,
success: function(response, status, xhr) {
console.log(response)
console.log(status)
console.log(xhr)
var setCookieHeader = xhr.getResponseHeader('Set-Cookie');
if (setCookieHeader) {
var cookies = setCookieHeader.split(';');
for (var i = 0; i < cookies.length; i++) {
document.cookie = cookies[i];
}
}
// 跳转到主页
// $(location).attr('href', 'http://localhost:63342/attendance/managView/index.html');
},
error: function(xhr, status, error) {
// 处理请求错误的情况
}
});
});
});
标签:function,cookies,set,form,xhr,AJAX,cookie,var
From: https://www.cnblogs.com/sugerqube/p/17555760.html