关于跨域返回jsonp的示例

本文受http://blog.csdn.net/yuebinghaoyuan/article/details/32706277启发,作了小小改动;


本事例基于webwork框架下进行,对于ssh2框架,应该同样适合,没有再进行试验;

第1步:首先创建后台Action类,这里通过循环生成一个列表;

TestJson.java

/**
 * @FileName: TestJson.java
 * @Description: Todo(用一句话描述该文件做什么)
 * @copyright: copyright(C) 2010-2015 All rights Reserved
 * @Company: information Technology Co.,LTD.
 * @author: neil
 * @version V1.0 
 * @Createdate: 2015-10-27
 *
 * Modification  History:
 * Date         Author        Version        discription
 * -----------------------------------------------------------------------------------
 * 2015-10-27       NEIL          1.0             1.0
 * Why & What is modified: <修改原因描述>
 */
package com.web.action;

import java.io.Writer;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

import org.json.JSONObject;

import com.opensymphony.webwork.ServletActionContext;
import com.opensymphony.xwork.ActionSupport;

@SuppressWarnings("serial")
public class TestJson extends ActionSupport {

	@SuppressWarnings({ "rawtypes","unchecked"})
	@Override
	public String execute() throws Exception {
		try {
			JSONObject jsonObject = new JSONObject();
			List list = new ArrayList();
			for (int i = 0; i < 4; i++) {
				Map paramMap = new HashMap();
				paramMap.put("bank_no",100 + i);
				paramMap.put("money_type",i);
				paramMap.put("bank_name",i);
				paramMap.put("bank_type",i);
				paramMap.put("bank_status",0);
				paramMap.put("en_sign_ways",1);
				list.add(paramMap);
			}
			JSONArray rows = JSONArray.fromObject(list);
			jsonObject.put("RESULTSET",rows);
			HttpServletRequest request = ServletActionContext.getRequest();
			HttpServletResponse response = ServletActionContext.getResponse();
			response.setContentType("text/javascript");

			boolean jsonP = false;
			String cb = request.getParameter("callback");
			if (cb != null) {
				jsonP = true;
				System.out.println("jsonp");
				response.setContentType("text/javascript");
			} else {
				System.out.println("json");
				response.setContentType("application/x-json");
			}
			response.setCharacterEncoding("UTF-8");
			Writer out = response.getWriter();
			if (jsonP) {
				out.write(cb + "(" + jsonObject.toString() + ")");
				System.out.println(jsonObject.toString());
			} else {
				out.write(jsonObject.toString());
				System.out.println(jsonObject.toString());
			}
		} catch (Exception e) {
			e.printstacktrace();
		}

		return null;
	}
}


第2步:配置xwork.xml文件

<action name="testjson" class="com.web.action.TestJson">
	<result name="success" type="json">
		<param name="jsonObjectProperty">jsonObject</param>
	</result>
</action>


第3步:前台页面调用

$.ajax({
	type: "GET",url: "http://localhost:8080/zhqx/testjson.action",dataType: "jsonp",jsonp: "callback",success: function(data) {
	    alert("a");
	}
});

请注意,jsonp:"callback"中的值要与后台action中String cb = request.getParameter("callback");一致,否则无法进行回调;

通过此方法,就可以实现跨域访问,无论前端页面在哪里都可以实现调用

相关文章

AJAX是一种基于JavaScript和XML的技术,能够使网页实现异步交...
在网页开发中,我们常常需要通过Ajax从后端获取数据并在页面...
在前端开发中,经常需要循环JSON对象数组进行数据操作。使用...
AJAX(Asynchronous JavaScript and XML)是一种用于创建 We...
AJAX技术被广泛应用于现代Web开发,它可以在无需重新加载页面...
Ajax是一种通过JavaScript和HTTP请求交互的技术,可以实现无...