说说如何利用 Node.js 代理解决跨域问题


Posted in Javascript onApril 22, 2019

前后端分离,经常会出现跨域访问被限制的问题。

跨域访问限制是服务端出于安全考虑的限制行为。即只有同域或者指定域的请求,才能访问。这样还可以防止图片被盗链。服务端(比如 Node.js)可以通过代理,来解决这一问题。

1 安装 request 库

npm install request --save-dev

2 配置

我们以知乎日报为例,配置两个代理。一个代理内容,另一个代理图片。

在项目根目录,配置 proxy.js :

//代理
const http = require('http');
const request = require('request');

const hostIp = '127.0.0.1';
const apiPort = 8070;
const imgPort = 8071;

//创建 API 代理服务
const apiServer = http.createServer((req, res) => {
  console.log('[apiServer]req.url='+req.url);
  const url = 'http://news-at.zhihu.com/story' + req.url;
  console.log('[apiServer]url='+url);
  const options = {
    url: url
  };

  function callback(error, response, body) {
    if (!error && response.statusCode === 200) {
      //编码类型
      res.setHeader('Content-Type', 'text/plain;charset=UTF-8');
      //允许跨域
      res.setHeader('Access-Control-Allow-Origin', '*');
      //返回代理内容
      res.end(body);
    }
  }

  request.get(options, callback);
});

//监听 API 端口
apiServer.listen(apiPort, hostIp, () => {
  console.log('代理接口,运行于 http://' + hostIp + ':' + apiPort + '/');
});

//创建图片代理服务
const imgServer = http.createServer((req, res) => {
  const url = 'https://pic2.zhimg.com/' +req.url.split('/img/')[1];
  console.log('[imgServer]url=' + url);
  const options = {
    url: url,
    encoding: null
  };

  function callback(error, response, body) {
    if (!error && response.statusCode === 200) {
      const contentType = response.headers['content-type'];
      res.setHeader('Content-Type', contentType);
      res.setHeader('Access-Control-Allow-Origin', '*');
      res.end(body);
    }
  }

  request.get(options, callback);


});

//监听图片端口
imgServer.listen(imgPort, hostIp, () => {
  console.log('代理图片,运行于 http://' + hostIp + ':' + imgPort + '/')
});

代理的关键点是在响应头添加 Access-Control-Allow-Origin 为 *,表示允许所有域进行访问。

代理前地址 代理后地址
https://pic2.zhimg.com/v2-bb0a0282fd989bddaa245af4de9dcc45.jpg http://127.0.0.1:8071/img/v2-bb0a0282fd989bddaa245af4de9dcc45.jpg
http://news-at.zhihu.com/story/9710345 http://127.0.0.1:8070/9710345

3. 运行

执行:

node proxy.js

 运行结果:

代理接口,运行于 http://127.0.0.1:8070/代理图片,运行于http://127.0.0.1:8071/

打开浏览器,输入代理后的地址,就可以正常访问啦O(∩_∩)O哈哈~

代理内容:

说说如何利用 Node.js 代理解决跨域问题

代理图片:

说说如何利用 Node.js 代理解决跨域问题

以上所述是小编给大家介绍的Node.js代理解决跨域问题详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
前台js改变Session的值(用ajax实现)
Dec 28 Javascript
JS通过ajax动态读取xml文件内容的方法
Mar 24 Javascript
jQuery使用fadeout实现元素渐隐效果的方法
Mar 27 Javascript
jQuery EasyUi实战教程之布局篇
Jan 26 Javascript
关于Vue.js 2.0的Vuex 2.0 你需要更新的知识库
Nov 30 Javascript
Angular4实现动态添加删除表单输入框功能
Aug 11 Javascript
js实现rem自动匹配计算font-size的示例
Nov 18 Javascript
深入理解Promise.all
Aug 08 Javascript
利用Electron简单撸一个Markdown编辑器的方法
Jun 10 Javascript
jquery树形插件zTree高级使用详解
Aug 16 jQuery
Emberjs 通过 axios 下载文件的方法
Sep 03 Javascript
Vue实现计算器计算效果
Aug 17 Javascript
详解Vue中使用Axios拦截器
Apr 22 #Javascript
Vue.js + Nuxt.js 项目中使用 Vee-validate 表单校验
Apr 22 #Javascript
vue 项目build错误异常的解决方法
Apr 22 #Javascript
js实现web调用摄像头 js截取视频画面
Apr 21 #Javascript
今天,小程序正式支持 SVG
Apr 20 #Javascript
详解Vue中组件的缓存
Apr 20 #Javascript
Node.js折腾记一:读指定文件夹,输出该文件夹的文件树详解
Apr 20 #Javascript
You might like
PHP 获取远程文件内容的函数代码
2010/03/24 PHP
解析CI的AJAX分页 另类实现方法
2013/06/27 PHP
php中通过curl检测页面是否被百度收录
2013/09/27 PHP
ThinkPHP连接数据库的方式汇总
2014/12/05 PHP
thinkPHP5实现数据库添加内容的方法
2017/10/25 PHP
Apply an AutoFormat to an Excel Spreadsheet
2007/06/12 Javascript
js加解密 脚本解密
2008/02/22 Javascript
JS弹出对话框返回值代码(asp.net后台)
2010/12/28 Javascript
提示$ is not defined错误分析及解决
2013/04/09 Javascript
angularJS 入门基础
2015/02/09 Javascript
js弹出窗口简单实现代码
2017/03/22 Javascript
jQuery+ajax读取json数据并按照价格排序示例
2018/03/28 jQuery
Vue.js更改调试地址端口号的实例
2018/09/19 Javascript
详解在网页上通过JS实现文本的语音朗读
2019/03/28 Javascript
使用jQuery mobile NuGet让你的网站在移动设备上同样精彩
2019/06/18 jQuery
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
Python中设置变量作为默认值时容易遇到的错误
2015/04/03 Python
Python实现Linux命令xxd -i功能
2016/03/06 Python
python+requests+unittest API接口测试实例(详解)
2017/06/10 Python
基于python3 类的属性、方法、封装、继承实例讲解
2017/09/19 Python
对python中大文件的导入与导出方法详解
2018/12/28 Python
python实现词法分析器
2019/01/31 Python
Python 保持登录状态进行接口测试的方法示例
2019/08/06 Python
python+mysql实现个人论文管理系统
2019/10/25 Python
使用Pycharm(Python工具)新建项目及创建Python文件的教程
2020/04/26 Python
Book Depository欧盟:一家领先的国际图书零售商
2019/05/21 全球购物
迪卡侬印尼体育用品商店:Decathlon印尼
2020/03/11 全球购物
中专自荐信
2013/10/13 职场文书
文艺演出策划方案
2014/06/07 职场文书
八月一日观后感
2015/06/10 职场文书
特种设备安全管理制度
2015/08/06 职场文书
个人向公司借款协议书
2016/03/19 职场文书
vue前端工程的搭建
2021/03/31 Vue.js
解决xampp安装后Apache无法启动
2022/03/21 Servers
Mysql 文件配置解析介绍
2022/05/06 MySQL
LeetCode189轮转数组python示例
2022/08/05 Python