首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >QQ空间的JSONP示例

QQ空间的JSONP示例

作者头像
meteoric
发布2019-02-25 16:41:36
1.7K0
发布2019-02-25 16:41:36
举报
文章被收录于专栏:游戏杂谈游戏杂谈

根据Velocity的演讲“性能优化无未日--Qzone首页性能优化2012篇”写的一个例子

书写的示例,没有做请求成功、失败的处理方法,在实际应用中是需要进行清理操作和超时处理的。

function JSONGetter(url, callbackFn, charset) {

    if (window.ActiveXObject) {
        //IE
        var docFrag = document.createDocumentFragment(),
            tempScript = docFrag.createElement('script');


        docFrag['_Callback'] = function() {
            callbackFn.apply(null, arguments);
        }

        docFrag.appendChild(tempScript);
        tempScript.charset = charset || 'utf-8';
        tempScript.src = url;
    } else {
        //非IE
        var reqSendIfrm = document.createElement('iframe'),
            chst = charset || 'utf-8',
            srcDocText = [
                'javascript:',
                '\'<html><head><meta http-equiv="Content-type" content="text/html; charset='+chst+'"/></head><body>',
                '<script type="text/javascript">',
                'function _Callback() {frameElement._Callback.apply(null, arguments);}',
                '<\/script>',
                '<script type="text/javascript" src="'+url+'" charset="'+chst+'">',
                '<\/script>',
                '</body></html>\''
            ].join('');

        reqSendIfrm['_Callback'] = callbackFn;
        reqSendIfrm.src = srcDocText;
        reqSendIfrm.style.display = 'none';
        document.body.appendChild(reqSendIfrm);
    }

}

在线查看/运行示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JSONP</title> <meta name="generator" content="editplus" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> </head> <body> <button onclick='requestData();'>请求数据</button> <div style='width:600px; height:400px; border:1px solid #406c99; overflow:auto; padding:2px; margin-top:10px;'> <div style='word-wrap: break-word;' id='resultTxt'></div> </div> </body> </html> 预览代码

有兴趣了解Qzone的实现细节,可以自己动手抓包看看..qzfl 中的“QZFL.JSONGetter”方法

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2012-12-28 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档