JS通过JSONP跨域请求API接口

最新推荐文章于 2023-11-30 10:31:01 发布

竹音林

最新推荐文章于 2023-11-30 10:31:01 发布

阅读量1.4w

点赞数 3

分类专栏： php ajax jQuery JS 文章标签： api jquery ajax php JSONP

本文链接：https://blog.csdn.net/u010884130/article/details/51202448

版权

php 同时被 3 个专栏收录

4 篇文章 0 订阅

订阅专栏

jQuery

3 篇文章 0 订阅

订阅专栏

3 篇文章 0 订阅

订阅专栏

一般JS跨域请求，会经常用到dataType:"JSONP"的格式请求，这里做了一个接口服务器和请求服务器的例子：

接口服务器地址：http://www.api.com/login.php

接口服务器要这样写：

<?php
$response['status']=200;
$response['msg']="success";
echo "login(".json_encode($response).")";//login({"status":200,"msg":"success"})
?>

JS脚本服务器的地址：http://www.abc.cn/index.html

JS脚本服务器代码要这样写：

<html>
<head>
    <script src="//cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<script>
    $.ajax({
        dataType:"JSONP",
        jsonp:"callback",//请求自动带上callback参数，callback值为jsonpCallback的值
        jsonpCallback:"login",//接口服务器应该返回字符串数据格式：login(JSON数据)
        type:"post",
        url:"http://www.api.com/login.php",//接口服务器地址
        data:{},//请求数据
        success:function(response){
            //成功执行
            console.log(response);
        },
        error:function(e){
            //失败执行
            alert(e.status+','+ e.statusText);
        }
    })
</script>
</body>
</html>

请求成功后，success接收到的response内容直接是JSON格式，可以直接调用：

Object {status: 200, msg: "success"}

竹音林

关注

3
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
JS通过JSONP跨域请求API接口

一般JS跨域请求，会经常用到dataType:"JSONP"的格式请求，这里做了一个接口服务器和请求服务器的例子：接口服务器地址：http://www.api.com/login.php接口服务器要这样写：<?php$response['status']=200;$response['msg']="success";echo "login(".json_encode(
复制链接

扫一扫