Question

所以我正在为单页反应应用程序编写一系列自动化测试。测试依赖于公开在与应用程序不同的端口上的模拟 API。为了解决 cors 问题，为 SPA 提供服务的 local-web-server 实例被设置为将 api 请求代理到后端。这是服务器的配置文件：

const server = process.env.SERVER;
const port = process.env.PORT;

module.exports = {
    port: port,
    rewrite: [
        {
            from: '/api/(.*)',
            to: `${server}/$1`
        }
    ],
    logFormat: 'tiny',
    spa: 'index.html'
};

我正在使用 Selenium 测试容器，并且该应用程序是从测试代码下载的 docker 映像运行的。这是 docker 文件：

FROM node:10.16.0-alpine

ENV PORT=5000

COPY ./build ./
COPY ./docker ./

EXPOSE ${PORT}

RUN npm config set unsafe-perm true
RUN npm install local-web-server -g
CMD ws --config-file web-server-config.js

过去两天我一直试图解决的问题是，代理甚至没有尝试访问后端。我一直在运行 wireshark 进行调试，因为我无法在 selenium 控制的浏览器中可靠地访问开发工具。代理接收到 /api/* 的请求，然后返回 504 网关超时，甚至没有尝试访问后端。没有 [SYN] 数据包或任何东西。有没有人有过这样的问题的经验？如果您能指出我正确的方向，我将不胜感激。

Answer 1

如果这是用于开发，您可能需要查看 proxy feature for React.js。您只需将以下配置添加到您的 package.json 中，如果您使用 react-scripts start（即提供的 npm start 和 {{ 1}}。

create-react-app

如果您的 React 应用程序和您的其他后端都已使用 Docker Compose 进行了 Docker 化，只需确保容器位于名称 docker network 中，并且您可以在 React 的代理配置中指定 { ... "proxy": "http://backend:3000", ... } 名称，因为它将在docker 的 DNS。

例如：

services

本地网络服务器代理不转发请求

1 个答案: