Javascript 执行顺序：cookie 是否总是在重定向之前设置？答案

【问题标题】：Javascript execution order: will cookies always be set before redirect?Javascript 执行顺序：cookie 是否总是在重定向之前设置？
【发布时间】：2019-08-28 15:16:37
【问题描述】：

当用户单击按钮时，我会创建 4 个 cookie，然后将他发送到下一页：

$('button').on('click', function() {
    create_cookie('cookie1', 'value1', 30);
    create_cookie('cookie2', 'value2', 30);
    create_cookie('cookie3', 'value3', 30);
    create_cookie('cookie4', 'value4', 30);
    window.location = 'nextpage/';
});

使用 create_cookie：

function create_cookie(name, value, lifetime) {
    var date = new Date();
    date.setTime(date.getTime() + (lifetime * 24 * 60 * 60 * 1000)); 
    var expires = "; expires=" + date.toGMTString();
    document.cookie = name + "=" + value + expires + "; path=/";
}

我的问题：我确定使用这种方法，cookie 是在重定向之前设置的吗？或者在极少数情况下，cookie 没有按时设置，并且重定向已经开始，导致页面加载没有正确的 cookie？当然，鉴于用户的浏览器设置为接受 cookie。

我自己从来没有遇到过任何问题，但是在我的错误日志中，我看到有时（尽管这种情况很少见），某些用户没有在下一页上设置 cookie。这当然可能是因为用户直接访问重定向页面，如果 cookie 设置不正确，我可以重定向它们，但我想确保上述方法是可靠的，以避免用户单击按钮并立即被重定向到错误页面，因为 cookie 设置不正确。

提前非常感谢！

【问题讨论】：

是的，因为 javascript 一次按顺序执行一个语句（我会说单线程，但这在技术上是不正确的）

标签： javascript jquery

【解决方案1】：

但我想确保上述方法是可靠的以避免这种情况用户单击按钮并立即被重定向到错误页面因为 cookie 设置不正确。

如果 cookie 不存在，您可以阻止重定向。创建一个提取 cookie 并检查它们是否存在的函数。

从此answer获取函数：

function get_cookie(cookiename) 
{
  var cookiestring=RegExp(""+cookiename+"[^;]+").exec(document.cookie);
  return decodeURIComponent(!!cookiestring ? cookiestring.toString().replace(/^[^=]+./,"") : "");  
}

然后设置一个if语句

$('button').on('click', function() {
    create_cookie('cookie1', 'value1', 30);
    create_cookie('cookie2', 'value2', 30);
    create_cookie('cookie3', 'value3', 30);
    create_cookie('cookie4', 'value4', 30);

    if(get_cookie('cookie1') && 
       get_cookie('cookie2') && 
       get_cookie('cookie3') && 
       get_cookie('cookie4')
      ) { window.location.href = 'nextpage' }

});

您可以编写一个函数来定期检查cookies，然后如果所有cookies都存在则重定向，但由于@JaromandaX特别提到cookies将在后续行运行之前设置，我认为这没有必要。但是如果您可以复制以下问题，您可以尝试：

我看到有时（尽管很少见），cookie 没有设置在某些用户的下一页。

您可以使用递归超时来执行此操作：

function check_cookies(cookienames, callback){
  setTimeout(function(){
     var ok = cookienames.every(function(c){
       return get_cookie(c);
     });

     if(ok) callback();
     else check_cookies(cookienames, callback);
  }, 1000);
}

$('button').on('click', function() {
    create_cookie('cookie1', 'value1', 30);
    create_cookie('cookie2', 'value2', 30);
    create_cookie('cookie3', 'value3', 30);
    create_cookie('cookie4', 'value4', 30);

    var cookie_arr = ['cookie1', 'cookie2', 'cookie3', 'cookie4'];
    check_cookies(cookie_arr, function(){ window.location.href = 'nextpage' })

});

【讨论】：