Блог

Главная - Вопросы по программированию - сообщение react и axios выдает ошибку типа Uncaught (в обещании) Ошибка типа: проанализированное значение не определено

сообщение react и axios выдает ошибку типа Uncaught (в обещании) Ошибка типа: проанализированное значение не определено

#javascript #reactjs #axios

#javascript #reactjs #axios

Вопрос:

Я озадачен тем, что я делаю неправильно в своем коде. Вызов GET разрешается, но когда я пытаюсь выполнить вызов POST на тот же сервер, я получаю сообщение об ошибке. Моя конечная точка POST отлично работает с Postman.

apiConnection.js

 function get(data){
  return axios.get("http://localhost:8080/api/questions", 
    {
      params:data.payload
    }, {
    headers: {
      'accept': 'application/json',
    }
  })
}

function post(data){
  console.log(data.payload) //my payload is received here
  return axios.post("http://localhost:8080/api/answer", {
      params:data.payload
    }, {
      headers: {
        'accept': 'application/json',
      }
    }
  )
}

export { get, post }

Вот ошибка, которую я получаю в консоли

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

И вот как я делаю вызов в react

index.js

GET (получает ответ нормально)

 import { get, post } from "apiConnection.js"
...
componentDidMount(){
    const data = {
      payload: {
        linkId: getSlug()
      }
    }
    get(data).then((result) => {
      this.setState({reportId: result.data.report.id});
    })
  }

POST (выдает ошибку)

 vote(userVote){
    const data = {
      payload: {
        reportId: this.state.reportId,
      }
    }
    
    post(data).then((result)=>{
      this.state.questions[this.state.currentQuestion].vote = userVote
    });
  }

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

1. axios.post() вам нужно отправить тело / данные вместо параметров, это может быть проблемой

2. К сожалению, это не проблема. Изначально я пытался return axios.post("http://endpoint", data.payload) , и это тоже не сработало.

3. Используете ли вы webpack? Попробуйте установить для devtool значение ‘inline-source-map’, Чтобы получить более точное сообщение об ошибке, с каким файлом произошла ошибка и т. Д., А не только из bundle.js . Вы знаете, где parsed предполагается определить?

4. @Sandsten спасибо за предложение. Я попробовал это, и я получил сообщение об ошибке, isURLSameOrigin.js:57 что привело меня к поиску ответов на этот вопрос. Это ни к чему меня не привело. В любом случае я обнаружил ошибку, о которой я написал в ответе ниже. Спасибо за вашу помощь.

Ответ №1:

Я нашел виновника проблемы, но если кто-то может добавить больше информации об этом, это может быть полезно для других.

В моем вопросе для краткости я изменил URL-адрес запроса с импортированных констант на жестко закодированные ссылки.

В моем коде у меня есть переменная как для GET, так и для POST

 return axios.post(apiEndpoints[data.ep], data.payload)

Я импортирую переменные конечной точки следующим образом

 import * as apiEndpoints from './apiEndpoints';

apiEndpoints.js

 const server = 'http://localhost:8080/'
const api_version = 'api/'
const base_url = server api_version;

export const EP_QUESTIONS = base_url 'questions';
export const EP_ANSWER = base_url 'answer';

По какой-то неизвестной причине EP_ANSWER выдает ошибку, хотя я не делаю опечатку при определении data.ep ( data.ep имеет EP_ANSWER , который
Я проверял миллион раз)

Решение состояло в том, чтобы просто изменить EP_ANSWER EP_ANS , и все работало, как ожидалось.

Понятия не имею, почему это так. Это может быть какая-то глобальная переменная или зарезервированное слово.