ajax受同源策略限制,web前端 -- Ajax同源策略以及解决跨域问题

根据千峰教育学习视频所练习的笔记 | 学习一段时间,我也有写一点东西的必要了···

1. Ajax的同源策略

源是指协议、域名和端口号。

同源策略:是浏览器的一种安全机制。

也就是说,当脚本运行时,浏览器会检测它所执行的脚本以及它取得的数据与我们的HTML页面所在的源是否相同。就是说我们请求数据的协议、端口号以及域名与我们HTML的协议、域名、端口号是否一致。一致就认为ok,是同源的,它就会进行成功的请求。若它们的源不一致,这个时候就是跨域的请求。 默认情况下,浏览器是不支持跨域请求的

2. 解决跨域问题

2.1. JSONP

我们知道,Ajax的执行会受到同源策略限制,因为脚本运行时发送数据,它(浏览器)会检测请求数据的域名、协议和端口号。那么,script标签时不受同源策略限制(在请求script脚本的时候,无论脚本是HTML所在服务器还是在其他服务器,它都能请求),我们就能用script的这一性质来进行数据请求。

2.1.1. 利用script进行数据请求

举个栗子:

1)现在我的脚本中定义一个getData的函数,并且定义了形参data,将数据简单输出。

function getData(data){

consle.log(data);

}

2)如果现在我请求了一个脚本,脚本能调用我的getData,并且把数据作为实参传递进来。那我的形参接收到数据就可以进行相应的处理了。接下来模拟一下这个过程。

假定我有一个jsonp.js,现在前端把函数名告诉了后端,后端在jsonp.js文件里就能调用data,并且在这儿传递一个数据。

getData({

name:'feifei',

age:'9'

})

![](https://img2018.cnblogs.com/blog/1817586/201910/1817586-20191007221636926-1729434199.png)
3)回到刚刚的script里,我们能请求jsonp.js文件。 ```html function getData(data){ console.log(data); } var script = document.createElement('script');//动态创建script标签 script.id = "jsonp"; script.src = "./jsonp.js";//将script标签的src指向当前路径下的jsonp document.body.appendChild(script); ``` 这种方式我们就得到想要的数据了,并且它不受同源策略的限制。

2.2. CORS

CORS全称是跨域资源共享,是一般浏览器都支持的功能。整个CORS通信过程都有浏览器自动完成,不需要用户参与。对于前端开发者来说,发送CORS的Ajax和发送普通的Ajax没有什么区别。实现CORS通信的关键在服务器端,只要服务器实现了CORS接口就可以跨域通信。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/526596.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

6s有时有信号 有时无服务器,揭秘:iPhone 6S 的没信号没网络维修故障分析

原标题:揭秘:iPhone 6S 的没信号没网络维修故障分析文/维修狮 (FIXHOME)手机不入网(没信号)是一个常见的多发故障(占手机故障的40%以上),对于手机出现不入网(没信号)故障我们首先要区分是接收部份还是发射部份的原因造成的,搞清楚后才可“对症下药”。一…

征途2无法显示服务器列表,解决win10系统玩征途2提示“DriverCommlnit驱动加载失败”的方法...

征途2是一款众所周知的角色扮演类游戏,它在玩法上延续了征途1的总体风格,但是在画面和音效上比征途1的要提高了很多,其独特的玩法吸引了众多的玩家。但是又部分用户反映,在win10系统上运行征途2的游戏时,出现了“Drive…

kafka服务器死机消息,当kafka集群其中一台宕机后,会怎么样?

一、介绍我们搭建好kafka集群后,对其进行性能测试。遇到这种场景:我搭建好了三台kakfa集群,然后停掉其中一台kafka,然后集群是否能正常工作呢?kafka集群:192.168.183.53 节点1192.168.183.55 节点2192.168.…

搭建go项目web服务器,3.2 Go搭建一个Web服务器

前面小节已经介绍了Web是基于http协议的一个服务,Go语言里面提供了一个完善的net/http包,通过http包可以很方便的就搭建起来一个可以运行的Web服务。同时使用这个包能很简单地对Web的路由,静态文件,模版,cookie等数据进…

安卓总线传输协议常用关键词

Android - Keywords of Bus transfer protocolIntroductionKeywords tablebuilding......Introduction 这篇文档用于总结嵌入式系统中总线传输协议的一些关键字供大家查找,工作日晚上和周末会更新,欢迎大家询问、修正——来自华为的底层工程狗的奋斗宣言…

【C语言进阶】 宏定义实现字符串引用

宏定义实现字符串引用原理最简单的引用策略使用#进行转义原理 用宏定义实现字符串引用: 这种做法在编译的时候直接给宏名所对应的字符串 分配了一个内存地址空间,可以进行字符串输出、地址打印、指针操作和索引操作。 最简单的引用策略 最简单的引用策…

git操作大全

git操作大全系统的整理一下git操作二级目录三级目录系统的整理一下git操作 命令功能git branch -a查看当前所有的分支(远端和本地)git branch -vv查看当前分支的细节git branch -D mybranch删除名字为mybranch的分支git checkout mybranch切换mybranch分…

【MATLAB】 csvwrite数据缺失怎么办

MATLAB csvwrite数据缺失怎么办 csv文件介绍 csv文件是一种以纯文本形式存储表格数据并使用逗号分割符分割结构的文件格式,其中,逗号表示数据之间的列分割,换行符表示数据之间的行分割。 csv文件通常用于二维数据的存储,十分适…

【Leetcode1365】有多少小于当前数字的数字:详解

[Leetcode1365] 有多少小于当前数字的数字 1. 题目 给你一个数组 nums,对于其中每个元素 nums[i],请你统计数组中比它小的所有数字的数目。 换而言之,对于每个 nums[i] 你必须计算出有效的 j 的数量,其中 j 满足 j ! i 且 nums…

【interview17.10】 主要元素:详解

interview17.10 主要元素 1.题目 数组中占比超过一半的元素称之为主要元素。给定一个整数数组,找到它的主要元素。若没有,返回-1。 2.算法 3.排序算法 计数器 解题思路:从题干分析,我们需要找到数组中数量占比多于一半&…

【C语言基础】C语言构建定长字典

C语言构建定长字典 1.C语言简介-struct C语言中没有字典。而有些场合下需要统计一些字符串变量的累计值,就需要用定长字典。定长字典顾名思义就是长度固定的字典。在C语言中结构体可以定义任意类型数据的集合,也就可以通过结构体数组来构造个定长字典。…

【Leetcode819】最常见的单词

Leetcode819 最常见的单词 1.题目 给定一个段落 (paragraph) 和一个禁用单词列表 (banned)。返回出现次数最多,同时不在禁用列表中的单词。 题目保证至少有一个词不在禁用列表中,而且答案唯一。 禁用列表中的单词用小写字母表示,不含标点…

[LCP28] 采购方案

LCP 28 采购方案 1.题目 小力将 N 个零件的报价存于数组 nums。小力预算为 target,假定小力仅购买两个零件,要求购买零件的花费不超过预算,请问他有多少种采购方案。 注意:答案需要以 1e9 7 (1000000007) 为底取模&#xff0c…

搜索引擎排序DEMO

搜索引擎排序DEMO #include<stdio.h>int lookarr(int* arr, int arrSize) {for (int i 0; i < arrSize; i) {printf("%d, ", arr[i]);}printf("\n"); }int lookarr2(int** arr, int arrSize) {printf("\n");for (int i 0; i < 6;…

[Leetcode16]最接近的三数之和

[Leetcode16]最接近的三数之和 转载自leetcode https://leetcode-cn.com/problems/3sum-closest/ 1.题目 给定一个包括 n 个整数的数组 nums 和 一个目标值 target。找出 nums 中的三个整数&#xff0c;使得它们的和与 target 最接近。返回这三个数的和。假定每组输入只存在…

高压特种作业考试易错总结

高压上岗证考试&#xff0c;2021年6月考过啦&#xff0c;发出来与大家共勉。 安全&#xff1a; 安全责任 —— 横向到边、纵向到底电工作业人员根据实际情况遵守法规&#xff08;错&#xff0c;&#xff09;应该严格遵守。脱离电源 —— 单手操作&#xff0c;绝缘工具防止电气…

DEEPIN教程 - 本地安装Typora

本地安装Typora 一. 下载Typora安装包 访问https://www.typora.io/#linux路径进行下载。 二. 解压下载的tar.gz文件 tar -xvf Typora-linux-x64.tar.gz三. 将解压后的可执行文件添加到dash路径 1. 首先在解压路径下需要关注如下路径文件。 可执行文件Typora 和 2. 文件夹i…

函数指针史上最全的介绍

函数指针 一. 函数指针的概念 如果在程序中定义了一个函数&#xff0c;那么在编译时系统就会为这个函数代码分配一段存储空间&#xff0c;这段存储空间的首地址称为这个函数的地址。而且函数名表示的就是这个地址。既然是地址我们就可以定义一个指针变量来存放&#xff0c;这…

C语言调试技巧:stdin,stdout,stderr

stdin,stdout,stderr流 介绍 stdin&#xff0c;stdout&#xff0c;stderr是标准的输入输出流。其中&#xff0c;stdin是访问键盘输入&#xff0c;stdout和stderr分别是向终端输出数据。 关键函数 fscanf/fprintf /* 所在头文件 */ #include <stdio.h>int fscanf(FILE…

C语言调试技巧:main函数输入参数

带入参的main函数 介绍 带入参的main函数主要用于一些基本调试&#xff0c;main函数的入参在main函数里被解析为字符串&#xff0c;因此根据具体的调试业务可以需要将字符串转为相应的int类型或double类型进行其他的操作。 函数实现 // test_mainin.c #include <stdio.h…