位置: 编程技术 - 正文

借助node实战JSONP跨域实例(如何使用nodejs)

编辑:rootadmin

推荐整理分享借助node实战JSONP跨域实例(如何使用nodejs),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:怎么用node.js写接口,用nodejs写接口优缺点,node jsonp,node js import,node json,node json,用nodejs写接口优缺点,node json,内容如对您有帮助,希望把文章链接给更多的朋友!

一、前言:

浏览器安全是基于同源策略的。所谓同源策略就是三相同:

1、协议相同;

2、域名相同;

3、端口相同。

但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限制,其中有一方法就是JSONP。

JSONP的基本思想:就是通过<script>的src,向服务器请求数据,且这不受同源策略限制(img和iframe的src也是如此);然后服务器将相应的数据放入指定的函数回调名中,返回给前端。

这,就实现了跨域请求信息。

如下图所示:

了解了JSONP的大体思路,接下来,我们借助node来搭建一个简单的服务器,与前端一步步实现JSONP带来的跨域请求之旅吧。

二、搭建node server:

因为前端要实现跨域请求,需要与后台配合。在这里,我们使用是node来模拟后台服务器。

So,你得对node有一定认识以及开发环境。

接下来,我们就编写一个简单的node服务器吧。

首先,我们需要引入http模块,因为是基于http请求的嘛。然后就是用其创建一个http服务器,如监听的是端口。

借助node实战JSONP跨域实例(如何使用nodejs)

如下:

接着,因为我们要对使用JSONP的请求与正常请求区分,所以,后台得判断处理—通过解析url字符串,假设这里我们是通过带有'/jsonp'的路径名来判断。

如下:

在上面的代码中行,有个缺点就是,我们将回调函数的名字规定死了,当我们判断请求为JSONP时,只能往前端传入test,这样显然不合理。

所以,我们得借助于querystring 这个模块,来处理query字符串。

如下:

这样,我们就将一个我们需要的服务器搭建好了。

服务器有了,接下来,就是前端跨域请求了。

三、JSONP跨域请求之旅:

因为我们是借助于<script>标签中的src来实现请求的,在服务器中已经约定,在请求后加入'/jsonp&#;callback',就将其认定为JSONP请求,且callback后带入一个js中已有的全局方法。

所以,代码可以如下:

好了,前后端都编码完毕,接下来,我们就看看效果吧。

首先启动node服务器,如下:

注:我将我们搭建的服务器server.js放在D:/JSONP中

接下来,运行上面所写的html代码,可以发现请求成功,并执行test方法。

但,我们一进来,就得跨域请求,是否有点不妥,所以可以动态创建script元素,并指定相应请求,任由我们所为。

如下:

JSONP还需要注意的就是,回调函数的方法必须是全局的,不然会报错的,因为是通过script的src请求的嘛,请求成功后立即执行。

标签: 如何使用nodejs

本文链接地址:https://www.jiuchutong.com/biancheng/377907.html 转载请保留说明!

上一篇:node.js程序作为服务并在windows下开机自启动(用forever)(node js作用)

下一篇:教你快速搭建Node.Js服务器的方法教程(搭建oj)

  • 小规模纳税人企业所得税计算
  • 耕地占用税是什么税种
  • 记账凭证填错了怎么改
  • 企业购置房产进项被折旧怎么处理
  • 汇兑损益现金流量表列示
  • 生产工人工资和福利费是产品成本项目对吗
  • 形式发票怎么写
  • 进口增值税可以抵税吗
  • 同一个人可以在两个地方交社保吗
  • 费用的增加会减值吗
  • 适用于6%税率的优惠
  • 有限合伙合伙人要求
  • 以库存现金代垫怎么做账
  • 收到外国的货款会计分录
  • 建筑工程地址
  • 营改增后商品房销售合同印花税的计税依据是什么?
  • 所得税弥补亏损年限10
  • 污泥处置中心所得税优惠政策
  • 个人房产税征收标准
  • 建筑行业一般纳税人简易征收的范围
  • 怎样预交增值税
  • 外地派人来出差怎么报备
  • 工程部物品领用表格模板
  • 营业成本包括哪些会计科目
  • 简易征收发票认证了之后怎么处理
  • 苹果电脑mac系统怎么升级
  • 企业原材料成本有哪些
  • 银行的财务会计
  • win10应用商店下载的软件在哪
  • win11升级卡66
  • win10开发工具在哪
  • 前端解决方案
  • ocxdll.exe - ocxdll是什么进程 有什么用
  • 免抵退税的账务处理
  • vue3使用vueup/vue-quill富文本、并限制输入字数
  • 企业所得税纳税义务发生时间
  • 劳务公司成本票不够怎么办
  • html制作网页教程
  • 政府补助 不征税
  • 个体户缴纳的税有哪些
  • opencv调用yolov8
  • php过滤html
  • 公司代扣社保费怎么做账
  • 生产过程报废和返工产生的成本
  • 怎么防止?
  • 公司注销其他应付款有余额有影响吗
  • 印花税申报怎么更正采集处理
  • 财产租赁合同按金额的多少进行计税
  • 税务现金流量表填错了怎么办
  • 小微企业税收优惠政策从什么时候开始
  • 贷款利息收入要交增值税吗
  • 一般纳税人福利费
  • 理财中的资产是什么意思
  • 一次摊销法的账务处理
  • 收到银行退回的手续费怎么做会计分录
  • 反结账钱会转回去吗
  • 银行存款日记账手工账填写样本
  • 企业的财务战略
  • 速动比率特别高的原因
  • 私营公司应付利息怎么算
  • xp蓝屏事件
  • mac桌面应用
  • win1021年更新
  • winxp如何禁用u盘
  • 错误代码0x8007007B
  • 在linux中使用什么命令可以执行shell脚本
  • windows7手动更新
  • win10系统关闭安全中心
  • 开始菜单里没有设置选项
  • Linux禁止MySQL开机自启动的小技巧
  • windows visual studio 基于openGL的粒子系统设计
  • node.js wss
  • 用shell写一个脚本,对文本中无序的一列数字排序
  • python安装心得
  • xmpp client
  • eclipse自动生成
  • 广州市税务局机构设置
  • 外经证办理流程在哪个网站申请
  • 消费税的税收筹划ppt
  • 船舶吨税的税目
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设