JSONP跨域,CORS跨域,Hybrid APP跨域

JSONP

jsonp: function(url, callbackFunc, data) //跨域請求
        {

            var data = arguments[2] ? arguments[2] : {}; //默認參數爲空


            if(url != '' && callbackFunc != '') {
                $.ajax({
                    type: 'get',
                    dataType: 'jsonp',
                    url: url,
                    jsonp: "callback",
                    jsonpCallback: callbackFunc,
                    data: data,
                    async: true,
                    success: function(data) {
                        console.log('跨域請求成功');


                    },
                    error: function() {

                        console.log('跨域請求失敗');


                    }
                });

            } else
                alert('URL,回調函數不能爲空');

        }
function callbackFunc(res)
{

//do something
}
//配合後臺返回字符串函數

echo 'callbackFunc({age:18})';//callbackFunc爲自己定義的名稱, 返回這個之後會在前端調用對應的函數,所以要在前端寫響應的函數




CORS跨域

//最簡單的寫法就是在響應頭部增加信息:Access-Control-Allow-Origin: * 
//*默認所有域都可以請求,指定的話:Access-Control-Allow-Origin: http://www.xxxx.com

前端請求按照正常的AJAX請求即可

目前自己隨手測過的可以使用的瀏覽器有:360,IE8+,chrome

Hybrid APP跨域

request: function(url, data, callback, type) {
            xhr = new plus.net.XMLHttpRequest();
            type = arguments[3] ? arguments[3] : 'GET';
            data = arguments[1] ? arguments[1] : '';
            xhr.onreadystatechange = function() {
                switch(xhr.readyState) {
                    case 4:
                        if(xhr.status == 200) {
                            callback(JSON.parse(xhr.responseText));

                        } else {
                            alert("xhr請求失敗:" + xhr.readyState);
                        }
                        break;

                }
            }
            switch(type.toUpperCase()) {
                case 'GET':
                    xhr.open(type, url + '?' + data);
                    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                    xhr.send();
                    break;

                case 'POST':
                    xhr.open(type, url);
                    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                    xhr.send(data);
                    break;
            }

        }
發佈了108 篇原創文章 · 獲贊 44 · 訪問量 52萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章