为处理 CORS 问题而构建的代理问题

Question

在http://localhost:3002（源）和http://localhost:8080/configurator（服务器）之间进行本地测试时遇到CORS问题

所以我决定在它们之间建立一个代理，它将 access-control-allow origins 标头附加到服务器的任何响应中。我似乎得到了一个好的回应，但并没有给我身体本身。忽略客户端代码，我只是想用邮递员（客户端软件）-> 代理（节点快递）和终端服务器（球衣）进行测试

我在邮递员中的请求发送到http://localhost:3001/file/（代理）并发送一个 JSON 字符串内容类型标头设置为 application/json 代理代码如下

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
const request = require('request');
var logger = require('morgan');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  next();
});

app.post('/file', (req, res) => {
  request.post(
    { url: 'http://localhost:8080/configurator' },
    (error, response, body) => {
      if (error || response.statusCode !== 200) {
        return res.status(500).json({ type: 'error', message: err.message });
      }

      //console.log("body is"+body)
      //return res.json(body)//res.send(body)
       return res.send(body)
      //return res.send(JSON.parse(body));
      //return res.json(JSON.parse(body));
    }
  )
});

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  next(createError(404));
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

const PORT = 3001;
app.listen(PORT, () => console.log(`listening on ${PORT}`));

module.exports = app;

代理将请求转发到我的后端并将 CORS 标头附加到响应中。

下一个我添加的后端端点是 POST，它只是获取一个 JSON 字符串然后尝试返回它。

package ie.sidero.resources;

import javax.ws.rs.*;
import javax.ws.rs.core.MediaType;
import javax.ws.rs.core.Response;

@Path("/configurator")
public class ConfiguratorFileResource {

    @GET
    @Produces(MediaType.APPLICATION_JSON)
    public String getJsonConfigurationFile(){
        return "File/JSON will get returned here";
    }

    @POST
    @Consumes(MediaType.APPLICATION_JSON)
    @Produces(MediaType.TEXT_PLAIN)
    public String addJsonConfigurationFile(String jsonConfiguration){
        return jsonConfiguration;
        //return Response.ok("Got the JSON it is: " + jsonConfiguration).header("Access-Control-Allow-Origin", "*").build();
        //return Response.status(Response.Status.OK).entity(jsonConfiguration).build();
    }
}

我的问题是我只返回一个空字符串。我附上了两张图片，一张在代理中显示控制台输出，说正文为空，在邮递员中显示类似的结果。我在这里做错了什么？

更新：所以我的代理现在可以使用以下代码：

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  req.header('Content-Type', 'application/json');
  next();
});

app.post('/file', (req, res) => {
  request.post(
    { url: 'http://localhost:8080/configurator',
      body: JSON.stringify(req.body)},
    (error, response, body) => {
      if (error || response.statusCode !== 200) {
        return res.status(500).json({ type: 'error', message: err.message });
      }

       //var r = JSON.parse(body);
       //console.log("response body after send is: " +r)

       return res.json(JSON.parse(body));

    }
  )
});

至少看起来是这样。现在，当我使用邮递员时，向 localhost:8080/configurator（后端）或 localhost:3001/file（代理）发送请求会返回相同的结果，但是当我使用客户端应用程序并进行 ajax 调用时，我仍然在输出中看到 CORS 问题，可能现在的问题是，我什至用下面附加的ajax调用来调用我的代理，任何帮助都会很棒。有什么问题就问吧。

$.ajax({
            url: "http://localhost:3001/file", // Url to which the request is send
            type: "POST",             // Type of request to be send, called as method
            data: configJsonEdited,
            contentType: 'application/json',
            dataType: "json",         //Data expected back
            success: function(data)   // A function to be called if request succeeds
            {
                alert("YAY!!!!")
            },
            error: function(xhr, textStatus, errorThrown)
            {
                alert("Damnit!!")
                alert(textStatus);
                alert(errorThrown.toString());
            }
        });

Answer 1

通过将此依赖项添加到我的代理解决了 CORS 问题：

https://expressjs.com/en/resources/middleware/cors.html

Answer 2

最好不要从头开始编写代理。如果你真的想要一个 nodejs 代理，你可以使用 http-proxy 这样的东西：

const http = require('http');
const httpProxy = require('http-proxy');

const proxy = httpProxy.createProxyServer();

const server = http.createServer(function(req, res) {
    proxy.web(req, res, { target: 'http://localhost:8080' });
});

proxy.on('proxyRes', function (proxyRes, req, res) {
    res.setHeader('foo', 'bar');
}).on('error', function (e) {
    console.error(e);
});

server.listen(3001);

这只是一个愚蠢的例子，我从the http-proxy docs 粘贴了一些代码，错误处理显然不足以用于生产目的，但它表明您可以轻松创建代理并修补响应（在这种情况下，我添加了一个标题，因为这是您的主要用例）。

我刚刚对我的服务器进行了尝试，它传入了请求正文，然后进行了身份验证，它传回了错误和成功的 http 响应，并始终添加 foo 标头。