实现Strapi的JWT认证请求

后端开发Strapi 429

什么是JWT认证?

JWT(JSON Web Token)是一个开放标准(RFC 7519),它定义了一种紧凑且自包含的方式,以JSON对象的形式在各方之间安全地传输信息。 JWT是一个数字签名,生成的信息是可以验证并被信任的。 使用密钥(使用HMAC算法)或使用RSA或ECDSA的公钥/私钥对JWT进行签名。

JWT认证工作流程

Strapi本身实现了严格的权限管理功能,在后台即可多这些权限轻松实现分配管理,但是一些比如PUT,POST,DELETE之类的敏感请求我们一般需要做一些安全验证处理,Strapi的用户模型内置了一个叫jwt的用于认证的token,更多关于用户登录认证的资料请点击这里

创建用户组和权限

我们需要准备两个用户组(Role),然后分别在其下面创建两个用户AuthorReader,顾名思义,前者需要读写权限,而后者只需要可读,操作方法:

  • 点击左侧 Settings 菜单
  • USERS & PERMISSIONS PLUGIN 下选择 Roles
  • 点击 + Add New Role
  • name 中填写 Author
  • 在对应的Content Type权限中选择 Select All
  • 最后 save the new role

完成之后再次重复上面的操作创建 Reader 用户组,需要注意的是该用户组是只读状态,在Content Type的权限中选择 find, findOnecount

创建用户

User 1

  • username: author
  • email: author@strapi.io
  • password: strapi
  • role: Author

User 2

API认证请求的实现

接下来我们使用axios实现strapi的RestAPI认证请求,需要说明的是strapi的认证请求方式为POST,目录为/auth/local

import axios from 'axios';

const { data } = await axios.post('http://localhost:1337/auth/local', {
  identifier: '[email protected]',
  password: 'strapi',
});

console.log(data);

返回的data

{
    "jwt": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiaWF0IjoxNTc2OTM4MTUwLCJleHAiOjE1Nzk1MzAxNTB9.UgsjjXkAZ-anD257BF7y1hbjuY3ogNceKfTAQtzDEsU",
    "user": {
        "id": 1,
        "username": "reader",
        ...
    }
}

其中jwt就是我们需要认证用的token,为了验证其正确性,下面我们先发起一个未经认证GET请求,此处请求地址是以我此前创建好的Article Content Type:

import axios from 'axios';

const { data } = await axios.get('http://localhost:1337/articles');

console.log(data);

请求后我们会看到返回的是 403禁止访问的错误,下面我们使用带有JWT认证的请求

import axios from 'axios';

const { data } = await axios.get('http://localhost:1337/articles', {
  headers: {
    Authorization:
      'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiaWF0IjoxNTc2OTM4MTUwLCJleHAiOjE1Nzk1MzAxNTB9.UgsjjXkAZ-anD257BF7y1hbjuY3ogNceKfTAQtzDEsU',
  },
});

console.log(data);
 

这时候我们看到data的数据可以正常获得,自此一个安全的认证请求已经被我们成功执行。

用POST请求创建数据

我们向articles产生一个post请求来创建一条记录

import axios from 'axios';

const { data } = await axios.post(
      'http://localhost:1337/articles',
      {
        title: 'my article',
        content: 'my super article content',
      },
      {
        headers: {
          Authorization:
            'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiaWF0IjoxNTc2OTM4MTUwLCJleHAiOjE1Nzk1MzAxNTB9.UgsjjXkAZ-anD257BF7y1hbjuY3ogNceKfTAQtzDEsU',
        },
      }
    );

    console.log(data);

这时候我们依旧得到的是403错误,这是因为我们继续沿用了上面的RoleReader的只读用户user2,该用户组并没有POST请求的权限,因此它返回了403的错误,此时我们只需要将用户改为RoleAuthoruser1即可,这里不再重复操作。

参考资料:https://strapi.io/documentation/developer-docs/latest/guides/auth-request.html#login-as-a-reader

Post Comment