Reactjs React axios在本地存储中存储令牌

我从React Axios post请求返回以下响应

{
    "Id": 1,
    "UserName": "***",
    "Password": null,
    "Email": "***",
    "FirstName": "Steven",
    "Surname": "Collins",
    "CompanyName": "***",
    "OrisecAccountNumber": "***",
    "Token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1bmlxdWVfbmFtZSI6InN0ZXZlLmNvbGxpbnNAb3Jpc2VjLmNvLnVrIiwicm9sZSI6WyJPcmlzZWNBZG1pbiIsIkluc3RhbGxlckFkbWluIl0sIm5iZiI6MTU3MzA2OTg2NiwiZXhwIjoxNTczMDcwNzU2LCJpYXQiOjE1NzMwNjk4NjYsImlzcyI6Ik9yaXNlYyJ9.UgUbLpM0Zs0KYT4XRy20Tkfc9SLgT-8EhhZziahper8",
    "TokenCreatedOnUtc": "0001-01-01T00:00:00",
    "TokenExpiresInMinutes": 15,
    "Roles": [
        "OrisecAdmin",
        "InstallerAdmin"
    ]
}

该职位要求如下

instancePost.post('/identity/account/login', {
    username: '***',
    password: '***'
})
    .then(function (response) {
        localStorage.setToken('access_token', JSON.stringify(response.data));
        localStorage.setToken('refresh_token', JSON.stringify(response.data));
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });

// LocalStorageService.js
const LocalStorageService = (function () {
    var _service;
    function _getService() {
        if (!_service) {
            _service = this;
            return _service
        }
        return _service
    }
    function _setToken(tokenObj) {
        localStorage.setItem('access_token', tokenObj.access_token);
        localStorage.setItem('refresh_token', tokenObj.refresh_token)
    }
    function _getAccessToken() {
        return localStorage.getItem('access_token');
    }
    function _getRefreshToken() {
        return localStorage.getItem('refresh_token');
    }
    function _clearToken() {
        localStorage.removeItem('access_token');
        localStorage.removeItem('refresh_token');
    }
    return {
        getService: _getService,
        setToken: _setToken,
        getAccessToken: _getAccessToken,
        getRefreshToken: _getRefreshToken,
        clearToken: _clearToken
    }
})();
export default LocalStorageService;

}

我的本地存储服务如下

instancePost.post('/identity/account/login', {
    username: '***',
    password: '***'
})
    .then(function (response) {
        localStorage.setToken('access_token', JSON.stringify(response.data));
        localStorage.setToken('refresh_token', JSON.stringify(response.data));
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });

// LocalStorageService.js
const LocalStorageService = (function () {
    var _service;
    function _getService() {
        if (!_service) {
            _service = this;
            return _service
        }
        return _service
    }
    function _setToken(tokenObj) {
        localStorage.setItem('access_token', tokenObj.access_token);
        localStorage.setItem('refresh_token', tokenObj.refresh_token)
    }
    function _getAccessToken() {
        return localStorage.getItem('access_token');
    }
    function _getRefreshToken() {
        return localStorage.getItem('refresh_token');
    }
    function _clearToken() {
        localStorage.removeItem('access_token');
        localStorage.removeItem('refresh_token');
    }
    return {
        getService: _getService,
        setToken: _setToken,
        getAccessToken: _getAccessToken,
        getRefreshToken: _getRefreshToken,
        clearToken: _clearToken
    }
})();
export default LocalStorageService;

我已经在Postman中测试了POST请求，它工作正常。 我的问题是如何在本地存储中存储令牌值。我目前正在这样做，其中存储的名称，但不是实际的令牌

 localStorage.setToken('access_token', JSON.stringify(response.data));
            localStorage.setToken('refresh_token', JSON.stringify(response.data));

---

谢谢。

您的

localstorage

功能似乎是用于

access\u-token

和

refresh\u-token

，但仅提供JWT-token。此外，看起来您正在使用

setToken

而不是所述的

setItem

改变

 localStorage.setToken('access_token', JSON.stringify(response.data));

到

由于令牌是一种字符串类型，您可以这样访问它：

localStorage.getItem('access_token', response.data.Token);