Ajax-08 跨域获取最新电视节目清单实例

Posted 2020-09-09 鲨鱼逛大街

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Ajax-08 跨域获取最新电视节目清单实例相关的知识，希望对你有一定的参考价值。

目标一

请求江西网络广播电视台电视节目

URL：http://www.jxntv.cn/data/jmd-jxtv2.html

分析

1.从Http头信息分析得知，器服务端未返回响应头Access-Control-Allow-xxxx 相关信息，所以只能使用JSONP方式

2.从返回值内容中分析得知，其返回值永远是:list（响应内容），即:由于服务器将函数名写死为list，所以指定callback在此程序中无效。

list({
    data: [
        {
            "week": "周日",
            "list": [
                {
                    "time": "0030",
                    "name": "通宵剧场六集连播",
                    "link": "http://www.jxntv.cn/live/jxtv2.shtml"
                },
                {
                    "time": "2250",
                    "name": "都市晚剧场",
                    "link": "http://www.jxntv.cn/live/jxtv2.shtml"
                }
            ]
        }
        
    ]
});

实现

get_tv_list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>跨域请求最新电视节目清单</title>
</head>
<body>

<h1>跨域请求</h1>
<input type="submit" value="XmlSendRequest获取节目" onclick="XmlSendRequest();"/>

<input type="submit" value="JqSendRequest-获取节目" onclick="JqSendRequest();"/>


<script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script>
    function XmlSendRequest() {
        // 创建script标签
        var tag = document.createElement(\'script\');
        // 指定src
        tag.src = "http://www.jxntv.cn/data/jmd-jxtv2.html";
        // 添加到head标签中
        document.head.appendChild(tag);
        // 删除script标签
        document.head.removeChild(tag);
    }

    function JqSendRequest() {
        $.ajax({
            url: "http://www.jxntv.cn/data/jmd-jxtv2.html",
            type: \'GET\',
            dataType: \'jsonp\'
        })
    }

    function list(arg) {
        console.log(arg);
    }

</script>
</body>
</html>

目标二

请求爱奇艺海贼王节目清单

URL：http://cache.video.iqiyi.com/jp/avlist/202861101/1/?callback=call

分析

1.从Http头信息分析得知，器服务端未返回响应头Access-Control-Allow-xxxx 相关信息，所以只能使用JSONP方式

2.从返回值内容中分析得知，当传入callback时，返回callback回调函数名,所以指定callback在此程序中有效。

try{
    call({
        "bmsg": {
            "t": "20170412084110",
            "f": "kafka",
            "sp": "402871101,"
        },
        "code": "A00000",
        "data": {
            "pp": 75,
            "ps": "",
            "pt": 783,
            "vlist": [
                {
                    "mdown": 0,
                    "publishTime": 1438650931000,
                    "vpic": "http://pic9.qiyipic.com/image/20150803/96/f9/v_109343020_m_601.jpg",
                    "tvQipuId": 385274600,
                    "purType": 0,
                    "qiyiProduced": 0,
                    "shortTitle": "航海王 第1集",
                    "type": "1",
                    "vurl": "http://www.iqiyi.com/v_19rrok4nt0.html",
                    "plcdown": {
                        "17": 0,
                        "15": 0
                    },
                    "vid": "e59fa071d268247291f7737c72ea37f8",
                    "timeLength": 1500,
                    "pd": 1,
                    "vn": "航海王 第1集",
                    "payMark": 0,
                    "exclusive": 1,
                    "id": 385274600,
                    "vt": "我是路飞！ 将要成为海贼王的男人",
                    "pds": "1"
                },
                {
                    "mdown": 0,
                    "publishTime": 1438678286000,
                    "vpic": "http://pic8.qiyipic.com/image/20150804/5f/27/v_109343021_m_601_m2.jpg",
                    "tvQipuId": 385275700,
                    "purType": 0,
                    "qiyiProduced": 0,
                    "shortTitle": "航海王 第2集",
                    "type": "1",
                    "vurl": "http://www.iqiyi.com/v_19rrok4ms8.html",
                    "plcdown": {
                        "17": 0,
                        "15": 0
                    },
                    "vid": "c183093e2c60e7a34eb6758c3f997a1e",
                    "timeLength": 1500,
                    "pd": 2,
                    "vn": "航海王 第2集",
                    "payMark": 0,
                    "exclusive": 1,
                    "id": 385275700,
                    "vt": "大剑客现身！海贼猎人罗罗诺亚·卓洛",
                    "pds": "2"
                }
            ],
            "bossType": "0",
            "aQipuId": 202861101,
            "qiyiProduced": 0,
            "allNum": 783,
            "pg": "1",
            "isBossMixer": 0,
            "ic": 783,
            "pgt": 11,
            "aid": 202861101,
            "pm": 0,
            "pn": 75,
            "cid": 4
        },
        "timestamp": "20170412084110"
    });
}catch(e){
    
};

实现

get_tv_list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>跨域请求最新电视节目清单</title>
</head>
<body>

<h1>跨域请求最新电视节目清单</h1>
<input type="submit" value="XmlSendRequest-jsonp" onclick="XmlSendRequest();"/>

<input type="submit" value="JqSendRequest-jsonp" onclick="JqSendRequest();"/>

<script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script>
    // 客户端定义回调函数
    function call(arg) {
        console.log(\'客户端定义回调函数执行：\', arg);
    }

    function XmlSendRequest() {
        // 创建script标签
        var tag = document.createElement(\'script\');
        // 指定src
        tag.src = "http://cache.video.iqiyi.com/jp/avlist/202861101/1/?callback=call";
        // 添加到head标签中
        document.head.appendChild(tag);
        // 删除script标签
        document.head.removeChild(tag);
    }

    function JqSendRequest() {
        $.ajax({
            url: "http://cache.video.iqiyi.com/jp/avlist/202861101/1/",
            type: \'GET\', // POST 也会自动转换为GET请求
            dataType: \'jsonp\',
            jsonp: "callback",
            jsonpCallback: \'call\', // 请求成功返回后，客户端执行call函数
            success: function (data, statusText, xmlHttpRequest) {
                // 未指定jsonCallback时，则自定执行方法
                console.log(\'success 回调执行:\', data);
            }
            // 如上请求如 http://cache.video.iqiyi.com/jp/avlist/202861101/1/?callback=call
        })

    }
</script>
</body>
</html>

***微信扫一扫，关注“python测试开发圈”，了解更多测试教程！***

以上是关于Ajax-08 跨域获取最新电视节目清单实例的主要内容，如果未能解决你的问题，请参考以下文章

判断应用是否具有某个权限（例如获取手机联系人的权限）

jsonp跨域请求数据实例之手机号码查询

IOC 控制反转Android 事件依赖注入 ( 事件依赖注入具体的操作细节 | 创建事件监听器对应的动态代理 | 动态代理的数据准备 | 创建调用处理程序 | 创建动态代理实例对象 )(代码片

把小卫星锅里的极化片拿掉可以多收台吗