laravel中使用jsonp

最新推荐文章于 2024-08-31 07:26:44 发布

绕岸垂杨

最新推荐文章于 2024-08-31 07:26:44 发布

阅读量747

点赞数 2

分类专栏： javascript

本文链接：https://blog.youkuaiyun.com/weixin_41105515/article/details/104242266

版权

javascript 专栏收录该内容

1 篇文章

订阅专栏

本文探讨了因同源策略限制导致的跨域数据访问难题，介绍了JSONP作为一种解决方案的原理与实现方式。通过示例代码，展示了如何利用jQuery的$.ajax方法进行跨域请求，并在服务器端设置回调函数返回数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

解决的问题

由于javascript出于安全限制–同源策略（Same-Origin Policy），禁止访问当前项目之外的数据，jsonp正是解决这一问题。

jsonp使用ajax实现，但是区别与ajax，dataType为jsonp，同时增加了callback。

具体实现

html

//当前项目为test1.com，请求的数据在项目test2.com中
 $.ajax({
            url:'http://test2.com/api/user',
            async:false,
            type:'get',
            data:{name:'hzj'},
            dataType: 'jsonp',
            jsonp: 'callback',
            success:function (res) {
                console.log(res);
            }
        })

跨域请求目标数据

//项目2
public function index(Request $request)
    {
    	$callback = $request->input('callback');
    	$data = [
    				[
    			'code'=>0,
    			'data'=>[1,2,3,4,5]]
    		];
    		
    	//方法1:
    	return response()->jsonp($callback, $data);
    	
    	//方法2:
    	return response()->json($data)->setCallback($callback);
    }