【前端面试】JS如何实现跨域

程序猿 2021-03-31 19:56:02 1700浏览 加载中

对于端口和协议的不同,只能通过后台来解决。我们要解决的是域名不同的问题。

1,下面是用php进行的设置,“*” 号表示允许任何域向我们的服务端提交请求,header({Access-Control-Allow-Origin: *)

2,JSONP(ISON with Padding填充式JSON或参数式JSON)

在js中,我们虽然不能直接用XML HttpRequest请求不同域上的数据,但是在页面上引入不同域上的js脚本文件却是可以的,jsonp正是利用这个特性来实现的。JSONP由两部分组成:回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数,而数据就是传入回调函数中的JSON数据。

<script type="text/javascript" >
    function dosomething(jsondata){
        //处理获得的json数据
    }
</script>
<script src ="http://example . com/ data. php?callback=dosomething" ></script>

首先第一个script标签定义了一个处理数据的函数:

然后第二个script标签载入-个js 文件,http: //example.com/data.php 是数据所在地址,但是因为是当做js来引入的,所以http: //example.com/data php返回的必须是一个能执行的js文件;

最后js文件载入成功后会执行我们在url参数中指定的函数,并且会把我们需要的json数据作为参数传入。所以php应该是这样的:

<?php
    $callback = $_ GET['callback”];//得到回调函数名
    $data = array('a', 'b','c" );//要返回的数据
    echo $callback. "('.json encode($data).")";//输出
?>


最后修改:2024-12-22 22:19:27

非特殊说明,本博所有文章均为博主原创。