跨域请求:JSONP和HttpClient

JSONP和HttpClient的区别和理解

今天我们来说说JSONP和HttpClient。

一、什么是跨域?

浏览器从一个域名请求另一个域名的资源时,域名、端口、协议这三个任何一个不同,都叫跨域。
例:
https://www.bilibili.com/8080

  • http:// 协议
  • www.bilibili.com域名
  • 8080 端口

www是组成域名的一部分,非必填;.com是域名的尾缀。

二、为什么要跨域?

为了服务器便于管理和减轻服务器压力。

开发者把获取数据的事情交给一个项目去完成,如果其他项目想要获取该项目的数据时,跨域调用该项目端口,更易于开发和后期维护。
就比方,某淘平台,可以在pc端访问,可以再ios、安卓端访问,这些不一样的界面访问的数据库一样,如果都单独写接口的话,是比较费时费力,所以封装好一个统一的获取数据的项目,其他想要获取数据的项目只需调用该项目的端口即可。

三、如何跨域

常见的跨域请求方式:JSONP和HttpClient

1、JSONP

实现JSONP跨域
/javascript-src开放策略/回调函数/数据封装

//创建script标签
var script=document.createElement('script')
 
//设置回调函数
function getData(data){
    //数据请求回来会被触发的函数
    console.log(data);
}
//设置script的src属性,设置请求地址
script.src="http://localhost:3000?callback=getData";
 
//让script生效
document.body.appendChild(script);

总结

  1. JSONP可以解决主流浏览器的跨域问题,JSONP请求是由浏览器解析ajax生成的跨域请求,相当于模拟了网页请求
  2. JSONP只支持GET请求
  3. JSONP安全性低

在这里插入图片描述

2、HttpClient
  1. java中http请求的开发工具包.在任何地方都能使用

  2. HttpClient是由业务层,执行发起的http请求
    在这里插入图片描述

  3. 调用层级5层(前台2层–>后台3层) 支持全部http请求方式(7种)
    获取资源的get方法,传输实体的post方法,传输文件的put方法,获取报文首部的head方法,删除文件的delete方法,询问支持的options方法。

  4. httpClient支持系统之间的调用,不经过浏览器,相对安全

四、扩展

JSONP跨域请求也是有安全问题,这里不得不提的就是CSRF攻击

举个例子来讲:
在X网页里,嵌入了Z网页的嵌入式框架,小明在不清楚域名的情况下,通过X网页点进了Z网页,并且在Z网页里输入了用户名、密码等重要信息,那么在Z网页中产生的cookie值,就会被X网页通过document.querySelector(‘iframe’).contentWindow.document.cookie脚本抓取到这些cookie,这样就会很危险,尤其是对于金融的行业。

总结:如果进行跨域请使用jsonp进行简单操作,涉及到用户隐私密码账户等信息不可使用.但可以使用httpClient进行此类功能实现。

参考文章:https://blog.csdn.net/qcg14774125/article/details/89494705

  • 4
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值