Axios GET请求在我的本地版本上运行,但在Heroku上失败-未捕获(承诺)错误:请求失败,状态码为500

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Axios GET请求在我的本地版本上运行,但在Heroku上失败-未捕获(承诺)错误:请求失败,状态码为500相关的知识,希望对你有一定的参考价值。

我正在使用Django / Python后端和React / javascript前端构建应用程序。该应用程序正在使用Axios使用API​​从另一个应用程序导入数据。我已将应用程序部署到Heroku,5个导入中的4个已成功运行,但在Heroku上却有一个失败(但在本地运行)。导入包含合理数量的数据,并使用了5次导入中的最长时间。谁能帮我解决问题?

这是错误:

createError.js:16 Uncaught (in promise) Error: Request failed with status code 500
    at e.exports (createError.js:16)
    at e.exports (settle.js:17)
    at XMLHttpRequest.f.onreadystatechange (xhr.js:59)

这是React组件:

import React, { Component } from 'react'
import axios from 'axios'
import { formatTimeDate } from '../../lib/helpers'

class CrewLoader extends Component {
  constructor() {
    super()

    this.state = {
      loading: false,
      crewDataUpdated: ''
    }

    this.getData = this.getData.bind(this)

  }

  async getData() {
    this.cancelTokenSource = axios.CancelToken.source()
    this.setState({ loading: true })

    try {

      const crews = await axios.get('/api/crew-data-import', {
        cancelToken: this.cancelTokenSource.token
      })
      console.log(crews.data)

      this.setState({ crewDataUpdated: Date.now(), loading: false })

    } catch (err) {
      if (axios.isCancel(err)) {
        // ignore
      } else {
        // propegate
        throw err
      }
    } finally {
      this.cancelTokenSource = null
    }
  }
  componentWillUnmount() {
    this.cancelTokenSource && this.cancelTokenSource.cancel()
  }

  render() {
    const { loading } = this.state

    return (
      <div>
        <button className="button is-primary" onClick={this.getData} disabled={loading}>

          {loading && <span className="spinner"><i
            className="fas fa-spinner fa-spin"
          /> Loading ...</span>}
          {!loading && <span>Get Crew data</span>}

        </button>
        <p><small>{!this.state.crewDataUpdated ? '' : `Updated: ${formatTimeDate(this.state.crewDataUpdated)}`}</small></p>
      </div>
    )
  }
}

export default CrewLoader

这是view.py:

class CrewDataImport(APIView):

    def get(self, _request):
        # Start by deleting all existing crews and times
        Crew.objects.all().delete()
        RaceTime.objects.all().delete()

        Meeting = os.getenv("MEETING2019") # Competition Meeting API from the Information --> API Key menu
        UserAPI = os.getenv("USERAPI") # As supplied in email
        UserAuth = os.getenv("USERAUTH") # As supplied in email

        header = {'Authorization':UserAuth}
        request = {'api_key':UserAPI, 'meetingIdentifier':Meeting}

        url = 'https://webapi.britishrowing.org/api/OE2CrewInformation' # change ENDPOINTNAME for the needed endpoint eg OE2MeetingSetup

        r = requests.post(url, json=request, headers=header)
        if r.status_code == 200:
            # pprint(r.json())

            for crew in r.json()['crews']:

                data = {
                    'name': crew['name'],
                    'id': crew['id'],
                    'composite_code': crew['compositeCode'],
                    'club': crew['clubId'],
                    'rowing_CRI': crew['rowingCRI'],
                    'rowing_CRI_max': crew['rowingCRIMax'],
                    'sculling_CRI': crew['scullingCRI'],
                    'sculling_CRI_max': crew['scullingCRIMax'],
                    'event': crew['eventId'],
                    'status': crew['status'],
                    'bib_number': crew['customCrewNumber'],
                    'band': crew['bandId'],
                }

                serializer = WriteCrewSerializer(data=data)
                serializer.is_valid(raise_exception=True)
                serializer.save()

            crews = Crew.objects.all()
            serializer = WriteCrewSerializer(crews, many=True)
            return Response(serializer.data)

        return Response(status=400)

答案

如果对前端和后端使用不同的URL,则可能会出现CORS问题。您能否提供更多信息,例如前端/后端的URL示例也许您可以在浏览器网络中找到更多附加信息?

以上是关于Axios GET请求在我的本地版本上运行,但在Heroku上失败-未捕获(承诺)错误:请求失败,状态码为500的主要内容,如果未能解决你的问题,请参考以下文章

axios.get() 在向后端发送请求时正在组合 url。

当我使用 React.js 在 Heroku 中使用 Axios 执行 GET 请求时,我应该使用哪个基本 url

如何在我的 axios 发布请求中正确添加标头,发布路由在邮递员中有效,但在使用 axios 时无效

Axios 以某种方式缓存我的获取用户请求本机反应

.env 变量导致我的对象值出现错误,这些值是我从 axios get 请求中获取的反应

MacOs 和 iOs 上 Safari 的 React 和 Axios GET 请求问题