NodeJS 如何在React前端正确格式化rapidAPI数据

js4nwp54  于 2023-06-05  发布在  Node.js
关注(0)|答案(1)|浏览(275)

我用Node、express和React构建了一个项目,我必须使用RapidAPI的API。目前,它只以JSON格式呈现数据。那么,如何从服务器获取使用node/express编码的数据并将其呈现到HTML前端呢?

这是我的server.js文件

const PORT = 8000

const express = require('express')
const app = express()
const cors = require('cors')
require('dotenv').config()
const axios = require('axios').default
app.use(cors())

app.get('/team', async (req,res) =>{
    const options = {
        method: 'GET',
        url: 'https://api-football-v1.p.rapidapi.com/v3/teams/statistics',
        params: {
          league: '39',
          season: '2020',
          team: '33'
        },
        headers: {
          'X-RapidAPI-Key': process.env.RAPID_API_KEY,
          'X-RapidAPI-Host': 'api-football-v1.p.rapidapi.com'
        }
      };
      
      try {
          const response = await axios.request(options);
          console.log(response.data);
          res.json(response.data)
      } catch (error) {
          console.error(error);
      }
})

app.listen(PORT, () => {
    console.log('Server started on port' + PORT)
})

App.js

import React from 'react'

function App() {
  return (
    <div>
      
    </div>
  )
}

export default App
wmomyfyw

wmomyfyw1#

从react app而不是express server发出fetch请求。如果你不想从前端发出请求,那么就从express服务器发出请求,存储结果并创建一个路由将该响应发送到你的react应用程序。

相关问题