ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

跨域

2021-09-13 16:00:06  阅读:123  来源: 互联网

标签:请求 script js 同源 jsonp 跨域


同源策略
+ **同源策略是浏览器给的一个行为**
+ 当你再发送请求的时候, 会涉及到两个地址
1. 打开当前页面的地址
2. 你要请求的地址
+ 两个地址中的 端口号 域名 传输协议
=> 只要由任意一个不一样, 就是非同源请求
=> 就会触发浏览器的同源策略
=> 不允许你获取这个服务器上的数据

触发了同源策略的请求我们叫做 跨域请求
+ 私人: 请求别人家的服务器
+ 第一:
=> 真实开发环境
=> 页面(html, js, css, 静态资源) 是在一个服务器上
=> 所有的数据, 数据库, 在一个服务上
+ 第二:
=> 真实开发环境
=> 我自己不具备条件, 购买别人家服务器服务
=> 美团: 地图功能
=> 新闻: 买新浪的接口, 腾讯的接口

解决浏览器不允许请求别人家服务器的情况
+ 基于 http 协议
1. jsonp
2. cors
3. 代理

jsonp 跨域
+ 因为浏览器的同源策略, 不允许发送跨域的 ajax 请求
+ 我们使用 jsonp 手法来实现跨域请求

script 标签
+ script 标签可以执行 js 代码
=> script 标签有一个属性叫做 type="text/javascript"
=> 就会把里面的代码当作 js 来解析
=> 当你不写 type 属性的时候, 默认是 text/javascript
+ src 属性
=> src 是引入外部资源的属性
=> 不受同源策略的影响
+ 当上面两个加再一起
=> 只要你引入任何一个内容, 都会被当作 js 代码来解析

jsonp 的核心
+ 利用 script 标签的 src 属性
+ 去向一个非同源的服务器请求数据
+ 只要这个服务器能给我返回一个字符串
+ 我就会把这个字符串当作 js 代码来执行

jsonp 请求数据
+ 要求服务器返回一个 函数名() 这样的字符串
+ 要求提前准备号一个函数
+ 要求前端告诉后端你准备好的函数名是什么
=> 再发送请求的时候, 以参数的形式告诉后端
=> 我准备好的函数名叫做什么

jsonp 常见的面试题
1. jsonp 原理
=> src 不受同源策略影响
=> script 标签会把请求的内容当作 js 代码来执行
2. jsonp 的返回值
=> 字符串, 函数名() 形式的字符串
=> 一段可以执行的 js 代码字符串
3. jsonp 的优缺点
=> 优点
-> 绕开了同源策略, 实现跨域请求
-> 方便, 因为是以 script 标签外部资源的形式请求
=> 缺点
-> 不好做安全防范

标签:请求,script,js,同源,jsonp,跨域
来源: https://www.cnblogs.com/phantomyy/p/15262787.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有