Ajax实现前后端交互

这里的前后端交互主要以，前段ajax技术发送.php文件地址和.php文件建立连接；php接收前端发送的数据放在对应变量中，然后以mysql地址连接mysql做相应操作，接着把mysql改变后的数据返给ajax；ajax接收数据并通过js渲染页面。

一般网站的数据处理分三层：表示层、业务层、数据层

表示层：可以用HTML代码，CSS/Javascript代码来实现等。

业务层：这层是负责处理数据的。常用的代码语言有PHP,JSP，Java等。通过这些后台处理语言的算法来处理前台传回的数据。必要的时候进行操作数据库，然后把结果返回给前端网页。

数据层：这个就是数据库，用来存储数据的。通过业务层的操作可以实现增删改数据库的操作。

Ajax前后交互主要形式：

前端：html+js
	    发： ajax(通过url地址连接对应.php文件)
	    收： ajax（ajax回调函数接收，接受的是json文件，js		    转成对应形式放在html页面）
	后台：php
	    收：$_GET["字段名"] 或 $_POST["字段名"] 或 $_REQUEST[""]
		操作：通过地址连接对应mysql,并执行mysql命令
	    发：echo；print；print_r；die（发往前段ajax）
	数据库mysql：只做数据的存储，增删改查由php操作

一、 前段通过ajax操作发送和接收数据 :

1.什么是ajax: js语言和服务器的交互手段
运行环境：服务器环境下运行

2.如何发送数据：
get方法发送：将数据在，url后，拼接即可, 用？号连接，多个数据用&连接
如：url+"?name=admin&pass=123";

post方法发送：将数据以字符形式放在send的参数内，多个数据用&连接，但是提前要设置发送数据的格式：

ajax对象.setRequestHeader("Content-type","application/x-www-form-urlencoded");

注意：PHP地址必须发送，地址后边的数据可以省略

3.发送ajax请求

	3.1、创建xhl对象
var xhr = new XMLHttpRequest();
3.2、请求.php文件的地址
xhr.open("get","要请求的地址")；
3.3、发送数据,xhr对象身上的send
xhr.send();

3.4、观察状态,成功则接受后台数据
xhr.onreadystatechange = function(){
   //载体的状态：通了：4
   //运营商的状态：通了：200
   if(xhr.readyState == 4 && xhr.state == 200){
	   如果成功了用xhr对象拿数据
	   console.log(xhr.responseText);
   }
  }


例：ajax封装(get和post方法结合)
function ajax(ops){
ops.type = ops.type || "get";
ops.data = ops.data || "";
ops.url = ops.type=="get" ? ops.url + "?" + ops.data : ops.url;
var xhr = new XMLHttpRequest();
xhr.open(ops.type, ops.url);
if(ops.type == "get"){
    xhr.send();
}else{
    xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xhr.send(ops.data);
}
xhr.onreadystatechange = function(){
    if(xhr.readyState === 4 && xhr.status === 200){
        ops.success(xhr.responseText);
    }
}

}

注意：前后端交互，只能交互文本，字符

二、后台php的操作

php的介绍：php只是一门后台编程语言，默认只能工作在服务器环境下，不能工作在浏览器环境，php文件不能在浏览器解析运行。（php代码得写在.php文件中）

php文件必须在服务器环境下解析完成，之后，才有可能在浏览器中呈现php发送的数据。

前端要与php交互：前端给后台点东西->后台接收到数据给点反馈->前端又能接收到后台的反馈

如何使用php操作mysql：
1.首先要先准备数据库，数据表，最好有字段，数据无所谓
2.要想操作数据库，必须得先连接数据库
3.连接成功之后操作（使用mysql命令）
4. 解析数据库返回的数据
5.将返回的数据转成json格式发送到前段ajax

例：

	<?php
	//1.接收ajax发送的数据
		$u = $_REQUEST
	
	//2.建立与mysql连接
		$link = mysqli_connect(数据库的地址，用户名，密码，提前选择的数据库)；
	
	//3..查询表中所有数据，可以通过php的方法向mysql发送命令
		$sql = "SELECT * FORM `stu`";
$res = mysqli_query($link,$sql);
	//4.mysqli_fetch_all可以解析出所有数据，结果是php的二维数组
		$arr = mysqli_fetch_all($arr);
	//5.转成json之后，查看，将来会转成json之后，发给前端
		echo json_encode($str); 
?>

三、mysql相关介绍：

数据库管理系统，用来管理数据的，将数据，按照一定得规则，关系，类别，高效的组织或打包起来，使用某种方式管理维护， 这就叫数据库。
行：记录
列：字段
表：数据表
库：数据库
管理：数据库管理系统
mysql自身其实也没有可视化管理界面，但是将数据可视化了
需要使用mysql命令操作数据库麻烦，繁琐。于是，又有第三方，开发了建立在mysql基础上的可视化管理界面的工具
如： navicat、sql_front
数据库中的数据可以通过可视化管理工具进行数据存放和修改。

综上所述：主要是用ajax实现前端的数据发送与接收，php操作数据库并回应给前段，以及用mysql做数据的存储。现实中，对于前后的交互技术还有很多种，这里只是前后交互的一种简单实现讲解，对于java、pathon也有对应的前后交互技术，所以要按需参考。