`

App Framework发送JSONP请求(3)

jsonpajax请求跨域请求发送jsonp越狱请求 
阅读更多

App Framework 中如何发送JSONP请求呢?

使用jsonp,详情请参考:http://json-p.org/

如何发送Ajax请求呢?

(1)登录

/***
 * 会员登录
 * @param username
 * @param password
 */
var user_login=function(username,password){
//    alert(username+","+password);
    if(isHasLogin())
    {
        alert("你已经登录过,无需再次登录");
        return;
    }
    $.ui.showMask();
    $.jsonP({url:'http://'+server_url+'/tv_mobile/user/login?callback=?&username='+username+"&password="+password,success:function(data){
        var result=data.result;
        $.ui.hideMask();
        switch (result)
        {
            case 1:
                window.user={};
                window.sessionId=data.session;
                user.username=username;
                user.password=password;
                settings_before(document.getElementById("settings"));
                alert("登录成功");
                $.ui.goBack();
                break;
            case 3:
                alert("用户名不能为空");
                break;
            case 4:
                alert("密码不能为空");
                break;
            case 5:
                alert("用户名或密码错误");
                break;
            case 2:
                alert("用户名不存在");
                break;
        }

    }});
}

服务器代码: 

/***
	 * 登录
	 * @param model
	 * @param status
	 * @param view
	 * @param session
	 * @param request
	 * @param callback
	 * @return
	 * @throws IOException
	 */
	@ResponseBody
	@RequestMapping(value = "/login", produces = SystemHWUtil.RESPONSE_CONTENTTYPE_JSON_UTF)
	public String login(Model model, Integer status, UserView view,
			HttpSession session, HttpServletRequest request, String callback)
			throws IOException {
		init(request);
		String content = null;
		UserDao userDao = (UserDao) getDao();
		User user2 = null;
		Map map = new HashMap();
		int login_result = 0;
		if (ValueWidget.isNullOrEmpty(view.getUsername())) {
			login_result = Constant2.LOGIN_RESULT_USERNAME_EMPTY;//用户名不能为空
		} else if (ValueWidget.isNullOrEmpty(view.getPassword())) {
			login_result = Constant2.LOGIN_RESULT_PASSWORD_EMPTY;//密码不能为空
		} else if (ValueWidget.isNullOrEmpty(user2 = userDao.getByUsername(view
				.getUsername()))) {
			login_result = Constant2.LOGIN_RESULT_USERNAME_INVALID;//用户名不存在
		} else if (!user2.getPassword().equals(view.getPassword())) {
			login_result = Constant2.LOGIN_RESULT_FAILED;//登录失败(用户名和密码不匹配)
		} else {
			login_result = Constant2.LOGIN_RESULT_SUCCESS;
			session.setAttribute("user", user2);
			map.put("session", session.getId());// 下载session id到客户端
			System.out.println("session id:" + session.getId());
		}
		// boolean isExist = userDao.isExist(view.getUsername(),
		// view.getPassword());
		
		map.put(Constant2.LOGIN_RESULT_KEY, login_result);
		
		content = JSONPUtil.getJsonP(map, callback);
		return content;
	}

/***
	 * 用于jsonp调用
	 * @param map : 用于构造json数据
	 * @param callback : 回调的javascript方法名
	 * @return : js函数名(json字符串)
	 */
	public static String getJsonP(Map map,String callback)
	{
		ObjectMapper mapper = new ObjectMapper();
		String content = null;
		try {
			content = mapper.writeValueAsString(map);
			System.out.println(content);
		} catch (JsonGenerationException e) {
			e.printStackTrace();
		} catch (JsonMappingException e) {
			e.printStackTrace();
		} catch (IOException e) {
			e.printStackTrace();
		}
		if(ValueWidget.isNullOrEmpty(callback)){
			return content;
		}
		return callback+"("+content+")";
	}
	/***
	 * 
	 * @param key
	 * @param value2
	 * @param callback
	 * @return : js函数名(json字符串)
	 */
	public static String getJsonP(String key ,Object value2,String callback){
		Map map = new HashMap();
		map.put(key, value2);
		return getJsonP(map, callback);
	}

 

 

若登录成功,返回的内容是:

{"result":1,"session":"C3EA8F68A1B685D3F820C4A729A9D0A7"}

注意:

(a)因为是要跨域请求,所以使用JSONP,没有直接使用ajax;

(b)实际上服务器返回的格式是:js函数名(json字符串)

(c)登录成功之后,页面要保存session,因为后续的请求(修改密码)要通过session验证权限

 

(2)修改密码

var modifyPassword=function($old_password,$new_password){
//    alert($old_password.val()+" , "+$new_password.val());
    if(!isHasLogin())
    {
        alert("您未登录,请先登录");
        $.ui.goBack();
        return;
    }
    var old_password_val=$old_password.val();
    if(!com.whuang.hsj.isHasValue(old_password_val)){
        alert("请输入旧密码");
        $old_password[0].focus();
        return;
    }
    if(old_password_val!==user.password){
        alert("旧密码不正确");
        return;
    }
    var new_password_val=$new_password.val();
    if(!com.whuang.hsj.isHasValue(new_password_val)){
        alert("请输入新密码");
        $new_password[0].focus();
        return;
    }
    if(old_password_val===new_password_val){
        alert("两次密码不能相同");
        return;
    }
    $.ui.showMask();
    var modi_url='http://'+server_url+'/tv_mobile/user/mod_pass?callback=?&password='+old_password_val+"&password2="+new_password_val+";jsessionid="+window.sessionId;
    alert(modi_url);
    $.jsonP({url:modi_url,success:function(data){
        var result=data.result;
        $.ui.hideMask();
        switch (result)
        {
            case 1:
                user.password=new_password_val;
                alert("修改成功");
                $.ui.goBack();
                break;
            case 23:
                alert("新密码不能为空");
                break;
            case 21:
                alert("请先登录");
                $.ui.goBack();
                break;
            case 22:
                alert("两次密码不能相同");
                break;
            case 24:
                alert("密码已过期,请点击右上角的刷新按钮");
                break;
        }

    }});
}

 注意:

(a)JSONP只能通过get方式请求,所以要在url地址后面添加session ID;

(b)不能以普通参数的方式来添加session id,应该是";jsessionid="

 

(3)注销

var logout= function () {
    if(!isHasLogin())
    {
        alert("您未登录,请先登录");
        $.ui.goBack();
        return;
    }
    $.ui.showMask();
    var modi_url='http://'+server_url+'/tv_mobile/user/logout?callback=?&password='+user.password+";jsessionid="+window.sessionId;
    alert(modi_url);
    $.jsonP({url:modi_url,success:function(data){
        var result=data.result;
        $.ui.hideMask();
        switch (result)
        {
            case 1:
                window.user=null;
                alert("注销成功");
                $settings=$("#settings");
                var $login_li=$settings.find("#settings_user");
                resetSettingsUserMgmt($login_li);
                break;
            case 23:
                alert("新密码不能为空");
                break;
            case 21:
                alert("请先登录");
                window.user=null;
                $settings=$("#settings");
                var $login_li=$settings.find("#settings_user");
                resetSettingsUserMgmt($login_li);
                $.ui.goBack();
                break;
            case 24:
                alert("密码已过期,请点击右上角的刷新按钮");
                break;
        }

    }});
}

 注意:注销时在请求服务器session的同时还要清除页面的登录信息(window.user=null;)

参考:

http://hw1287789687.iteye.com/blog/2188617

AJAX 跨域请求 - JSONP获取JSON数据:http://justcoding.iteye.com/blog/1366102

 

 

 

1
顶
0
踩
分享到：
| App Framework框架之选择器(2)
评论
2 楼 hw1287789687 2015-03-27  
u012927897 写道
请问一下你的那个intt(request)怎么设置的头信息

你好,我的
init(request);
不是设置头信息,而是获取dao对象.
实现如下:
/***
	 * 获取dao
	 * @param request
	 */
	protected void init(HttpServletRequest request){
		getDaoByWebApp(request);
		
	}
/***
	 * 从WebApplicationContext 获取dao
	 * @param request
	 * @return
	 */
	private  GenericDao<T> getDaoByWebApp(HttpServletRequest request){
		if(ValueWidget.isNullOrEmpty(dao)){
			WebApplicationContext webApp=RequestContextUtils.getWebApplicationContext(request	, request.getSession().getServletContext());
			try {
				dao=(GenericDao<T>)webApp.getBean(ValueWidget.title(SystemHWUtil.getFileSuffixName(clz.getName()+"Dao")));//返回的是同一个对象
			} catch (NoSuchBeanDefinitionException e) {
//				e.printStackTrace();
				dao=(GenericDao<T>)webApp.getBean(SystemHWUtil.getFileSuffixName(clz.getName()+"Dao"));//返回的是同一个对象
			}
			System.out.println("dao:"+dao);
		}
		return dao;
	}
1 楼 u012927897 2015-03-27  
请问一下你的那个intt(request)怎么设置的头信息
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    详解如何在Vue项目中发送jsonp请求

    在页面a中由前端发送一个jsonp请求到客户方，得到一个token值 前端得到token值后向自己后端发送一个请求，后端根据token去redis(token的值就是redis里的key)里取值(key=token的值，value=用户信息等)判断用户是否已...

    jQuery 发送一个 jsonp 请求

    jQuery 发送一个 jsonp 请求 jQuery 也提供给我们发送 jsonp 请求的方式 1. jsonp: 利用 script 标签的 src 属性来请求 2. 返回值: 是一个字符串, 字符串里面写了一个 函数名(后端传递给前端的参数) 使用 $.ajax() ...

    jsonp跨域请求

    4. **浏览器加载**：浏览器自动发送GET请求到指定URL，服务器返回一个以回调函数名为开头的JavaScript代码。 5. **执行回调**：浏览器解析`&lt;script&gt;`内容，执行返回的JavaScript代码，调用`handleData`函数，传入...

    使用Script元素发送JSONP请求的方法

    文章中提到的方法展示了如何使用script元素发送JSONP请求。具体来说，首先要定义一个名为getJSONP的函数，该函数接收两个参数：URL和回调函数callback。然后，这个函数会为本次请求创建一个唯一的回调函数名称。如果...

    jsonpajax跨域请求

    在Web开发中，由于浏览器的同源策略限制，JavaScript不能直接向其他域名发送请求，但JSONP和AJAX通过特定的方式绕过了这个限制，使得前端能够获取到不同源的数据。 1. JSONP介绍： JSONP是一种非官方的跨域数据...

    Ajax跨域请求解决方案-JSONP

    当`&lt;script&gt;`标签的`src`属性指向一个提供JSON数据的URL时，浏览器会发送GET请求，并接收返回的JavaScript代码执行。JSONP就是将JSON数据包裹在一个JavaScript函数调用中，这样返回的数据就能被前端的JavaScript代码...

    html通过 ajax jsonp跨域请求接收和传送数据

    客户端的AJAX请求设置`xhr.open('GET', url, true)`，然后发送请求。 2. **JSONP跨域**: JSONP的工作方式不同，它不依赖于XMLHttpRequest对象。首先，客户端在HTML页面中定义一个全局函数，如`handleData(data)`。...

    jsonp跨域请求数据实现手机号码查询实例分析.docx

    - **发起请求**：使用jQuery的`$.ajax`方法发送GET请求，并设置`dataType`为`"jsonp"`以支持JSONP方式的跨域请求。 - **参数设置**：URL中包含待查询的电话号码，并指定`jsonp`参数为`callback`，这是服务器端期望...

    一个用于jsonp请求的小库

    3. **错误处理**：由于JSONP没有标准的错误处理机制，库通常会提供一种方法来捕获可能的错误，如超时、脚本加载失败等。 4. **异步请求**：尽管JSONP本质上是同步的，但库可能通过事件监听或Promise等手段来模拟...

    ajax跨域请求jsonp前后台代码

    基于ajax方式的跨域请求jsonp的前后台代码

    ajax跨域CORS方案 JSONP跨域请求方案.zip

    3. **携带Cookie**：默认情况下，CORS请求不会携带Cookie。若要实现，服务器需在响应头中添加`Access-Control-Allow-Credentials: true`，同时客户端需要设置`withCredentials: true`。 ### JSONP方案 JSONP是早期...

    JSONP解决跨域问题

    JSONP（JSON with Padding）是一种跨域数据交互协议，它利用了`&lt;script&gt;`标签可以跨域请求资源的特性，为了解决JavaScript在浏览器端由于同源策略限制无法直接访问不同源的HTTP请求的问题。在本场景中，前端使用...

    学习总结：前端跨域请求的解决办法——JSONP

    由于浏览器的同源策略限制，JavaScript不能随意地向不同源的服务器发送Ajax请求。为了解决这个问题，开发者们发明了各种跨域解决方案，其中JSONP（JSON with Padding）是一种广泛使用的非官方标准。本文将深入探讨...

    PHP AJAX JSONP实现跨域请求使用范例_ajax如何解决跨域请求

    在这个实例中，我们使用 jQuery 的.ajax() 方法来发送 POST 请求，并指定 dataType 为 jsonp，以便使用 JSONP。 ```javascript $.ajax({ type: "post", url: "ajax.php", dataType: "jsonp", jsonp: "callback...

    uni-app封装请求完成示例项目

    【uni-app封装请求完成示例项目】是一个专为uni-app框架设计的实用示例，旨在帮助开发者更高效地处理网络请求。uni-app是一款基于Vue.js开发的多端框架，能够一次编写，多端运行，覆盖H5、小程序、App等平台。在实际...

    vue-jsonp:一个用于处理JSONP请求的小型库

    Vue-JSONP 一个用于处理JSONP请求的微型库。快速开始作为Vue插件： import { VueJsonp } from 'vue-jsonp'// Vue Plugin.Vue . use ( VueJsonp )// Now you can use this.$jsonp in Vue components.const vm = new ...

    jsonp.pdf文件

    ### JSONP在方案中心项目中的应用 #### 一、背景介绍与问题提出 随着Web技术的发展，AJAX（Asynchronous JavaScript and XML）作为一种提高Web应用交互性和用户体验的技术被广泛采用。然而，AJAX的核心组件...

    ajax的js,jq jsonp，的请求方式

    由于同源策略的限制，Ajax通常无法跨域请求，但JSONP通过动态创建`&lt;script&gt;`标签并指定一个回调函数来解决这个问题。服务器返回的响应是一个JavaScript函数调用，带有JSON格式的数据作为参数。例如： ```javascript...

Magicbox
Global site tag (gtag.js) - Google Analytics