您的位置:首页 > Web前端 > JavaScript

Jsonp解决跨域调用问题实战

2015-09-30 00:00 561 查看
摘要: Jsonp解决跨域调用问题实战,js调用解决跨域问题

核心:‍前端通过jsonp跨域调用后端接口,接口返回的json必须支持callback回调函数

代码如下:

1、前端jquery

var searchUrl ="${some_url}/tieba/queryTiebaThread4Admin.action";
$.ajax(searchUrl, {
data: {'tiebaId': tiebaId,'threadId': threadId},
dataType: 'jsonp',
type : "get",
jsonpCallback:"callback",
jsonp: "callback",
cache : false,
crossDomain: true,
success: function(result) {
if(result && result.resultCode == 0){
$("#first_post_id").val(result.data.firstPost);
$("#title").val(result.data.title);
showTips('数据搜索有结果',"success");
}else{
$("#first_post_id").val('');
$("#title").val('');
showTips('未抓取主题帖数据,请检查主题和帖吧ID是否正确',"error");
}
},
error:function(e){
$("#first_post_id").val('');
$("#title").val('');
showTips('未抓取主题帖数据,请稍后重试',"error");
}
});


2、后端controller

public Render queryTiebaThread4Admin(@Read(key = "tiebaId") Long tiebaId, @Read(key = "threadId") Long threadId, @Read(key = "callback") String callback) {
TiebaResult<Map<String,Object>> result = new TiebaResult<Map<String,Object>>();
Map<String,Object> dataMap = new HashMap<String, Object>();
try {
AnchorTieba  tiebaInfo = tiebaQueryManager.getTieba(tiebaId);
AnchorTiebaThread tiebaThread = threadQueryManager.queryThread(tiebaId, threadId);

if(tiebaInfo != null && tiebaThread != null){
dataMap.put("tiebaId",tiebaId);
dataMap.put("threadId",threadId);
dataMap.put("tiebaName",tiebaInfo.getName());
dataMap.put("firstPost",tiebaThread.getFirstPost());
dataMap.put("title",tiebaThread.getTitle());
result.setData(dataMap);
}else{
result.setResultCode(ErrorCode.NOT_FOUND);
}
} catch (Exception e) {
result.setResultCode(ErrorCode.NOT_FOUND);
logger.info("queryTiebaThread4Admin:", e);
}

StringBuilder resultBuilder = new StringBuilder(JSONObject.fromObject(result).toString());
if(StringUtils.isNotBlank(callback)){
resultBuilder.insert(0, '(').insert(0,callback).append(')');
}
return new Render(RenderType.TEXT, resultBuilder.toString());
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: