ajax请求代码:
- //区域事件选择配送点
- function changeDistrict(value){
- if(value == 0){
- $('#transport_node').empty();
- $('#transport_node').append('<option value="0">请选择</option>');
- return;
- }
- $('#transport_node').empty();
- $('#transport_node').append('<option value="0">加载中...</option>');
- $.ajax({
- type: 'GET',
- url: "http://192.168.33.114:8080/UIDTraceAdmin/transportnode/pagelist/jsonp?callbackFunction=jsonpCallback",
- async: false,
- dataType: "jsonp",
- jsonp: "jsonpCallback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
- success: function(o){},
- timeout:3000
- });
- }
- function jsonpCallback(result) {
- if(result.success == true){
- $('#transport_node').empty();
- $('#transport_node').append('<option value="0">请选择</option>');
- $.each(result.transportList, function(i, n){
- var html = '<option value="'+n.nodeId+'">'+n.transportnodeName+'</option>';
- $('#transport_node').append(html)
- });
- }else{
- $('#transport_node').empty();
- $('#transport_node').append('<option value="0">请选择</option>');
- }
- }
要点:
1.url中的请求参数callbackFunction=jsonpCallback这是服务器响应返回后调用的javascript方法的名称
2.dataType要为jsonp
跨域服务器处理代码:
- @RequestMapping("/pagelist/jsonp")
- public void pagelist(@ModelAttribute TransportNode node,HttpServletRequest httpReq,
- HttpSession session,HttpServletResponse response) {
- //返回头部设置
- response.setHeader("Pragma", "No-cache");
- response.setHeader("Cache-Control", "no-cache");
- response.setHeader("Content-type", "application/x-javascript;charset=utf-8");
- response.setDateHeader("Expires", 0);
- String jsonpCallback = httpReq.getParameter("callbackFunction");//jsonp回调函数名
- JSONObject resultJson = new JSONObject();
- PrintWriter out = null;
- try {
- out = response.getWriter();
- } catch (IOException e1) {
- e1.printStackTrace();
- }
- try {
- node.setRowStart((node.getPage() - 1) * node.getRows() + 1);
- node.setRowEnd(node.getPage() * node.getRows());
- resultJson.put("transportList", JsonUtils.toJSONList(business.getList(node)));
- resultJson.put("success", true);
- System.out.println(resultJson.toString());
- out.println(jsonpCallback+"("+resultJson.toString()+")");//返回jsonp格式数据
- out.flush();
- out.close();
- } catch (Exception e) {
- LogWriter.log("/pagelist/jsonp",e);
- try {
- resultJson.put("success", false);
- } catch (JSONException e1) {
- e1.printStackTrace();
- }
- out.println(jsonpCallback+"("+resultJson.toString()+")");//返回jsonp格式数据
- out.flush();
- out.close();
- }
注意要点:
1.设置响应报文头,response.setHeader("Content-type", "application/x-javascript;charset=utf-8");,消除了"Resource interpreted as Script but transferred with MIME type text/plain",同时要根据自己的编码格式设置正确的编码;
2.jsonp的数据格式是:jsonpCallback+"("+resultJson.toString()+")"
扫描二维码关注公众号,回复:
550808 查看本文章
举个例子:
jsonpCallback({
"code": "aaa",
"price": 1780,
"tickets": 5
});