美文网首页
Jfinal解决AJAX的跨域请求

Jfinal解决AJAX的跨域请求

作者: ccq_inori | 来源:发表于2017-12-17 12:08 被阅读0次

    JFinal 是基于 Java 语言的极速 WEB + ORM 框架,其核心设计目标是开发迅速、代码量少、学习简单、功能强大、轻量级、易扩展、Restful。

    一开始使用AJAX来传输json数据时,在本机上还是可以实现的,但是没法给url给其他人调用并且传输数据。
    然后发现jsonp可以解决跨域请求(这应该是就是我寻找的)。
    JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。
    由于没有两台电脑,所以我选择了两种工具(Eclipse和myEclipse)来对AJAX的跨域请求进行回应.。
    前端是在myEclipse上书写,后台在Eclipse上书写.
    首先是前端:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    <body>
        <div id="myDiv"><h2>这里是myeclipse的页面</h2></div>
         <button type="submit">提交</button>
        <script src="http://code.jquery.com/jquery-1.11.3.js"></script>
        <script>
        $('button').click(function(){
           $.ajax({
                  type:'get',
                  url:'http://localhost/submit',
                  data:{
                    username:'123456',
                    password:'456789',
                    name:'xiaoming',
                    remark:'无'
                  },
                  dataType:'jsonp',
                  contentType:'application/x-www-form-urlencoded;charset=UTF-8',
                  async:false,
                  cache:false,
                  success:function(response){
                  //扩展回调函数  
                    alert(response.res),
                    $('h2').text('成功回应跨域请求')
                  },
                  error:function(){
                    //处理异常数据...
                    alert(0)
                  }
    });
        })
        </script>
    </body>
        
    </html>
    

    接下来是controller

        public void submit()
        {
            System.out.println(getPara("username"));
            System.out.println(getPara("password"));
            System.out.println(getPara("name"));
            System.out.println(getPara("remark"));
            getResponse().addHeader("Access-Control-Allow-Origin", "*");
            Map json=new HashMap();
            json.put("status",0);   
            json.put("res",true);
            String callback = getRequest().getParameter("callback"); 
            String jsonp = callback+"("+ JsonKit.toJson(json)+")";//返回的json 格式要加callback()
            renderJson(jsonp);      
        }
    

    总结:发现学习后台,你还要基本掌握一些前端技术和框架,起码先自己先玩熟先,不然到了真正做项目的时候,真的来不及,要懂得前端的数据是以什么形式来传输到后台的,你又怎么回应前端的请求。

    相关文章

      网友评论

          本文标题:Jfinal解决AJAX的跨域请求

          本文链接:https://www.haomeiwen.com/subject/gygswxtx.html