Не удается ПОЛУЧИТЬ /teachers /[object Object]

#reactjs #axios

#reactjs #axios

Вопрос:

axios создает или перенаправляет на этот странный URL. я не понимаю, что происходит. я также проверяю другие доступные здесь решения, но никакой помощи. я также проверил это с общедоступными URL-адресами api, но он перенаправляет на тот же URL.
я делаю запрос из https://d52890213a1f40e2b2XXXXXXX5ab4e.vfs.cloud9.ap-southeast-1.amazonaws.com:8081/teachers

метод axios:

 export function apiCall(method, url, data) {
    console.log(method, url, data)
    debugger
    return axios[method]({
            url,
            params: { origin: "*" },
            data
        })
        .then(res => {
            console.log(res);
            return res.data;
        })
        .catch((err) => {
            if (err.response) {
                // debugger
                return Promise.reject(err.response.data);
            }
            else if (err.request) {
                // debugger
                return Promise.reject(err);
            }
            else {
                // debugger
                return Promise.reject(err);
            }
        });
}
  

вывод на консоль

 get https://d52890213a1f40e2b2XXXXXXX5ab4e.vfs.cloud9.ap-southeast-1.amazonaws.com:8080/api/questionset undefined
  

вызывающая функция

 componentDidMount(){
        apiCall('get', `${process.env.REACT_APP_BASE_URL}/api/questionset`)
        // apiCall('get', `https://randomuser.me/api/`, undefined)
            .then(data =>{
                console.log(data);
                if(!data.success){
                    throw Error(data.message);
                }
                else{
                    this.setState({
                        isLoading: false,
                        questionSets: data.questionSets
                    })
                }    
            })
            .catch(err=>{
                debugger
                console.log(err);
                this.setState({
                    isLoading: false
                })
                return this.props.addError(err.message)

            });
    }
  

ошибки:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Error</title>
</head>
<body>
<pre>Cannot GET /teachers/[object Object]</pre>
</body>
</html>
  

Ответ №1:

Как насчет попытки использовать Promise?

 export function apiCall(method, url, data) {
  return new Promise((resolve, reject) =>
    axios({
      method,
      url,
      params: { origin: "*" },
      data
    })
      .then(res => {
        resolve(res.data)
      })
      .catch((err) => {
        if (err.response) {
          // debugger
          reject(err.response.data);
        }
        else if (err.request) {
          // debugger
         reject(err);
        }
        else {
          // debugger
         reject(err);
        }
      })
  )
}
  

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

1. еще одна ошибка Access to XMLHttpRequest at 'https://d524XXXXXX295b1abe65ab4e.vfs.cloud9.ap-southeast-1.amazonaws.com:8081/api/questionset?origin=*' from origin 'https://d52890213XXXXX295b1abe65ab4e.vfs.cloud9.ap-southeast-1.amazonaws.com:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. я обновил вопрос выше. у меня настроен cors.