ajax jsonp跨域请求乱码解决方案

在前端页面对要在url中传递的参数进行urlencoder(),进行两次编码

在controller中对接收的参数进行解码，只需一次解码！

在controller的@requestmapping()注解中添加属性product:

@RequestMapping(value = "/makeAppointment",produces="text/html;charset=UTF-8")

具体代码如下：

主页（服务端页面vm）:

<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="/js/jquery-1.8.3.js"></script>
    <script type="text/javascript">
 
        $(document).ready(function(){
 
            $("#button").click(function(){
                var name =encodeURI($("#name").val());
 
                var tel =$("#tel").val();
                var url ="/makeAppointment?name="+encodeURI(name)+"&tel="+tel+"&callback=?";
                $.getJSON(url,
                        function(data,status){
                            $("#spanArea").html(data.userName+"\n "+data.id);
                        });
 
            });
        });
 
    </script>
</head>
 
<body>
<div style="position: absolute;left: 504px;height: 522px;" align="center">
    <span style="font-size: 43px;font-family: fantasy;color: darkorange;" id="spanArea">预约页面</span>
<p><span style="font-size: 33px;font-family: fantasy;color: gray;">
    姓名：
</span><input type="text" id="name" style="width: 400px;height: 38px;font-size: 33px;"></p>
<p><span style="font-size: 33px;font-family: fantasy;color: gray;">
    电话：
</span><input type="text" id="tel" style="width: 400px;height: 38px;font-size: 33px;"></p>
 
<button id="button" style="width: 300px;height: 41px;background-color: darkorange;font-family: Helvetica Neue, Helvetica, Arial, sans-serif;font-size: 30px;">
    预   约</button>
</div>
</body>
 
</html>

controller代码：

package com.jd.jr.controller;
 
import com.alibaba.fastjson.JSON;
import com.jd.jr.po.UserPo;
import org.apache.log4j.Logger;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
 
import java.io.UnsupportedEncodingException;
import java.net.URLDecoder;
 
 
/**
 * Created by guojiangjiang on 2015/8/7.
 */
@Controller
public class Appointment {
    private static Logger logger = Logger.getLogger(Appointment.class);
    //@RequestMapping(value = "/makeAppointment",produces="text/html;charset=UTF-8")
    @RequestMapping(value = "/makeAppointment",produces="text/html;charset=UTF-8")
    @ResponseBody
    public String getAppointment(String name,String tel,String callback) throws UnsupportedEncodingException {
    //  logger.info("name is: " + URLDecoder.decode(name,"UTF-8") + "tel is : " + URLDecoder.decode(tel,"utf-8"));
        //String names =new String(name.getBytes("iso-8859-1"),"utf-8");
 
        String names = URLDecoder.decode(name, "utf-8");
 
        int telep = Integer.parseInt(tel);
        UserPo user = new UserPo();
        user.setId(telep);
        user.setUserName(names);
        String json = JSON.toJSONString(user);
 
 
        String result = callback+"("+json+")";
        System.out.println(result);
        return result;
    }
}

原文参考：https://blog.csdn.net/mggwct/article/details/47355323

posted @ 2018-11-21 15:13  victorlyw  阅读(269)  评论(0)    收藏  举报