Блог

Главная - Вопросы по программированию - Axios получает ответ на запрос с ошибкой 403 запрещено

Axios получает ответ на запрос с ошибкой 403 запрещено

#javascript #reactjs #axios

#javascript #reactjs #axios

Вопрос:

Я новичок в react. Пытаюсь выполнить запрос «get» и получаю ошибку 403 запрещено, «Ответ для предполетного выполнения не имеет статуса HTTP ok».. На вкладке сеть в методе запроса вместо метода «get» отображаются «параметры». В чем может быть проблема? Cors уже открыт, проблема с токеном 

 let token = localStorage.getItem("token")
axios
  .get("http://dev.*****************get-template", {
    headers: {
      Authorization: `Bearer   ${token}`,
    },
  })
  .then(res => {
      console.log("Success")
  })
  .catch(error => {
    console.log(error)
  })

введите описание изображения здесь

введите описание изображения здесь

вот как я сохраняю токен. Может быть, я неправильно сохраняю его в localStorage? Но когда консоль.войдите, он отображается нормально

  event.preventDefault()
    const formdata = new FormData()
    formdata.append("username", this.state.userLogin.email)
    formdata.append("password", this.state.userLogin.password)
    axios
      .post("http://dev.****************/get-token", formdata)
      .then(res => {
        if (res.data) {
          console.log(res.data)

          localStorage.setItem("token", res.data.access_token)
          localStorage.setItem("updToken", res.data.update_token)
          this.props.history.push("/settings")
        }
      })
      .catch(error => {
        console.log(error)
      })

Комментарии:

1. Не могли бы вы поделиться сообщением об ошибке на консоли?

2. используйте ‘str’ var или `str {var}` для объединения строк.

3. Моя ошибка заключалась в том, что запрос Get отличается от запроса Post: в Get нет данных запроса.

Ответ №1:

Я вижу проблему в вашем токене на предъявителя

вы пишете это:

  Authorization: `Bearer   ${token}`

но это должно быть : 

 Authorization: `Bearer ${token}`,

и полный ответ таков : 

 let token = localStorage.getItem("token")

axios
  .get("http://dev.*****************get-template", {
    headers: {
      Authorization: `Bearer ${token}`, //here remove   in template litereal
    },
  })
  .then(res => {
      console.log("Success")
  })
  .catch(error => {
    console.log(error)
  })

Ответ №2:

Сделайте это следующим образом:

 let token = localStorage.getItem("token")
axios.defaults.headers.common['Authorization'] = token

axios
  .get("http://dev.*****************get-template")
  .then(res => {
      console.log("Success")
  })
  .catch(error => {
    console.log(error)
  })

Ответ №3:

Это связано с проблемой CORS.

Чтобы решить эту проблему, вам нужно установить Access-Control-Allow-Origin заголовок на стороне вашего сервера, разрешающий домен, с которого вы отправляете запрос, или вы можете установить его на *