(☆_☆)/~~前后端是如何交互的？小白一个，求高手指点。

Question

只接触过前端，各种不懂后端的。。。希望大神能给描述一下它们之间的关系，如何联系的？跪谢~~~!

Answer 1

一句话：HTTP(s)协议

所谓接口就是 HTTP(S) 的URL + 参数 + 返回的结果

前端发起请求并等待服务器响应（返回结果）

1、原始的HTML方式是表单

<form method="post/get">
 <input...> ...
</form>

这种方式在submit（提交表单）之后，浏览器会发送一个HTTP（GET/POST）请求给服务器（后端）
服务器处理完后返回结果 页面 ，浏览器重新显示新的页面，所以会刷新

2、现在流行的方式是AJAX

已jquery为例，$.get/post/ajax 之后也会给服务器发送HTTP请求
服务器处理完后返回结果（比如json）而非整个页面，所以是 无刷新 的。

后端等待前端请求，处理请求后把处理结果返回给前端

对于后端来说，原始的表单方式和AJAX发来的请求是一样的，
唯一区别就是返回的结果类型，
前者要返回整个新页面的HTML代码，
而后者只需要返回约定好的类型数据（比如json:{result:true/false, msg: 'blabla'}）

总结

前后端交互可以 类比 一下函数调用（作为前端应该知道javascript函数吧...）
后端负责定义好函数：

function test(a, b){
    return a + b;
}

前端负责调用这个后端提供的函数（接口）：

r = test(1,2)
alert('1+2=' + r);

类比：

$.post({
    url:'test',
    data:'a=1&b=2',
    success:function(data,status){
        alert('1+2=' + data);
    },
})

前后端的交互就跟函数调用一样（如果你不追究浏览器后台的HTTP处理的话）

嗯，就是这样！前端填入参数并调用接口，后端处理然后返回结果，前端再处理后端返回的这个结果！
END!

Answer 2

一般来说使用前端用Ajax 把数据写成json字符串的形式提交给后端.

$.ajax({
url:'abc.com',
data:{name:'name',
      sex:'sex'
     }
datatype:POST;//也可以是get
})

后端根据你提交的类型（post还是get）：

$name=$_POST[name];$sex=$_POST[sex] 来提取数据。。。

后端echo json字符串给前端 前端也是通过Ajax请求获得数据再解析。
大体就这样，详细的要很啰嗦。

Answer 3

由后端提供数据接口。前端调用并渲染出来。前后端分工明确。这样做后端可以少了很多工作，前端相对就多了

Answer 4

ajax，很简单的