ajax异服务器读取json数据

ajax读取同ip同域名的json格式的数据时候不会有任何问题,但是当读取异ip和异域名的json数据的时候,就会报错,所以必须要用jsonp方式请求:

首先代码方面:


先设定远程的地址,然后调用自己做的ajax方法:

$(function(){
    	//Json link
       	var url = "<%=Config.getInstance().getPropertyAsString(Config.Key.REST_API_URL)%>/jsonp/v3/course/courseware/${ware.id}/frames?uid=5&from=0&t=89D8FA86DDE18B59&client=1";
       	getJsonData(url);
    });

//通过课程id得到该课程(对象)
function getJsonData(url) {
 	$.ajax({
        type: "get",
        url: url,
        async: false,
        contentType: "application/json; charset=utf-8",
        dataType: "jsonp",
        jsonp: "callback",
        success: function(data) {
            //alert(data);
            //alert(data.data);
            var resource = data.data;
            if (data != null) {
                rowcount = resource.length;
                if (rowcount > 0) {
                    courselist(resource,rowcount);
                }
            }
        },
        error: function(err) {
            alert(err);
        }
    });
}
//列出该课程(对象)的课程列表,re-对象,ro-对象的长度
function courselist(re,ro){
    //alert("come in 2"+ re + '..'+ ro);
    var html = '';
    for (var i = 0; i < ro; i++) {
        //alert(re[i].serialNumber+'....'+re[i].thumbimgUrl+'......'+re[i].resourceType);
        if(re[i].serialNumber == -1) {
            rowcount -= 1;
            continue;
        }else {
            html += '<div id="c' + re[i].serialNumber + '" class="cha normal"> '+
                        '<div class="mask" id="mask' + re[i].serialNumber + '">播放中...</div> '+
                        ' <div class="pic"> '+
                            '<img src="' + re[i].thumbimgUrl + '" width="157" height="101" /> '+
                            '<div class="category';if(re[i].resourceType=="MP4"){ html += ' video' }else if(re[i].resourceType=="JPG"){ html += ' picture' }else if(re[i].resourceType=="MP3"){ html += ' music' }; html += '" id="play' + re[i].serialNumber + '" onclick="startPlay(' + re[i].serialNumber + ',\'' + re[i].resourceType + '\',\'' + re[i].resourceUrl + '\');"></div> '+
                        '</div> '+ 
                    '</div>';

            if(re[i].serialNumber == 1) {
                startPlay(re[i].serialNumber,re[i].resourceType,re[i].resourceUrl);
            }
            //html += '<li><div class="dd">·</div><div class="dt">' + re[i].serialNumber + '......' + re[i].resourceType + '</a></div></li>';                   
        }
    }
    if(0< rowcount && rowcount <= 6){    
        $(".chasf .prev").hide();
        $(".chasf .next").hide();
        $(".chasf .chas .switchshow").css("width",-rowcount*perwidth);
    }else {
        $(".chasf .prev").hide();
    }
    $('.switchshow').html(html);
    $('.switchshow div:first .mask').show();
    $('.switchshow div:first .picture').css("display","none");
}

最后记得在存有json数据的服务器中改请求方式是:

jsonp: "callback",

------!如果不出效果,依照错误提示慢慢调,我也是调了半天才调通的,不是一下子就会有数据的!

你可能感兴趣的:(jsonp,Ajax)