node网络代理 实现测试、生产环境前端跨域
package.json

"scripts": {"serve": "vue-cli-service serve --open","start": "node server.js","build": "vue-cli-service build","lint": "vue-cli-service lint --fix","test:unit": "vue-cli-service test:unit",},

docker 配置 npm start

serve.js 文件如下

'use strict';// Constants
const PORT = 8080;
const HOST = '0.0.0.0';
const REQUEST_ID_HEADER = 'x-fc-request-id'const express = require('express');
const bodyParser = require('body-parser');
//中间件支持多个代理
const { createProxyMiddleware } = require('http-proxy-middleware');
const cookieParser = require('cookie-parser');
//代理配置文件
const proxyConfig = require('./config/proxy');
const app = express();
const { DEPLOY_ENV } = process.env;console.log('using DEPLOY_ENV =>', DEPLOY_ENV);app.use(cookieParser());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.use(bodyParser.raw());app.get('/health', (req, res) => {console.log(`receive health check`);res.status(200);console.log(`i am ready`);res.send('i am ready\n');
});// eslint-disable-next-line guard-for-in
for (const path in proxyConfig) {app.use(path, createProxyMiddleware(proxyConfig[path]));
}
// invocation
app.post('/invoke', (req, res) => {var rid = req.headers[REQUEST_ID_HEADER]console.log(`FC Invoke Start RequestId: ${rid}`)res.send('OK');console.log(`FC Invoke End RequestId: ${rid}`)
});var server = app.listen(PORT, HOST);
console.log(`Running on http://${HOST}:${PORT}`);
app.use(express.static('dist'));
server.timeout = 0; // never timeout
server.keepAliveTimeout = 0; // keepalive, never timeout

src同级新建 config文件夹下 新增proxy.js

const { DEPLOY_ENV = 'dev' } = process.env.NODE_ENV || {};
console.log(`target: ${process.env.NODE_ENV}`)
const targetConfig = {// 跨域效验配置目标跨域地址insuranceclauseApi: {branch: 'http://arm-tech.net/',dev: 'http://arm-tech.net/',test: 'http://arm-tech.net/',development: 'http://arm-tech.net/',production: 'http://arm-tech.net/',},
};function getProxyTarget(name) {const config = targetConfig[name];// @ts-ignorelet target = config[DEPLOY_ENV] || config.production;console.log(`${name} functarget: ${target}`);return target;
}
const proxyConfig = {'/corsApi': {target: getProxyTarget('insuranceclauseApi'),changeOrigin: true,secure: false,pathRewrite: {"^/corsApi": "/",},},
};module.exports = proxyConfig;

vue 文件

import axios from 'axios'RequestSessionId(e) {var params = {abc: '123',}axios.get('/corsApi/valid2?123=' + params.abc).then(response => {console.log('response',response)},error => {'请求失败',error.message})},

一定要用原装axios 封装axios会有一些头参数或者其他更改导致跨域请求报错。