原生jsonp实现跨域及封装

JSONP封装

function jsonp(url,success,data){
	// 1.处理默认参数
	data = data || {};
	// 2.解析数据
	var str = "";
	for(var i in data){
		str += `${i}=${data[i]}&`;
	}

	// 3.创建script标签，设置src，准备开启jsonp
	var script = document.createElement("script");
	script.src = url + "?" + str;
	document.body.appendChild(script);

	// 4.定义全局函数
	window[data[data.columnName]] = function(res){
		success(res);
	}

使用

document.onclick = function(){
	var url = "http://127.0.0.1/jsonp/data/jsonp3.php"
	jsonp(url,function(res){
		alert(res)
	},{
		pass:"root",
		// 5.用来保存，后台接收的回调函数名所在的字段名
		// 为了给自己封装的函数传参，放置多次修改封装好的函数
		columnName:"cb",
		// 6.根据后台要接受的字段名,发送回调函数名,回调函数名，已经无所谓了，随机都行
		cb:"jsp"
	})
}

后端php

<?php

    $u = @$_REQUEST["pass"];
    $c = @$_REQUEST["cb"];

    $data = "hello ".$u;

    echo $c."('".$data."')";
    

?>