node实现简单的反向代理服务器


Posted in Javascript onJuly 26, 2017

每当提起反向代理器,人们通常一想到的就是 Nginx,但是今天我们暂时忽略大名鼎鼎的 Nginx,采用同样也是使用单线程、事件循环的服务端小弟——Node 来达成

跨域问题是前端开发很常见的问题

解决方案有很多种

  1. jsonp返回
  2. Access-Control-Allow-Origin:'*' (需要注意的是 对于post请求会变成option请求需求后端支持)
  3. 前端添加代理

前端添加代理

以vue-cli为例,前端添加代理

dev: {
  env: require('./dev.env'),
  port: 8888,
  autoOpenBrowser: true,
  assetsSubDirectory: 'static',
  assetsPublicPath: '/',
  proxyTable: {
   '/api':{
    target: 'http://localhost:3000',
    changeOrigin: true,
   }
  }

其中'/api'为接口的前缀,target为后端服务地址

前端请求示例

vm.$http.post('/api/reg', JSON.stringify(info)).then(() => {

 }, () => {

 });

反向代理

反向代理可以理解为指定一个服务地址为内部服务器地址。

为什么需要反向代理

如果只是作为接口请求,其实前端搭建代理服务器就可以了,但是代理服务器并不能满足所有的日常开发。

比如说单点登录的实现,需求服务端做302跳转。但是前端文件没有部署到后端服务器时,set-cookie是不能成功种下cookie登录信息的。

这就需要在后端服务器添加反向代理。

示例如下

const http = require('http');
const httpProxy = require('http-proxy');
const proxy = httpProxy.createProxyServer();
const proxyServer = http.createServer((req, res) => {
 proxy.web(req, res, {
  target: 'http://localhost:8888',
 });
});
proxyServer.listen(8088, () => {
 console.log('proxy server is running ');
});

这样前端开发就可以在8088端口了,当然热加载功能是在前端服务器的8888端口

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 字符串与数组转换函数[不用split与join]
Dec 13 Javascript
javascript dom 基本操作小结
Apr 11 Javascript
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
May 07 Javascript
jQuery之ajax技术的详细介绍
Jun 19 Javascript
使用命令行工具npm新创建一个vue项目的方法
Dec 27 Javascript
详解vuex的简单使用
Mar 12 Javascript
vue左右侧联动滚动的实现代码
Jun 06 Javascript
vue中,在本地缓存中读写数据的方法
Sep 21 Javascript
localstorage实现带过期时间的缓存功能
Jun 28 Javascript
如何基于原生javaScript生成带图片的二维码
Nov 21 Javascript
详细分析vue响应式原理
Jun 22 Javascript
three.js如何实现3D动态文字效果
Mar 03 Javascript
Angular项目中$scope.$apply()方法的使用详解
Jul 26 #Javascript
Vue中计算属性computed的示例解读
Jul 26 #Javascript
让你彻底掌握es6 Promise的八段代码
Jul 26 #Javascript
Bootstrap datepicker日期选择器插件使用详解
Jul 26 #Javascript
js实现图片轮播效果学习笔记
Jul 26 #Javascript
Angular4如何自定义首屏的加载动画详解
Jul 26 #Javascript
vue上传图片组件编写代码
Jul 26 #Javascript
You might like
一个没有MYSQL数据库支持的简易留言本的编写
2006/10/09 PHP
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
比较全的JS checkbox全选、取消全选、删除功能代码
2008/12/19 Javascript
细说javascript函数从函数的构成开始
2013/08/29 Javascript
屏蔽script注入小例子
2013/11/12 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
Jquery.Form 异步提交表单的简单实例
2014/03/03 Javascript
jQuery背景插件backstretch使用指南
2015/04/21 Javascript
jQuery实现带有洗牌效果的动画分页实例
2015/08/31 Javascript
jquery实现图片上传前本地预览功能
2016/05/10 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
JavaScript触发onScroll事件的函数节流详解
2016/12/14 Javascript
js实现仿购物车加减效果
2017/03/01 Javascript
JS实现加载时锁定HTML页面元素的方法
2017/06/24 Javascript
详解基于Node.js的微信JS-SDK后端接口实现代码
2017/07/15 Javascript
layui 监听表格复选框选中值的方法
2018/08/15 Javascript
在Node.js下运用MQTT协议实现即时通讯及离线推送的方法
2019/01/24 Javascript
详解Element 指令clickoutside源码分析
2019/02/15 Javascript
Angular Excel 导入与导出的实现代码
2019/04/17 Javascript
js 闭包深入理解与实例分析
2020/03/19 Javascript
JavaScript数组排序功能简单实现
2020/05/14 Javascript
JS绘图Flot应用图形绘制异常解决方案
2020/10/16 Javascript
ant design vue datepicker日期选择器中文化操作
2020/10/28 Javascript
[01:32]DOTA2 2015国际邀请赛中国区预选赛第四日战报
2015/05/29 DOTA
[02:54]DOTA2亚洲邀请赛 VG战队出场宣传片
2015/02/07 DOTA
进一步探究Python中的正则表达式
2015/04/28 Python
python爬虫实例详解
2018/06/19 Python
一篇文章搞懂python的转义字符及用法
2020/09/03 Python
物流管理应届生求职信
2013/11/07 职场文书
学期研究性学习个人的自我评价
2014/01/09 职场文书
创业大赛策划书
2014/03/01 职场文书
张思德观后感
2015/06/09 职场文书
当你焦虑迷茫时,请读读这6句话
2019/07/24 职场文书
生鲜超市—未来中国最具有潜力零售业态
2019/08/02 职场文书
Django基础CBV装饰器和中间件
2022/03/22 Python
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS