跨域请求的五种方式的实现与原理

最近刚刚研究了一下跨域的问题做一个总结

我准备分为三步来说:

一、跨域的产生
二、如何实现跨域
三、跨域不同方法小节

一、跨域的产生

为了对JavaScript 施加安全限制使浏览器不能执行其它网站的脚本,因此浏览器提出了同源策略来进行限制.
根据百度百科 同源策略它是由 Netscape 提出的一个安全策略，它是浏览器最核心也是最基本的安全功能，如果缺少同源策略，则浏览器的正常功能可能都会受到影响，现在所有支持JavaScript的浏览器都会使用这个策略.
同源是指 : 协议、域名、端口号都相同，只要有一个不相同，那么都是非同源。
浏览器在执行脚本的时候，都会检查这个脚本属于哪个页面，即检查是否同源，只有同源的脚本才会被执行；而非同源的脚本在请求数据的时候，浏览器会报一个异常，提示拒绝访问。

同源策略限制的情况：

1. Cookie、LocalStorage 和 IndexDB 无法读取
2. DOM 和 Js对象无法获得
3. AJAX 请求不能发送　　
   注意：对于像 img、iframe、script 等标签的 src 属性是特例，它们是可以访问非同源网站的资源的.

二、如何实现跨域

1.利用javaScript中的src属性进行跨域!!!.

1.1 前端页面请求

<script type="text/javascript" src="填写跨域访问路径"></script>
<script type="text/javascript">
		/*定义回调函数  函数名和后端返回值一致 */
		function hello(data){
   
			alert(data.name);
		}
	</script>

1.2 后端返回数据格式

hello({
   "id":"1","name":"tom"})

2.JSONP !!可用于解决主流浏览器的跨域数据访问的问题

不使用工具

2.1 前端需要写

<script type="text/javascript">
	$(function()