jsonP跨域解决

前端之家收集整理的这篇文章主要介绍了jsonP跨域解决前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
解决跨域问题的时候,用到jsonp,前端代码仅仅在url中添加一个参数callback=?
  1. <html>
  2. <head>
  3. <script type="text/javascript" src="/js/jquery-1.8.3.js"></script>
  4. <script type="text/javascript">
  5.  
  6. $(document).ready(function(){
  7.  
  8. $("button").click(function(){
  1. //在url的后面添加参数:callback=?,问好的值有jQuery产生随机
  2. ,配置后在本地可以通过该链接访问链接后的Controller,并且接收Controller的返回值。
  1. $.getJSON("/updateUser?name=donaldDuck&callback=?",function(data,status){
  2. // alert("数据:" + data[0].userName + "\n状态:" + status);
  3. // var dataObj=eval("("+data+")");
  4.  
  5. alert(data.id);
  6.  
  7. });
  8.  
  9. });
  10. });
  11. </script>
  12. </head>
  13.  
  14. <body>
  15. <p>姓名:<input type="text" id="test" value="米老鼠"></p>
  16. <br>
  17.  
  18. <button id="button" >显示值</button>
  19. </body>
  20.  
  21. </html>
  1. controller后端代码
  1. <pre class="java" name="code">@ResponseBody
  2. @RequestMapping("/updateUser")
  1. //在参数列表中添加正常接收的参数外,还需要添加一个参数callback,用来接收在前端带过来的callback随机数。
  1. public String updateUser(String name,String callback) throws IOException {
  2.  
  3. //返回简单字符串的时候可以直接返回,返回类型String,// 添加注解@ResponseBody
  4. 返回字符串的格式为:jsonp :jQuery183017739112760886932_1438865715964({"id":"a"}),括号括起来json数据
  5. String aa= callback+"({\"id\":\"a\"})";
  6. System.out.println("jsonp :"+aa);
  7. return aa;
  8.  
  9. }

猜你在找的Json相关文章