Question

我正在使用Fetch API通过Baisc身份验证登录到我的Web应用程序。成功登录后，服务器将令牌作为json对象返回。然后，我使用此令牌向其他API端点发出请求。如果请求包含有效令牌，则这些端点仅显示网页。

一切正常，但是在我成功使用fetch API调用后，浏览器中没有任何显示。

如果我在REST客户端中调用API端点，它将返回html，这似乎很好。问题似乎是浏览器应该调用url而不是仅获取html。

这是我的代码。我收到了“成功”警报-一切似乎都正常。但是我需要浏览器将结果显示为新页面（某种形式的直接调用，在标头中带有令牌的url）。

function login(event) {
  event.preventDefault();
  let username = document.getElementById("username").value;
  let password = document.getElementById("password").value;
  let url = URL + 'login';
  let headers = new Headers();
  headers.append('Authorization', 'Basic ' + btoa(username + ":" + password));
  fetch(url, {method:'GET',
          headers: headers,
         })
  .then(function(response)
  {
    if (response.ok) {
      return response.json();
    } else {
      let error = document.getElementById("login-error");
      error.innerHTML = "Username/Password incorrect.";
    }
  })
  .then(function(json)
  {
    if (typeof(json) !== "undefined") {
      startWebapp(json.token);
    }
  })
  .catch(error => console.error('Error:', error));
}

function startWebapp(token) {
  let url = URL + 'webapp/overview';
  let headers = new Headers();
  headers.append('Authorization', 'Bearer ' + token);
  fetch(url, {method:'GET',
headers: headers,
})
.then(function(response) {
  alert("Success!");
  return response;
});
}

如何获取浏览器实际使用API令牌调用网址并在获取成功后打开网址？

Answer 1

对于任何寻求解决方案的人：使用JavaScript或获取API实际上是不可能的。对我来说，（最简单的）解决方案是将令牌保存在cookie中。然后，服务器在cookie中搜索令牌，并将其用于身份验证/授权。效果很好，我不需要在每次请求时都发送令牌。

希望有帮助。

使用提取API调用带有身份验证令牌的URL

1 个答案: