前端面试题常考&必考之--跨域的解决办法
1.为啥出现跨域???
在制定Html规则时,为了安全的考虑,一个源的脚本(网页,网站)不能与另一个源的资源进行交互,
所以就引发一个词叫做“同源策略”。
同源策略:同源策略是一种约定,它是浏览器最核心的也最基本的安全功能,如果缺少了同源策略,则
浏览器的正常功能可能会受到影响。
同源:所谓同源(即指在同一个域),就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)
2.啥是跨域???
当协议,主机,和端口号有一个不同时,就是跨域。

需要注意的是:默认的端口号是80

3.受限制的场景有哪些呢???(面试回答)
1)Cookie,LocalStorage无法读取
2)DOM和js对象无法读取,主要是iframe(可以说有iframe的对象无法读取)
3) Ajax请求不能发送
跨域报错长这样子:

4.解决跨域的方法???
对最主要的AJAX跨域来说(也就是平常调接口时):
1)(后端)服务器配置CORS(跨域资源共享)
2) (后端)node.js或nginx,反向代理,把跨域改造成同域
3)(前端)将JSON升级成JSONP,在JSON的基础上,利用<script>标签可以跨域的特性,加上头设置
对iframe跨域来说:
H5提供了postMessage()的方法,可以在父子页面进行通信(加分项)
前端面试题常考&必考之--跨域的解决办法的更多相关文章
- 前端面试题常考&必考之--用jquery写出当前元素的同辈元素的第二个结点的value值
问题:用jquery写出当前元素的同辈元素的第二个结点的value值??? 分析:该题目有一个坑,那就是,如果当前元素没有第二个兄弟结点呢(坑坑坑) 解析: 一般我们可能会这样写: $(this).s ...
- 前端面试题常考&必考之--http中的post和get的区别
从字面上看,post是发送,则是提交数据,get是获得,则是获取数据,没毛病,我们可以就按字面来理解 具体就看图吧 吐槽:插入的表格不好用,不知道是自己不会用还是真不好用,变成了截图,修饰了下子
- 前端面试题常考&必考之--盒子模型和box-sizing(项目中经常使用)
主要考察width的值,包括padding\border\content等属性??? box-sizing属性是css3特有的哦*** 1>当box-sizing:content-box;时,跟 ...
- 前端面试题常考&必考之--清除浮动的方法
浮动 问题:子元素设置了float后,脱离父元素,导致父元素无法撑开?(也就是子元素的高度没有过渡到父元素) 例子: 检查元素的效果: (三种)常用的解决办法: 1>额外标签法,添加一个空的di ...
- 前端面试题之nina分享
HTML相关 1.<!DOCTYPE>标签的定义与用法. <!DOCTYPE>的定义: <!DOCTYPE>声明位于文档中的最前面的位置,处于<html> ...
- 转:web前端面试题合集 (Javascript相关)(js异步加载详解)
1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...
- 整理的最全 python常见面试题(基本必考)
整理的最全 python常见面试题(基本必考) python 2018-05-17 作者 大蛇王 1.大数据的文件读取 ① 利用生成器generator ②迭代器进行迭代遍历:for line in ...
- 史上最全前端面试题(含答案)-A篇
HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合.标签小写.不乱嵌套.提高搜索机器人搜索几率.使用外 链css和js脚本.结构行为表现的分离.文件下载与页面速度更快.内容能被更多的用户所 ...
- 金三银四,磨砺锋芒;剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上
金三银四,磨砺锋芒:剑指大厂,扬帆起航(2020年最全大厂WEB前端面试题精选)上 引言 元旦匆匆而过,2020年的春节又接踵而来,大家除了忙的提着裤子加班.年底冲冲冲外,还有着对于明年的迷茫和期待! ...
随机推荐
- Java课堂疑问解答与思考3
一. 两对整数明明完全一样,为何一个输出true,一个输出false? 答: 整数在小于127时都可以用常量池,因此第一次比较的的地址是取自同一个地址的数字,而第二次比较的数是创建了两个不同地址的对象 ...
- big data env setup
install Spark on CentOS: https://aodba.com/how-to-install-apache-spark-in-centos-standalone/ https:/ ...
- Grafana配置文件
配置文件位置 /usr/local/opt/grafana/share/grafana/default.ini /usr/local/etc/grafana/grafana.ini 配置文件调用顺序 ...
- 各类最新Asp .Net Core 项目和示例源码
1.网站地址:http://www.freeboygirl.com2.网站Asp .Net Core 资料http://www.freeboygirl.com/blog/tag/asp%20net%2 ...
- 如何在centos6和centos7上部署nfs共享服务器和客户端
nfs共享服务为中小型企业在存储上提供了有效的节省空间,许多大型的网站也在使用nfs,如百度和阿里等,下面结合自己所学的知识,阐述如何在centos6和centos7下配置nfs.注:除了必要的说明外 ...
- 使用filebeat收集不同用应用的日志传输到redis,并加以区分
附加技巧 步骤流程: 使用filebeat收集一台主机上两个不同应用的日志,传递给redis,然后logstash从redis中拉去数据传递给elasticsearch 1.filebeat.yml文 ...
- htpwdScan — 一个简单的HTTP暴力破解、撞库攻击脚本
李姐姐之前跟我们分享了子域名枚举工具subDomainBrute<subDomainsBrute — 改进渗透测试时暴力枚举子域名的python脚本>,这回带给我们htpwdScan ht ...
- Linux安装Jenkins并部署springboot项目
安装步骤: 1.跳转连接https://pkg.jenkins.io/redhat-stable/下载安装包 2.安装命令: sudo rpm -ih jenkins-2.73.2-1.1.noarc ...
- mybatis报错(三)报错Result Maps collection does not contain value for java.lang.Integer解决方法
转自:https://blog.csdn.net/zengdeqing2012/article/details/50978682 1 [WARN ] 2016-03-25 13:03:23,955 - ...
- Windows及Android倍速播放视频软件下载
目录 1. 更多推荐 2. 关键字 3. 按 4. 软件下载 4.1. IOS应用商店 4.2. 网盘下载 5. 软件介绍 5.1. PotPlayer(Windows) 5.2. MoboPlaye ...