Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/node.js/35.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在下一个js上将数据从express server发送到客户端?_Javascript_Node.js_Reactjs_Express_Next.js - Fatal编程技术网

Javascript 如何在下一个js上将数据从express server发送到客户端?

Javascript 如何在下一个js上将数据从express server发送到客户端?,javascript,node.js,reactjs,express,next.js,Javascript,Node.js,Reactjs,Express,Next.js,我有一个下一个js web应用程序和express。我想将数据发布到这个网页,在我的服务器上获取数据并将其传递到我的下一个js页面。我是下一代js和express的新手。以下是我的server.js代码:- const express = require('express') const next = require('next') const port = parseInt(process.env.PORT, 10) || 3000 const dev = process.env.NODE_

我有一个下一个js web应用程序和express。我想将数据发布到这个网页,在我的服务器上获取数据并将其传递到我的下一个js页面。我是下一代js和express的新手。以下是我的server.js代码:-

const express = require('express')
const next = require('next')

const port = parseInt(process.env.PORT, 10) || 3000
const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare().then(() => {
  const server = express()

  server.use(express.json());

  server.post("/posts", (req, res) => {
    req.body.data
    console.log("Post data : ",req.body.data)
    console.log("JSON Response : ",res.json());
  });

  // server.get('/posts/', (req, res) => {
  //   console.log("Post data again : ",res.body.data)
  //   return app.render(req, res, '/posts', { id: "Pritam" })
  // })

  server.get('*', (req, res) => {
    return handle(req, res)
  })

  server.listen(port, err => {
    if (err) throw err
    console.log(`> Ready on http://localhost:${port}`)
  })
})
当我使用get request时,我可以使用return app.render(req,res,/posts,{name:“Pritam”})将数据从服务器发送到客户端,但当我尝试使用post执行相同操作时,我无法接收客户端上的任何数据。最初,我尝试在查询参数中传递值,效果很好。以下是我的posts.js代码:-

import React, { Component } from 'react'

class Posts extends Component {
  static async getInitialProps ({ query: { id } }) {
    console.log("Response is ")
    return { postId: id }
  }
  render () {
    return (
      <div>
        <p>Post data {this.props.postId}</p>
      </div>
    )
  }
}


export default Posts;
我还为api/agreement.js创建了一个目录,其中包含以下代码:-

export default function handle(req, res) {
  console.log("Request Body",req.body.data) // The request body
  console.log("Request Query :",req.query) // The url querystring
   console.log(req.cookies) // The passed cookies
   res.json({ title: 'Hello World JSON' })
   res.end('Hello World')
}
我可以看到我的服务器响应,但我仍然无法在我的客户机上获取它。我想在邮递员身上测试一下

我想从我的服务器代码创建一个端点,将数据发送到我的客户端,并在getInitialProps中接收该数据,然后在客户端呈现它。 非常感谢您的帮助或建议。谢谢。

下一代TJS 9支持签出

基本上,您需要在
pages
文件夹下创建一个名为
api
的文件夹

示例:文件夹中有一个名为
sample.js
的文件

export default function handle(req, res) {
  console.log(req.body) // The request body
  console.log(req.query) // The url querystring
  console.log(req.cookies) // The passed cookies
  res.end('Hello World')
}

然后,此文件夹中的每个文件都将被称为route,您可以在客户端中将其称为
/api/sample

非常感谢您的及时回复。handle函数是否是sample.js的一部分?我有一个非常简单的要求,我有一个android应用程序,它将数据发布到一个web应用程序,该应用程序将在express服务器上获取数据,并决定渲染哪个路由,并将一些数据传递给路由。API路由在这种情况下会有帮助吗?谢谢。嗨,Jasper我觉得我走的路可能是对的,但我仍然无法在客户端接收任何东西。你在使用nextjs 9吗?
export default function handle(req, res) {
  console.log(req.body) // The request body
  console.log(req.query) // The url querystring
  console.log(req.cookies) // The passed cookies
  res.end('Hello World')
}