zoukankan      html  css  js  c++  java
  • jquery Ajax 通过jsonp的方式跨域提交表单

      Jquery Ajax可以通过jsonp的方式跨域提交表单,至于什么是跨域提交简单说就是你的客户端和服务端不在同一个域名下或端口号不同也可以叫做跨域。

    前台代码:

    $.ajax({
                 type : 'get',
                 async: false,
                 url : '${pageContext.request.contextPath}/clue/uploadForm',
                 dataType : 'jsonp',
                 data: {
                             mydata : JSON.stringify(obj,fm),
                             formId : formId
                         },
                 jsonp: 'callbackparam',
                 jsonpCallback:'success_jsonpCallback',
                 success : function(json){
                     //alert(json.message);
                     result = json.message;
                 },
                  error : function(json,XMLResponse){
                      //alert(XMLResponse.responseText+XMLHttpRequest.status);
                      result = "返回信息:" + json.message + "错误码:" + XMLHttpRequest.status;
                 }
            });


    后台代码:

    /**
         * 提交form表单数据
         * @param request
         * @param session
         * @return
         * @throws IOException 
         */
        @RequestMapping(value ="uploadForm")
        public void uploadForm(HttpServletRequest request, HttpServletResponse response,HttpSession session) throws IOException{
            Map<String,Object> dataMap = new HashMap<String,Object>();
         dataMap.put("message","success");   String callbackparam
    = request.getParameter("callbackparam"); response.setCharacterEncoding("utf-8"); JSONObject json = JSONObject.fromObject(dataMap); System.out.println(callbackparam+"("+ json.toString() + ")"); response.getWriter().print(callbackparam+"("+ json.toString() + ")"); }

    注意:
    1.通过jsonp方式跨域返回值不能为数据,其实为一段js代码,所以如果是springmvc,不能使用@ResponseBody注解。

    2.返回值中要按照jsonp的格式,即callbackparam值加上“()”,括号中为json字符串

    3.前台代码中,jsonp属性中callbackparam为回调函数名称变量名,jsonpCallback属性为回调函数名称的值。

  • 相关阅读:
    模拟博客园系统
    神经网络的数据表示
    第一个神经网络简洁示例
    python10——正则表达式
    python09——垃圾回收机制
    python08——文件操作与模块
    python实践——飞机大战
    python07——面向对象基础(3)
    python06——面向对象基础(2)
    python05——面向对象基础(1)
  • 原文地址:https://www.cnblogs.com/Answer900310/p/5978073.html
Copyright © 2011-2022 走看看