Вызовите данные из Nodej.s в реакцию

Question

Я пытаюсь вызвать API (который разрешает только вызовы на стороне сервера) в nodejs.Мне удается вернуть информацию на мою консоль, и теперь я пытаюсь передать эти данные в файл app.js моего приложения реагирования.

В настоящее время я работаю с приложением реагирования на серверную часть node.js и выражаю связь между ними.

У меня есть две папки backend и client

Это backend/server.js:

const express = require('express')

const bodyParser = require('body-parser');
// Set up the express app
const app = express();
const API_PORT = 3001;
// Parse incoming requests data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));


app.use(function(req, res, next) {
   res.header("Access-Control-Allow-Origin", "*");
   res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
   next();
  });

app.get("/bitmex", () => !async function(){
      const api = new BitmexAPI({
       "apiKeyID": "-",
       "apiKeySecret": ""
 });
   const chatMessage = await atMessage.json({ success: true, chatMessage})
}())

 app.listen(API_PORT, () => console.log(`LISTENING ON PORT ${API_PORT}`));

Это Client / Appjs

    // /client/App.js
    import React, { Component } from "react";


    class App extends Component {
      // initialize our state 
      state = {
        data: [],
        id: 0,
        message: null,
        intervalIsSet: false,
        idToDelete: null,
        idToUpdate: null,
        objectToUpdate: null
      };



      // when component mounts, first thing it does is fetch all existing data in our db
      // then we incorporate a polling logic so that we can easily see if our db has 
      // changed and implement those changes into our UI
      componentDidMount() {
        console.log("yes")
        console.log(this.getDataFromDb());
      }


      getDataFromDb = () => {
        fetch("http://localhost:3001/bitmex")
          .then(data => data.json())
          .then(res => this.setState({ data: res.data }));
      };




      // here is our UI
      // it is easy to understand their functions when you 
      // see them render into our screen
      render() {
        const { data } = this.state;
        return (
          <div>
            <ul>{Object.keys(this.state.data[0]).map((key) => { return <li>{key}</li> })}</ul>
          </div>
        );
      }
    }

    export default App;

Ответ от API выглядит следующим образом:

[
   {
    "account": 0,
    "symbol": "string",
    "currency": "string",
    "underlying": "string",
    "quoteCurrency": "string",
    "commission": 0,
    "initMarginReq": 0,
    "maintMarginReq": 0,
    "riskLimit": 0,
    "leverage": 0,
    "crossMargin": true,
    "deleveragePercentile": 0,
    "rebalancedPnl": 0,
    "prevRealisedPnl": 0,
    "prevUnrealisedPnl": 0,
    "prevClosePrice": 0,
    "openingTimestamp": "2019-02-13T18:37:44.780Z",
    "openingQty": 0,
    "openingCost": 0,
    "openingComm": 0,
    "openOrderBuyQty": 0,
    "openOrderBuyCost": 0,
    "openOrderBuyPremium": 0,
    "openOrderSellQty": 0,
    "openOrderSellCost": 0,
    "openOrderSellPremium": 0,
    "execBuyQty": 0,
    "execBuyCost": 0,
    "execSellQty": 0,
    "execSellCost": 0,
    "execQty": 0,
    "execCost": 0,
    "execComm": 0,
    "currentTimestamp": "2019-02-13T18:37:44.780Z",
    "currentQty": 0,
    "currentCost": 0,
    "currentComm": 0,
    "realisedCost": 0,
    "unrealisedCost": 0,
    "grossOpenCost": 0,
    "grossOpenPremium": 0,
    "grossExecCost": 0,
    "isOpen": true,
    "markPrice": 0,
    "markValue": 0,
    "riskValue": 0,
    "homeNotional": 0,
    "foreignNotional": 0,
    "posState": "string",
    "posCost": 0,
    "posCost2": 0,
    "posCross": 0,
    "posInit": 0,
    "posComm": 0,
    "posLoss": 0,
    "posMargin": 0,
    "posMaint": 0,
    "posAllowance": 0,
    "taxableMargin": 0,
    "initMargin": 0,
    "maintMargin": 0,
    "sessionMargin": 0,
    "targetExcessMargin": 0,
    "varMargin": 0,
    "realisedGrossPnl": 0,
    "realisedTax": 0,
    "realisedPnl": 0,
    "unrealisedGrossPnl": 0,
    "longBankrupt": 0,
    "shortBankrupt": 0,
    "taxBase": 0,
    "indicativeTaxRate": 0,
    "indicativeTax": 0,
    "unrealisedTax": 0,
    "unrealisedPnl": 0,
    "unrealisedPnlPcnt": 0,
    "unrealisedRoePcnt": 0,
    "simpleQty": 0,
    "simpleCost": 0,
    "simpleValue": 0,
    "simplePnl": 0,
    "simplePnlPcnt": 0,
    "avgCostPrice": 0,
    "avgEntryPrice": 0,
    "breakEvenPrice": 0,
    "marginCallPrice": 0,
    "liquidationPrice": 0,
    "bankruptPrice": 0,
    "timestamp": "2019-02-13T18:37:44.781Z",
    "lastPrice": 0,
    "lastValue": 0
  }
]

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

Answer 1

app.get("/bitmex", () => !async function(){
  const api = new BitmexAPI({
    "apiKeyID": "-",
    "apiKeySecret": ""
  });
  const chatMessage = await atMessage.json({ success: true, chatMessage})
}())

Вероятно, это должно быть:

app.get("/bitmex", async (req, res) => {
  const api = new BitmexAPI({
    "apiKeyID": "-",
    "apiKeySecret": ""
  });
  const chatMessage = await atMessage.json({ success: true, chatMessage})

  res.setHeader('Content-Type', 'application/json')
  res.end(chatMessage)
})

Я не уверен, решит ли это вашу проблему.Но 404 из вашего клиентского приложения означает, что ваша конечная точка API, вероятно, не существует.