jquery、javascript实现(get、post两种方式)跨域解决方法

一、实现get方式跨域请求数据

浏览器端

<script>
$(document).ready(function(){$.ajax({url: "http://www.xxx.cn/index.php",type: "get",dataType: "jsonp", //指定服务器返回的数据类型
        success: function (data) {console.log(data);}});
});
</script>

服务器端

<?php
    $data= [
        'info'  => '跨域请求成功',
        'status'=> 1
    ];
    $callback= $_GET['callback'];//callback参数是发起请求是jquery的回调参数。
    echo$callback.'('.json_encode($data).')';//所有返回数据时，需要按照此方式。
?>

二、实现post方式跨域请求

浏览器端

<script>
$(document).ready(function(){
    $.ajax({
        url: "http://www.xxx.cn/index.php",
        type: "post",
        dataType: "json", //指定服务器返回的数据类型
        success: function(data) {
            console.log(data);
        }
    });
});
</script>

服务器端

Access-Control-Allow-Origin:* 表示允许任何域名跨域访问

如果需要指定某域名才允许跨域访问，只需把Access-Control-Allow-Origin:*改为Access-Control-Allow-Origin:允许的域名

例如：header('Access-Control-Allow-Origin:http://www.xxx.com');

<?php
    header('Access-Control-Allow-Origin: *');//允许所有来源访问
    header('Access-Control-Allow-Methods: POST');//响应类型
     
    $data= [
        'info'  => 'post方式,跨域请求成功',
        'status'=> 1
    ];
    echojson_encode($data);
?>

某些header请求头

// 指定允许其他域名访问
header('Access-Control-Allow-Origin:*');
// 响应类型
header('Access-Control-Allow-Methods:POST');
// 响应头设置
header('Access-Control-Allow-Headers:x-requested-with,content-type');

//设置内容类型为json

header('content-type:application:json;charset=utf8');

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/444721.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！