reactjs - 在 dev 和 prod 中创建 React App 的代理快递后端
问题描述
我是完全堆叠的新手,并且有一个 Create React App 在 Express 后端访问单个 /api/verify 端点。
在开发中,我在我的前端 package.json 中代理后端"proxy": "localhost:8081"
DevOps 需要将其部署到 GCP nginx 环境中,并且我需要使代理路径相对,因此我们不必在代理中对域进行硬编码。
我已经创建了一个.env.development
,.env.production
但我不确定如何正确使用它们,因此本地yarn start
代理localhost:8081
和生产构建代理了真实域。
我有一个典型的、简单的 Express server.js,但不知道如何将它们结合在一起。
const cors = require('cors');
const express = require('express');
const bodyParser = require('body-parser');
require('dotenv').config();
const app = express();
var corsOptions = {
origin: 'http://localhost:8081',
};
app.use(cors(corsOptions));
app.use(express.json());
app.use(bodyParser.json());
app.disable('x-powered-by');
// parse requests of content-type - application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: true }));
// simple route
app.get('/', (req, res) => {
res.json({ message: 'Welcome to bezkoder application.' });
});
require('./routes/gallery.routes')(app);
const PORT = process.env.PORT || 8081;
app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}.`);
});
而我的单一路线:
const { authJwt } = require('../middleware');
const galleryController = require('../controllers/gallery.controller.js');
module.exports = function (app) {
app.use(function (req, res, next) {
res.header(
'Access-Control-Allow-Headers',
'x-access-token, Origin, Content-Type, Accept',
);
next();
});
app.get(
'/api/verify',
[authJwt.verifyToken],
galleryController.fanPassGallery,
);
};
解决方案
推荐阅读
- json - 如何在 Python 中将 tkinter.treeview() 数据导出到 json 文件
- javascript - 将过滤应用于对象内容(值选项)nodejs
- sbt - 如何在 SBT 中每次运行时启动隧道?
- android - 颤振不产生屏幕
- node.js - VSC 断点保持未绑定
- python - 使用带有快速傅里叶变换的 GEKKO
- ruby-on-rails - Rails:未定义的方法“in_pasting?” 对于 Reline::ANSI:Class (NoMethodError)
- recursion - 如何使用递归函数将元素插入列表,然后在 Ocaml 中打印
- android - ThemeEnforcement 错误实际上是由未设置的属性引起的
- migration - Recharts v2:v1.8x 的重大更改