服务器代理的作用
解决跨域:
原理: 利用服务器访问服务器没有跨域问题的原理
请求过程:先向代理(同源)服务器发起请求,再由代理(同源)服务器请求外部服务器
代理服务器的搭建
安装 http-proxy-middleware 包
`npm install --save-dev http-proxy-middleware`
一个简单的代理服务器代码
var express = require('express'); var proxy = require('http-proxy-middleware'); var app = express(); app.use('/api', proxy({target: 'http://localhost:3001/', changeOrigin: true})); app.listen(3000);
http-proxy-middleware 的配置
proxy([context,] config)
proxy('/api', {target: 'http://10.16.85.138:8080'}) 当发起的请求包含`/api`时,请求就会经过代理服务器,例如: 项目发起的请求地址是:`http://localhost:8000/api` 经过代理服务器就变成了:`http://10.16.85.138:8080/api`
常见的配置对象例子
// 引用依赖 var express = require('express'); var proxyMiddleware = require('http-proxy-middleware'); // proxy 中间件的选择项 var proxyTable = { '/api': { // 目标服务器 host target: 'http://10.16.85.138:8080', // 默认false,是否需要改变原始主机头为目标URL changeOrigin: true, pathRewrite: { // 重写请求,比如我们源访问的包含/api,那么请求会将/api替换为/yh/ihr/api '/api': '/yh/ihr/api', // 重写请求,比如我们源访问的是api/old-path,那么请求会被解析为/api/new-path '^/api/old-path' : '/api/new-path', // 同上 '^/api/remove/path' : '/path' }, router: { // 如果请求接口 == '/api/' // 则重写目标服务器 'http://10.16.85.138:8080' 为 'http://localhost:8000' '/api/' : 'http://localhost:8000' }, // proxy事件: 监听请求返回事件 onProxyRes : proxy.on('proxyRes', function (proxyRes, req, res) { console.log('target', JSON.stringify(proxyRes.headers, true, 2)) }); } } Object.keys(proxyTable).forEach(function (context) { var options = proxyTable[context] if (typeof options === 'string') { options = { target: options } } // 创建并使用代理 app.use(proxyMiddleware(options.filter || context, options)) }) app.listen(8000);
- option.pathRewrite: 对象/函数,重写目标url路径
// 重写 pathRewrite: {'^/old/api' : '/new/api'} // 移除 pathRewrite: {'^/remove/api' : ''} // 添加 pathRewrite: {'^/' : '/basepath/'} // 自定义 pathRewrite: function (path, req) { return path.replace('/api', '/base/api') }
option.router:对象/函数,重新指定请求转发目标
// 使用主机或者路径进行匹配,返回最先匹配到结果 // 所以配置的顺序很重要 router: { 'integration.localhost:3000' : 'http://localhost:8001', // host only 'staging.localhost:3000' : 'http://localhost:8002', // host only 'localhost:3000/api' : 'http://localhost:8003', // host + path '/api/iaf/search' : 'http://localhost:8004' // path only } // 自定义 router: function(req) { return 'http://localhost:8004'; }
http-proxy 事件
option.onError: 监听proxy错误事件
option.onProxyRes:监听proxy的回应事件
option.onProxyReq:监听proxy的请求事件
代理服务器请求转换图解: