express代理静态资源

工作中有比较老的项目还是使用jq写的代码，这时就需要把本地的资源代理到线上进行修改。使用了express 和 http-proxy-middleware（代理中间件）

新建一个server.js文件

server.js文件随意放在电脑的任何位置，只要启动时在所在目录启动即可：

启动server.js

运行命令：node server.js 

server.js的内容

const express = require('express')
const { createProxyMiddleware } = require('http-proxy-middleware')

const app = express()
const port = 3001

// 设置代理目标
const target = 'http://example.com'
//const target = 'http://10.16.25.109/'

const proxyOptions = createProxyMiddleware({
  target,  // 目标服务器  
  changeOrigin: true,  // 对目标服务器的请求头进行修改
  secure: false,     //不安全的，不使用https访问，使用http访问
  pathRewrite: {
    //'^/api': '', // 重写路径，去掉/api前缀
  },
  onProxyRes: function (proxyRes, req, res) {
    // 设置CORS头部
    proxyRes.headers['Access-Control-Allow-Origin'] = '*'
  }
})
// 配置代理中间件
// 
app.use(['/yondif-gla-be', '/iuap-apcom-workbench'], proxyOptions)
// 配置代理中间件
app.use(['/yondif-glb-be', '/iuap-apcom-workbench'], proxyOptions)

// 配置代理中间件
app.use(['/yondif-glf-be', '/iuap-apcom-workbench'], proxyOptions)

// 服务静态文件
// gla配置文件
app.use('/yondif-gla-fe/yondif-gl/pf/gl/', express.static('/workspace/cwy-8.33/gl-8.33/gl-fe/pf/gla/'))  // /workspace/cwy-8.33/gl-8.33/gl-fe/pf/gla/为自己的本地文件夹，存放静态资源的，这句的意思是把本地的资源代理到线上/yondif-gla-fe/yondif-gl/pf/gl/。只要访问以/yondif-gla-fe/yondif-gl/pf/gl/开头的文件，则自动代理到本地/workspace/cwy-8.33/gl-8.33/gl-fe/pf/gla/文件夹下
app.use('/yondif-gla-fe/yondif-gl/pf/glCommon/', express.static('/workspace/cwy-8.33/gl-8.33/gl-fe/pf/glCommon/'))
app.use('/yondif-gla-fe/yondif-gl/pf/pub/', 





//express监听3001端口，启动服务  
app.listen(port, () => {
  console.log(`Static page server running on http://localhost:${port}`)
})

在这个示例中，所有请求以 `/yondif-gla-be` 或 `/iuap-apcom-workbench` 开头的请求都会被代理到 `http://example.com`，并且相应的前缀会被移除。这意味着请求 `/yondif-gla-be/test` 会被转发到 `http://example.com/test`，请求 `/iuap-apcom-workbench/test` 也是一样。

请确保将 `http://example.com` 替换为你实际的目标服务器地址。根据具体需求，你还可以进一步调整配置选项。

proxy代理后端接口到线上

vue中新建vue.config.js

   内容如下：
   

module.exports = {
  pwa: {},

  devServer: {
    open: false,
    host: '0.0.0.0',
    //指定用于侦听请求的端口号
    port: 8088,
    //默认情况下，dev-server将通过HTTP提供。它也可以选择通过HTTPS在HTTP/2上提供：
    https: false,
    //启用热模块替换（请参阅 devServer.hot）,在没有页面刷新的情况下作为构建失败时的后备。
    hotOnly: false,
    // 开发环境线上服务代理配置
    // R5环境配置代理，防止跨域
    proxy: {
      '/yondif-gla-be': {
        target: proxyPath,
        secure: false,
        changeOrigin: true,
        // pathRewrite: {
        //   '^/yondif-gla-be': '' //重写路径，不能重写路径，因为这样调用接口前面都不加yondif-gla-be了
        // },
        cookieDomainRewrite: {
          '*': proxyPath
        },
        headers: {
          Origin: proxyPath
        }
      },
      '/ur': {
        target: proxyPath,
        secure: false,
        changeOrigin: true,
        // pathRewrite: {
        //   '^/yondif-gla-be': '' //重写路径，不能重写路径，因为这样调用接口前面都不加yondif-gla-be了
        // },
        cookieDomainRewrite: {
          '*': proxyPath
        },
        headers: {
          Origin: proxyPath
        }
      }
    }
  },
}