[vue中的陷阱]Axios发送post无法获取参数的问题

axios默认的发送数据的方式是Json格式,在后台使用获取form的方式获取会报空指针异常.

解决方法一

配置axios的提交数据的方式.
全局配置

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
        axios.defaults.headers.get['Content-Type'] = 'application/x-www-form-urlencoded';
        //转换成form的方法  key=value
        axios.defaults.transformRequest = [function (data) {
            let ret = ''
            for (let it in data) {
                ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
            }
            return ret
        }]
        Vue.prototype.$axios = axios

局部配置

axios({
            url: '/something',
            method: 'post',
            data: {
              	//参数
            },
            transformRequest: [function (data) {
              let ret = ''
              for (let it in data) {
                ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&'
              }
              return ret
            }],
            headers: {
              'Content-Type': 'application/x-www-form-urlencoded'
            }
          })

解决方案二

在服务端接收json

 public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");
        request.setCharacterEncoding("UTF-8");

        /**
         * 
         * 使用字符流或者字节流接收json
         */
        BufferedReader reader = request.getReader();
        String json = reader.readLine();
        System.out.println(json);
        reader.close();


    }

你可能感兴趣的:(Vue)