使用 React 在 Loopback 中设置访问令牌

Question

我是 Loopback 和 Reactjs 的新手。我想构建一个具有用户登录、注销功能的应用程序。但是，我很困惑如何使用反应前端在 Loopback 中设置访问令牌并进一步访问其他方法。我正在使用 Loopback 提供的用户模型。

到目前为止，我已经写了这个小代码，用于访问登录，但我很困惑如何进一步设置访问令牌以进行身份验证。

import React, {Component} from 'react';
import axios from 'axios';

class Login extends Component{

    constructor(props) {
        super(props);
        this.state = {
            "username": ""
            }
        }

    login(newUser) {
        axios.request({
            method:'post',
            url:'http://localhost:3000/api/Users/login',
            data: newUser
          }).then(response => {
            this.props.history.push('/');
          }).catch(err => console.log(err));
    }

    onSubmit(e){
        const newUser = {
            username: this.refs.username.value,
            password: this.refs.password.value
        }
        this.login(newUser);
        e.preventDefault();
    }
}

这个代码片段没有设置访问令牌，所以我想知道我是否需要一些额外的中间件或其他东西来完成它。

Answer 1

试试这个代码。

login(newUser) {
        axios.request({
            method:'post',
            url:'http://localhost:3000/api/Users/login',
            data: newUser
          }).then(response => {
         localStorage.ptspotter_accessToken = response.data.id;
          localStorage.ptspotter_userId = response.data.userId
            auth0.login();
            this.props.history.push('/');
          }).catch(err => console.log(err));
          window.login();
    }

您可以将登录 userId 和令牌存储在 localStorage 中并在任何地方访问。

使用 React 在 Loopback 中设置访问令牌

Set access token in Loopback with React

loopback

node.js

reactjs