AJAX请求,响应头有set-cookie但浏览器不能写入cookie问题解决!

发布时间 2023-07-15 10:49:31作者: 漆瓷

开幕雷击:AJAX就不是干这个

ajax只有向服务器发送请求时带上cookie的功能可选。
不存在ajax向服务器get的时候带回来cookie的功能。

image

解决

把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) {
                    // 处理请求错误的情况
                }
            });

        });
    });