欢迎页面未使用 JWT 加载答案

【问题标题】：Welcome page not loading with JWT欢迎页面未使用 JWT 加载
【发布时间】：2020-11-13 06:49:13
【问题描述】：

我正在使用带有 ExtJS 的 Spring Boot 和 /login 页面，该页面是带有一些 JQuery javascript 的纯 JSP。我正在尝试集成 JWT 以保护我的数据 api。使用我能找到的实现 JWT 的方法，我实现了 JWTRequestFilter 并从 Spring Security 中删除了内置登录流程。

我的登录表单现在向 /authenticate 方法发出 $ajax POST 请求，该方法在响应中返回一个令牌。当我在 Postman 中手动设置 Authentication 标头并触发 /welcome 页面的 GET 请求时，我得到一个有效的响应...

以下代码是我尝试使用令牌更新标头并获取 /welcome 页面的方式。我收到 401 错误，因为当我尝试使用此代码访问页面时缺少 Authentication 标头...

$form.on('submit', function(e) {
    e.preventDefault(); 
    $.ajax({  
      url: $form.attr('action'), 
      type: 'POST', 
      dataType: 'json', 
      contentType: 'application/json',
      data: JSON.stringify(dat), 
      success: function(result) {
  
        var d = new Date();
        d.setTime(d.getTime() + (3*24*60*60*1000));
        var expires = "expires="+ d.toUTCString();
        
    //  $('head').append('<meta name="Authorization" content="Bearer ' + result.token + '"');
        window.localStorage.setItem("Authorization", "Bearer " + result.token);
    //    document.cookie = "Authorization=Bearer "+result.token + ";" + expires + ";path=/;httpOnly"; 
        window.location="/welcome";
}  error: funciton() {}
);

我尝试将令牌放入 cookie 中（Tomcat9 由于格式而忽略了该令牌）。我目前正在单独研究这个问题。

我还尝试为欢迎页面创建一个 XMLHttpRequest()，它让我返回原始 HTML，但我不确定是否需要使用此响应以某种方式重新加载 DOM...

在响应中获取授权令牌并将其放在 /welcome 页面的后续 /GET 标头中的最佳方法是什么？

【问题讨论】：

标签： javascript jquery spring-boot extjs jwt

【解决方案1】：

您没有以正确的方式添加标题。添加标题需要使用beforeSend():

beforeSend: function (xhr) {
  xhr.setRequestHeader ("Authorization", "Bearer " + JWT);
},

这个选项需要发送。此外，JWT 在这里表示 JWT、令牌，xhr 是 XMLHttpRequest 原始对象。这个选项应该发送到$.ajax()的参数。

【讨论】：

这是否适用于所有请求 ajax 或其他？如果我配置 XMLHttpRequest 对象，当它尝试调用 window.location 时，是否仍然应用标头？ ?
@ItGrunt 这只会影响参数传递到的特定 AJAX 调用函数。对于所有请求，您也可以使用.ajaxStart() 方法。我的回答只影响我们正在谈论的特定请求。不是其他一切。如果你使用window.location，那不是AJAX调用，是没有任何头的普通GET请求，所以不是。
感谢您的回复...那么是否可以使用 xhr 对象重新加载整个页面、脚本、css 和所有内容？我以前只见过它用于将数据从微服务加载到 DOM 中
@ItGrunt 但是在 GET 请求中，通常绝对不可能发送身份验证标头。但是对于 JavaScript，是的，对于微服务，它们使用一种特殊的加载方法，我不确定名称，我也看到过这种方式。但这在普通的 GET 请求中是不可能的，而且绝对不能使用window.location。