验证前端应用程序和后端REST

Question

我已经为REST API开发了一个client-side和应用程序逻辑。现在，应用程序逻辑和REST API都是分开的，而不是紧密耦合的。

我希望实现一个身份验证系统，这样在从client-side登录后，您将在client-side和REST API端自动进行身份验证。

示例：登录到client-side用户后，可自动访问photo/add和api/photo/add。

我想使用cookies，但我不知道它是否可行，我想尝试使用JWT，但到目前为止，我读到的只是针对应用程序逻辑和对数据库的调用都是tightly coupled或REST API本身的client-side或front-end，而不是同时处理两者。

简单地说，：，我是说当时如何对页面和REST这样的视图进行身份验证？

Answer 1

要在客户端和API之间进行通信，可以使用AJAX，为此您可以使用

the fetch API

​

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(response => {  
    if (!response.ok) {
      // error handling
      throw new Error('HTTP error, status = ' + response.status);
    }
    return response.json();
  })
  .then(json => console.log(json))

​

或HMLHttpRequest

​

let xhttp = new XMLHttpRequest()
xhttp.open('GET', 'https://jsonplaceholder.typicode.com/posts/1', false); 
xhttp.onreadystatechange = function(event) {
    // XMLHttpRequest.DONE === 4
    if (this.readyState === XMLHttpRequest.DONE) {
        if (this.status === 200) {
            // worked
            console.log(this.responseText);
        } else {
            // error
            console.log("Status de la réponse: %d (%s)", this.status, this.statusText);
        }
    }
};
xhttp.send(null);

​

保持连接可以使用cookie或会话存储完成。

主要区别在于，cookies作为HTTP报头发送给每个请求，而本地存储只能通过客户机js访问

cookie可以在js中使用document.cookie访问，这会给出一个类似于name=oeschger; favorite_food=tripe; test1=Hello; test2=World的字符串。

localStorage可以使用window.localStorage访问，这是一个Storage对象，提供了5种方法：

• 当向Storage.key()传递数字n时，此方法将返回存储中nth键的名称。
• Storage.getItem()在传递密钥名时，将返回该键的值。
• Storage.setItem()在传递密钥名和值时，将将该键添加到存储中，或者如果该键已经存在，则更新该键的值。
• Storage.removeItem()在传递密钥名时，将从存储中移除该密钥。
• 调用Storage.clear()时，将从存储区中空出所有密钥。

保持某人登录的方式

它们用于自动登录的方式是：

• 您可以查看是否有一个auth令牌(随机唯一字符串)存储
• 如果是，则尝试使用令牌登录。
  • 如果服务器接受一切都很好
  • 如果服务器拒绝您转到其他服务器

​

• 否则
  • 用户通常用它的帐户登录
  • 服务器使用auth令牌回答。
  • 你用你想要的方式储存它

​

auth令牌必须有有限的生命(在欧洲，cookies活一年以上是非法的)

每个帐户最多一个令牌，新令牌使前一个令牌无效。

关于https://security.stackexchange.com/进程的更多信息

Answer 2

我希望实现一个身份验证系统，这样在从客户端登录后，您将在客户端和REST端自动进行身份验证。

您可以使用行业标准RFC 7519方法JWT来实现这一点。

只需将护照和护照-jwt添加到您的包中，编写一个中间件进行检查，如果请求在标头或查询参数中有令牌的话。如果有，检查令牌可用性(过期、角色等)然后，您的中间件将自动为请求的页面提供服务。