Вылетает ошибка: InvalidTokenError: Invalid token specified: Cannot read property 'replace' of undefined

Question

В моём приложении после регистрации пользователя, при входе на страницу пользователя вылетает ошибка:

InvalidTokenError: Invalid token specified: Cannot read property 'replace' of undefined

В частности из-за jwt-decode:

import React, { Component } from 'react'
import jwt_decode from 'jwt-decode'
class Profile extends Component {
constructor(props) {
  super(props)
  this.state = {
    name: '',
    email: '',
    errors: {},
  }
}

componentDidMount() {
  const token = localStorage.usertoken
  const decoded = jwt_decode(token)
  this.setState({
    name: decoded.name,
    email: decoded.email
  })
}

Answer 1

Я бы дал небольшую рекомендацию по поводу хранилища. Если в метод getItem() интерфейса Storage передать ключ в качестве параметра, то метод вернет значение, лежащее в хранилище по указанному ключу. Возвращаемым значением является строка DOMString, содержащая значение для соответствующего ключа. Если ключ не существует, то будет возвращено значение null.

// Ваш способ получения значения из хранилища
const oldTokenGetter = localStorage.usertoken;
// Рекомендуемый способ получения значения из хранилища
const newTokenGetter = localStorage.getItem('usertoken');

Конечно, это не ошибка, ведь в Storage значения помещенных ключей хранятся как проперти объекта и Вы получите свое значение по имени.

Советы и рекомендации оставим и перейдем к полученной ошибке:

InvalidTokenError: Invalid token specified: Cannot read property 'replace' of undefined

Кроется в пакете jwt-decode. Можно найти в гите следующее ишшуе: JWT InvalidTokenError: Invalid token specified Там в комментариях имеется подсказка, как избежать такой ошибки. В вашем случае нужно поступить так (добавить проверку, что значение имеется):

componentDidMount() {
  const token = localStorage.getItem('usertoken');

  if (token) {
    const decoded = jwt_decode(token);
    this.setState({
      name: decoded.name,
      email: decoded.email,
    });
  }
}

Увы, но судя по исходникам такая проблема имеется и кроется в следующем модуле либы: base64_url_decode.js, который вызывается из основного модуля (index.js)

БЛОГ НА HUSL

Вылетает ошибка: InvalidTokenError: Invalid token specified: Cannot read property 'replace' of undefined

Ответы (1 шт):