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 相关文章推荐
jQuery Ajax请求状态管理器打包
May 03 Javascript
关于jQuery对象数据缓存Cache原理以及jQuery.data详解
Apr 07 Javascript
AngularJS仿苹果滑屏删除控件
Jan 18 Javascript
Jquery实现$.fn.extend和$.extend函数
Apr 14 Javascript
js仿微博动态栏功能
Feb 22 Javascript
不得不看之JavaScript构造函数及new运算符
Aug 21 Javascript
详解JavaScript基础知识(JSON、Function对象、原型、引用类型)
Jan 16 Javascript
详解ES6中的三种异步解决方案
Jun 28 Javascript
基于Vue实现关键词实时搜索高亮显示关键词
Jul 21 Javascript
Element Table的row-class-name无效与动态高亮显示选中行背景色
Nov 30 Javascript
vue集成chart.js的实现方法
Aug 20 Javascript
vue transition 在子组件中失效的解决
Nov 12 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
PHP动态图像的创建
2006/10/09 PHP
PHP网上调查系统
2006/10/09 PHP
使用新浪微博API的OAuth认证发布微博实例
2015/03/27 PHP
PHP加密解密实例分析
2015/12/25 PHP
tp5框架内使用tp3.2分页的方法分析
2019/05/05 PHP
php和js实现根据子网掩码和ip计算子网功能示例
2019/11/09 PHP
javascript在一段文字中的光标处插入其他文字
2007/08/26 Javascript
Jquery知识点一 Jquery的ready和Dom的onload的区别
2011/01/15 Javascript
利用JavaScript判断浏览器类型及版本
2016/08/23 Javascript
Vue 父子组件数据传递的四种方式( inheritAttrs + $attrs + $listeners)
2018/05/04 Javascript
JSON的parse()方法介绍
2019/01/31 Javascript
JS实现页面跳转与刷新的方法汇总
2019/08/30 Javascript
package.json各个属性说明详解
2020/03/11 Javascript
[02:11]完美世界DOTA2联赛10月28日赛事精彩集锦:来吧展示实力强劲
2020/10/29 DOTA
Python中获取网页状态码的两个方法
2014/11/03 Python
简单实现python进度条脚本
2017/12/18 Python
django1.11.1 models 数据库同步方法
2018/05/30 Python
python将图片转base64,实现前端显示
2020/01/09 Python
Python使用qrcode二维码库生成二维码方法详解
2020/02/17 Python
python Django 反向访问器的外键冲突解决
2020/05/20 Python
分享unittest单元测试框架中几种常用的用例加载方法
2020/12/02 Python
一款纯css3实现的颜色渐变按钮的代码教程
2014/11/12 HTML / CSS
惠普墨西哥官方商店:HP墨西哥
2016/12/01 全球购物
Maison Lab荷兰:名牌Outlet购物
2018/08/10 全球购物
利用指针变量实现队列的入队操作
2012/04/07 面试题
大专学生推荐信范文
2013/11/19 职场文书
工商管理毕业生推荐信
2013/12/24 职场文书
2014年幼儿园元旦活动方案
2014/02/13 职场文书
租赁意向书范本
2014/04/01 职场文书
党的群众路线教育实践活动总结报告
2014/04/28 职场文书
保护环境倡议书范文
2014/05/13 职场文书
客运企业隐患排查工作方案
2014/06/06 职场文书
优秀教师个人材料
2014/12/15 职场文书
mysql对于模糊查询like的一些汇总
2021/05/09 MySQL
matlab xlabel位置的设置方式
2021/05/21 Python
mysql 索引的数据结构为什么要采用B+树
2022/04/26 MySQL