实现Servlet项目的前后端交互
servlet前后端交互流程
前端获取数据之后,通过Ajax传给后端。前端通过Ajax与后端交互
Ajax格式
若url引用错误会导致404错误,后端没有导入jar包会导致500-内部服务器错误。
后端通过jdbc和数据库实现交互,交互由DBco,MysqlUtil,sql语句三者组成。
所以前后端交互流程为:前端←→后端←→数据库
前后端文件之间的关系:
新建Servlet项目步骤
1.前台HTML页面,引入css与js
2.引入Ajax,实现与后端的数据传输
引入jquery
<script src="https://cd3.n.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
Ajax代码(data:data,//data代表key -value类型的数据)
<script>
function get(){
var url = "http://ip地址:端口号/项目名称/servlet地址";
$.ajax({
type: "get", //指定提交的类型 get对应 doGet()方法,post--->doPost()犯法
url: url, //传输地址的URL
data: {"id":"1"}, //data代表我们的数据 key -value类型的数据
cache: false, //缓存
dataType: "JSON",
async : false,
//success和error代表是否返回成功,既后台给前台传输数据是否成功
success: function (data,textStatus, jqXHR)
{
//alert(data.data);
//console.log(data);
},
error:function (XMLHttpRequest, textStatus, errorThrown) {
alert(typeof(errorThrown));
}
});
}
</script>
传输数据代码
var data = {
"account":$("#account").val(),
"password":$("#password").val(),
"ConfirmPassword":$("ConfirmPassword").val()
};
