ajax jsonp-script跨域问题

旧城等待， 2021-07-24 11:12 410阅读 0赞

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NDU2MA_size_16_color_FFFFFF_t_70]![在这里插入图片描述][20191224175722447.png]  
**解决跨域同源政策**

使用script标签引入文件方式
    		script脚本作用,将脚本引入当前位置并立即执行
    
    		创建script标签
    		script标签路径为服务器地址所在的文件，并在文件末尾添加?关键字=回调函数名
    		补充回调函数内容
    		后台在被引入服务器文件内写采用$_GET['关键字']的方式获取回调函数
    		然后将echo 拼接回调函数，echo 回调函数."(".传输数据.")";
    		script特性立即执行后台传过来的字符串，即执行回调函数，立即调用

前台:

<!DOCTYPE html>
    <html>
    <head >
    	<meta charset='utf-8'/>
    	<title></title>
    </head>
    <body>
    <button>发送请求</button>
    <script src="myajax.js"></script>
    <input type="text">
    <script>
    document.querySelector('button').onclick=function()
    { 
    
    	var script=document.createElement('script');
    	script.src='http://127.0.0.1/code/6.php?callback=func';
    	document.body.appendChild(script);
    };
    	function func(res)
    	{ 
    		console.log(res);
    	}
    
    </script>
    </body>
    </html>

后台:

<?php
    	//准备get请求的返回数据
    	$data=array('mes'=>' cross ok');
    	//获取前端发送过来的回调success方法
    	$callback=$_GET['callback'];
    	//将返回数据构建为函数调用func(res);
    	echo $callback."(".json_encode($data).")"
    ?>

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NDU2MA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20191224174848200.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MzI5NDU2MA==,size_16,color_FFFFFF,t_70
[20191224175722447.png]: /images/20210724/f505760b447c40f0a353cad1bb1597f9.png