Question

am在React和Node上有问题，我无法调试。我有一个到节点服务器上的coinmarketcap的API连接，该连接返回硬币和单个硬币的列表。我在邮递员那里获得了所有硬币端点和单个硬币端点返回的正确数据，但我只在响应时获得了所有硬币，而单个硬币返回了404错误。Link to screenshot for API return of single coin on postman

这是我的服务器端代码，用于返回单个硬币：

module.exports = app => {

  app.get("/api/coin/:id", async(req, res) => {
    const symbolID = req.params.id;
    const requestOptions = {
      method: "GET",
      uri: "https://sandbox-api.coinmarketcap.com/v1/cryptocurrency/info",
      qs: {
        symbol: symbolID.toUpperCase()
      },
      headers: {
        "X-CMC_PRO_API_KEY": keys.testCoinAPI
      },
      json: true,
      gzip: true
    };

    try {
      await rp(requestOptions).then(response => {
        res.send(response.data);
      });
    } catch (err) {
      res.send("Sorry the currency you are looking for is not available");
      console.log(err);
    }
  });

};

这是我使用API的React代码

import React, {
  Component
} from "react";
import axios from "axios";

class ViewCoin extends Component {
  componentDidMount() {
    const {
      match: {
        params
      }
    } = this.props;

    axios.get(`/api/coin/${params.symbol}`).then(({
      data: coin
    }) => {
      console.log(coin);
      this.setState({
        coin
      });
    });
  }

  render() {
    return <h1 > This is the view coin component < /h1>;
  }
}

export default ViewCoin;

这是我的renderCoins函数，用于将数据放入表中。带有指向各个链接的链接。

  renderCoins() {
    return this.props.coins.map(coin => {
      return (
        <tr key={coin.id}>
          <td>
            <Link to={`/coin/view/${coin.symbol}`}>{coin.name}</Link>
          </td>
          <td>{coin.symbol}</td>
          <td>${coin.quote.USD.price}</td>
          <td>${coin.quote.USD.market_cap}</td>
          <td>{coin.circulating_supply}</td>
          <td>${coin.quote.USD.volume_24h}</td>
          <td>{coin.quote.USD.percent_change_24h}%</td>
        </tr>
      );
    });
  }

我还使用代理来路由后端和前端端口：

 app.use(proxy("/api/*", { target: "http://localhost:5000" }));

我能够使用浏览器和邮递员毫无问题地访问/ api / coin / btc等端点。但是，在使用React时，出现404错误： GET http://localhost:3000/api/coin/BTC 404（未找到）

我在代理中缺少某些内容还是弄乱了我的路线？感谢您提供任何帮助，不确定是否丢失/看不见。

Answer 1

我能够解决问题。代理存在问题：

我必须包括：app.use（proxy（“ / api / **”，{目标：“ http://localhost:5000”}）））; 在我的代理定义中。

无法通过代理从React和Node访问API

1 个答案: