如何将我的 POST 请求中的数据保存为变量，以在我的 GET 请求中使用？

Question

我正在从我的 POST 请求中接收我的数据。我想将该数据用作 GET 请求中的变量。来自 POST 请求的数据是用户输入的，以便在 3rd 方 API 上进行不同的查询> 如何将我的数据保存为变量来执行此操作？你可以看到我的 request.body 被保存为 const 数据。我需要它在我的获取请求中用作 ${data} 。我对此很陌生，所以任何关于最佳实践的建议都将不胜感激。感谢您的帮助。

Server.js


app.get(`/getmovies`, (req, res) => {

    request(`http://www.omdbapi.com/?t=${data}&apikey=${API_KEY}`,
        function (error, response, body) {
            if (!error && response.statusCode == 200) {
                var parsedBody = JSON.parse(body);
                res.send(parsedBody)

            } else {
                console.log("error in the server")
            }
        }
    )
})


app.post('/postmovie', (request, response) => {
    console.log("I got a request!")
    console.log(request.body);
    const data = request.body;
    response.json({
        status: 'success',
        name: data
    })
})


///Client 

  postMovie = async (e) => {
    e.preventDefault();

    const data = this.state.movie;
    const options = {
      method: 'Post',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(data)
    };

    const response = await fetch('/postmovie', options);
    const json = await response.json();
    console.log(json);


  };



  getMovies = (e) => {
    e.preventDefault();
    const { movie } = this.state;
    axios.get(`/getmovies`)
      .then(response => this.setState({ movies: response.data }))
      // .then(response => this.setState({ movies: response.data }))
      .catch(err => console.error(err))
  }

  render() {
    const { movie } = this.state;
    return (
      <div>
        <section className="form-container">
          <div className="movie-form-div">


            < form>
              <input className="form-input" type="text" name="name"
                value={movie.name}
                onChange={e => this.setState({ movie: { ...movie, name: e.target.value } })} />
              <button onClick={this.getMovies}>Search</button>
              <button onClick={this.postMovie}>Post</button>

            </form >
          </div>
        </section>

Answer 1

正如我在 cmets 中提到的，您的问题的措辞使您听起来像是绝对需要两个请求。

根据 cmets，OP 已澄清他们不一定需要两个请求，因此请注意这里有一些您可以尝试的事情。

1) 设置 application.conf

Configuration files 允许我们参数化和配置应用程序运行所需的变量。您可以在环境（dev/stage/prod 等）和部署之间改变配置文件。

这将假定您的 API_KEY 不经常更改。将其视为对您的 api 密钥进行硬编码，例如

var apiKey = "...."

但这是一种更好、更安全的方法。

在您的情况下，这不起作用，但最好注意这一点。以后可以使用this package

2) 获取请求查询参数。

这是你最好的选择

查询参数，顾名思义，允许我们在 get 请求中传入变量来过滤服务器端的结果。这可以是用户 ID、页码等。

您从客户端获取的 url 看起来像这样

mydomain.com/getmovies?apikey={YourKeyGoesHere}

我确定您在您访问的许多网址中都看到了？。

如果您使用 express，您的终点将如下所示。

app.get(`/getmovies`, (req, res) => {
   var apiKey = req.query.apikey
   request(`http://www.omdbapi.com/?t=${data}&apikey=${apikey}`,
      function (error, response, body) {
        if (!error && response.statusCode == 200) {
            var parsedBody = JSON.parse(body);
            res.send(parsedBody)

        } else {
            console.log("error in the server")
        }
    }
)
})

见How to get GET (query string) variables in Express.js on Node.js?

这将允许您从客户端传递它。

如果您不使用快递，请参阅https://nodejs.org/api/querystring.html

3) 如果你绝对需要两个端点...

使用 cookie。一旦设置了 cookie，它就会随着每个请求来回传输，直到它过期。

看到这个How to set cookie in node js using express framework?或this

一旦您收到发布请求，您将设置一个 cookie

app.post('/postmovie', (request, response) => {
    response.cookie("apikey", data, maxAge: 900000, httpOnly: true });
    response.json({
      status: 'success'
    })
})

一旦这个 cookie 被设置，它将被传输到客户端并与包括 get 在内的所有请求一起返回。

所以在你的获取请求中你可以这样做：

app.get(`/getmovies`, (req, res) => {
   var apikey = req.cookies.apikey;
   request(`http://www.omdbapi.com/?t=${data}&apikey=${apikey}`,
      function (error, response, body) {
        if (!error && response.statusCode == 200) {
            var parsedBody = JSON.parse(body);
            res.send(parsedBody)

        } else {
            console.log("error in the server")
        }
    }
)
})

那么#2和#3有什么区别呢？

url中编码的查询参数是公开的，可以被截取。这对于页码之类的东西很好，但如果 API 密钥是付费的，这不是很安全。此外，一旦您提交查询，它就会消失（除非您将客户端中的 api 密钥保存到内存或本地存储中），因此用户可能不得不重新输入 api 密钥。

另一方面，Cookie 是私有的。我们在代码中设置的 http-only 标志甚至阻止浏览器读取它。只有发布服务器才能看到内容。此外，cookie 会存储在浏览器中，直到过期日期，因此它们可以在多个请求中重复使用。

选择适合您的。

附：我没有测试上面的代码，你可能需要稍微调整一下。答案是让你大致了解这些事情通常是如何处理的