Vue + Servlet 前后端连接，数据传递

问题描述： 由于我是第一次写前后端分离的网页，所以心里一直不怎么清楚如何实现前后端连接，查阅了网上的资料后，发现大家后端基本都是用的SpringBoot，后端获取前端传送的数据，只需要通过注解就可以了，而传统的JSP写法，后端获取前端数据是通过

request.getParameter("参数名")

但是我们还是用不上，因为我们是用的 Vue+Servlet 这种不伦不类的组合，不过好在最终还是从网上到了解决方法. 解决方法: 前端，使用axios发送请求

//在main.js中 引入axios
import axios from 'axios'
//挂载axios
Vue.prototype.$http = axios

具体使用，以系统登录为例

<el-button type="primary" @click="login" style="width: 8vw">登录</el-button>

按钮绑定方法，点击按钮调用方法，获取用户输入的账号和密码，传递给后端，

后端：使用Servlet 接受前端数据，完成业务逻辑，返回结果

/*
因为没办法通过request.getParameter("参数名")方法获取前端传来的数据，
于是通过此方法接受前端传来的数据，转换为字符串输出
*/
private String getRequestPayload(HttpServletRequest req) {
		StringBuilder sb = new StringBuilder();
		try (BufferedReader reader = req.getReader();) {
			char[] buff = new char[1024];
			int len;
			while ((len = reader.read(buff)) != -1) {
				sb.append(buff, 0, len);
			}
		} catch (IOException e) {
			e.printStackTrace();
		}
		return sb.toString();
	}

使用上述方法，可以将前端传来的数据（键值对）转换为字符串，但这对我们的取数据就造成了麻烦，我前期一直用正则表达式处理字符串，获取想要的数据，最后随着前端传送的数据越来越复杂，该方法就不再合适了，**这里强推阿里的 fastjson包，可以直接将json字符串转换为对象，真香**

fastjson下载，看这篇文档

后端方法具体调用

String str = getRequestPayload(request);   //调用方法 获取前端数据，返回字符串
		System.out.println(str);
		if (str != null && str.length() != 0) {    //如果字符串不为空
			if (!str.contains("command")) {
				if (str.contains("admin")) {
					password = str.replaceAll("[[^0-9]]", ""); //正则表达式处理字符串，很麻烦
					System.out.println(password);
					res = manager.adminLogin("admin", password);
					flag = 0;
				} else {
					String newStr = str.replaceAll("[[^0-9,]]", "");
					String data[] = newStr.split(",");
					if (data[0].substring(0, 1).equals("4")) {
						res = manager.studentLogin(data[0], data[1]);
						flag = 2;
					} else {
						res = manager.teacherLogin(data[0], data[1]);
						flag = 1;
					}
				}
				PrintWriter out = response.getWriter();  //返回数据要用到的对象
				if (res && flag == 0) {
					out.write("管理员登录成功");    //具体返回数据，这里的内容就是前端res.data获取的内容
				} else if (res && flag == 1) {     //由于该方法只能返回字符串，所以如果你要返回数据（比如从数据库查询的数据）
					out.write("教师登录成功");	   //需要先将数据 通过阿里的fastjson工具转换为一个json字符串，这样发送过去，前端接收到会自动转换为对象
				} else if (res && flag == 2) {
					out.write("学生登录成功");
				}
				if (!res) {
					out.write("登录失败");
				}

到这一步，前后端的连接就打通了，之后就是不断的复用了，如果你的Servlet还不知道怎么跑起来，问度娘呗