【问题标题】:NodeJS server side api callNodeJS 服务器端 api 调用
【发布时间】:2021-05-23 08:35:09
【问题描述】:

我很难理解 NodeJS 的工作原理。
这是我第一次使用 NodeJS。
下面的 sn-p 正在从浏览器而不是从服务器调用 localhost
有人可以指导我如何将这个 sn-p 转换为从服务器而不是客户端的浏览器进行调用吗?

import logo from './logo.svg';
import './App.css';
import React, { Component } from 'react';

class App extends Component {
  constructor(props) {
    super();
    this.state = {
      cpu: 0,
      ram: 0
    }
    this.loadData = this.loadData.bind(this)
  }

componentDidMount() {
    this.loadData()
    setInterval(this.loadData, 300);
 }

async loadData() {
    try {
      const res = await fetch('http://localhost:5000/stats');
      const blocks = await res.json();
      const ram = blocks.ram;
      const cpu = blocks.cpu;
      console.log(ram);
      this.setState({
        cpu, ram
      })
    } catch (e) {
      console.log(e);
   }
}


render() {
    return (
      <div className="App" >
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <div>
            <h3>CPU : {this.state.cpu}</h3>
            <h3>RAM : {this.state.ram}</h3>
          </div>
        </header>
      </div>
    );
  }
}
export default App;

如果问题没有意义,道歉!

【问题讨论】:

  • 让我试一试。仅供参考,后端 api 在 python 中,用 gunicorn 暴露
  • 我不确定我是否正确,但 React 是在浏览器上工作的前端库,而 Node.js 是在服务器上或浏览器之外的某个地方运行 JS 的平台(后端)。重点是从您的前端(浏览器、您的 React 应用程序)连接到您的后端(Node.js)以从中获取数据,而您正在这里进行操作。这是 2 个独立的进程,它们必须通过某种协议进行通信(此处为 HTTP,但现在无关紧要)。但是如果我弄错了,那么看看 node-fetch 库,这样你就可以将你的方法复制粘贴到 Node.js 应用程序中,它会起作用

标签: node.js


【解决方案1】:

将代码插入index.js 或您用于nodeJS 的任何起始文件,然后将其从客户端JS 中删除。然后,您可能希望使用另一种模式发送数据。您可以使用 EJS(或任何其他)模板引擎在发送之前在服务器上创建 HTML。

我明白了,你已经使用了 React。在这种情况下,您可能希望使用 URL 参数将数据发送到客户端,客户端可以使用 React 访问这些参数,或者您的客户端本身可以从您的服务器请求。

参考:SO post

【讨论】:

  • 我有正确的方法来使用 nodeJS 来完成这项任务吗?基本上我有 2 个容器。一个公开了一个具有 CPU 和 MEM 使用率的 http api。第二个容器是从 API(本地托管)读取的 NodeJS 前端。我得到了这段代码,但不知道 NodeJS 是如何工作的。顺便说一句,所以只需将类中的整个代码粘贴到 index.js 中?
  • 是的。我认为@Andrea 已将适当的帖子与您的问题相关联。如果我没记错的话,您希望您的服务器从另一台服务器获取数据并将其发送到您的客户端。
猜你喜欢
  • 1970-01-01
  • 2018-05-10
  • 1970-01-01
  • 2017-08-17
  • 2021-05-09
  • 2012-03-07
  • 1970-01-01
  • 2019-05-22
  • 2020-03-08
相关资源
最近更新 更多