文档章节

Jsonp解决跨域调用问题实战

caiz
 caiz
发布于 2015/09/30 16:14
字数 270
阅读 456
收藏 8

核心:前端通过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());
    }




© 著作权归作者所有

caiz
粉丝 0
博文 25
码字总数 11583
作品 0
广州
私信 提问
从设计者角度深入理解「跨域问题CORS」

$ 前言   遇到过一些人,说到处理跨域问题时都能说出一大堆东西,但往往都只停留在应用层面,回答和思考的也很片面。其实CORS的设计是为了保护被访问端数据安全的一种策略 $ 是谁在引起跨域...

果汁凉茶丶
2018/11/10
0
0
深入跨域问题 - 利用 JSONP 解决跨域

深入跨域问题 - 初识 CORS 跨域资源共享; 深入跨域问题 - 利用 CORS 解决跨域 深入跨域问题 - 利用 JSONP 解决跨域 (本篇) 什么是跨域,在这篇文章内部就不再讲述了,本文主要着重于实现 ...

leiting1998
2018/05/17
0
0
看小白如何解决ajax跨域问题

由于此前很少写前端的代码(哈哈,不合格的程序员啊),最近项目中用到json作为系统间交互的手段,自然就伴随着众多ajax请求,随之而来的就是要解决ajax的跨域问题。本篇将讲述一个小白从遇到跨...

六只
2012/06/29
15.4K
3
JSONP跨域GET请求解决Ajax跨域访问问题

需求:需要前端web页面异步调用后台的Webservice方法返回信息。 实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问题了,后台服务调用没有响...

文文1
2015/12/04
914
2
分享跨域访问的解决方案与基础分析

什么是跨域访问? 由于浏览器同源策略,凡是发送请求url的协议、域名、端口三者之间任意一个与当前页面地址不同即为跨域。存在跨域的情况: 网络协议不同,如http协议访问https协议。 端口不...

逍遥侠
2018/11/01
0
0

没有更多内容

加载失败,请刷新页面

加载更多

学习记录 java面试题(一)

1. JDK和JRE的区别 JDK是整个JAVA的核心,包括了Java运行环境JRE,一堆Java工具和Java基础的类库。通过JDK开发人员将源码 文件(java文件)编译成字节码文件(class文件)。 JRE是Java运行环境,...

Pole丶逐
32分钟前
8
0
springboot 部署到外部tomcat

入口类继承SpringBootServletInitializer 并重写protected SpringApplicationBuilder configure(SpringApplicationBuilder builder)方法 如下 import org.springframework.boot.SpringApplic......

雷开你的门
38分钟前
5
0
hashCode和equals方法的关系

equals相等,hashcode必相等; hashCode()在哈希表中起作用,如HashSet、HashMap等。 当我们向哈希表(如HashSet、HashMap等)中添加对象object时,首先调用hashCode()方法计算object的哈希码,...

无名氏的程序员
42分钟前
7
0
技术分享 | MySQL 慢查询记录原理和内容解析

作者:高鹏 文章末尾有他著作的《深入理解 MySQL 主从原理 32 讲》,深入透彻理解 MySQL 主从,GTID 相关技术知识。 源码版本:percona 5.7.14 本文为学习记录,可能有误请谅解,也提供了一些...

爱可生
50分钟前
5
0
elementui 树型节点

节点选择时,勾选节点。 提交给后端时,传递 this.$refs.menuTree.getCheckedKeys(); 半选父节点 getHalfCheckedKeys() 不需要提交。...

东东笔记
51分钟前
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部