前段时间 做了个学校的春萌项目,其中用到vue连接后端java接口。

先上后端接口代码:

package controller;
import net.sf.json.JSONObject;
import util.DBUtil;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;
import java.sql.Connection;
import java.sql.Date;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
@WebServlet(name = "login",urlPatterns = "/login")
public class login extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
HttpSession session = request.getSession(true);
String username = request.getParameter("username");
String password = request.getParameter("password");
DBUtil dbUtil = new DBUtil();
Connection connection = dbUtil.getConnection();
PreparedStatement preparedStatement;
ResultSet rs;
String psw="";
String sql = "select password from `user` where username=?";
try {
preparedStatement = connection.prepareStatement(sql);
preparedStatement.setInt(1,Integer.parseInt(username));
rs = preparedStatement.executeQuery();
while (rs.next()){
psw = rs.getString("password");
}
}
catch (Exception e){
e.printStackTrace();
}
if (password.equals(psw)){
session.setAttribute("username",username);
response.getWriter().print("true");
}
else
response.getWriter().print("false");
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
}
}

前端调用:

Login


智慧图书管理平台







记住密码

立即注册

登录



new Vue({
el:'#interface_height',
data:{
username:'',
password:''
},
methods:{
login:function () {
this.$http.post('login',{username:this.username,password:this.password},{emulateJSON:true}).then(function(res){
console.log(res.data);
window.location.href = 'index.html';
},function(res){
console.log(res.status);
});
}
},
created:function(){
}
})