js与后台交互详述（入门篇）

　　很多新手前端在初期学习的时候往往把注意力放在如何编写页面，如何编写效果上，群里有个朋友问我js是如何与后台交互的，我简单的说一下。

　　首先需要知道两个东西，一个是客户端，一个是服务器，客户端其实就是我们在上网时候使用的机器，大部分情况下这个客户端就是我们的电脑，包括台式电脑，笔记本电脑，手机，平板之类的。那么服务器是什么？服务器其实也是电脑，准确的说服务器是性能比较强大的电脑，正常情况下一台服务器可以连续半年甚至一年不关机，连续运行，这个技能我们家用电脑大多做不到。正是因为服务器可以保持长时间的运行，从而保证我们放在服务器上文件可以随时都被访问到.

　　现在来看一下服务器和客户端之间的联系，这里就以网站为基础，通俗的解释一下。我们访问网站大多数使用的都是浏览器，通过在地址栏里面写下域名，按下回车就可以访问到我们想要访问的网站，那么这个具体的过程肯定不是那么简单，我们在地址栏中写下网址以后，按下回车，这个时候浏览器首先会访问自己所在的电脑上的host文件，查看host文件中是否记录有我们在地址栏中输入的域名，如果有，则找到与之对应的ip，访问去了。如果没有，它就要去到一个叫做dns的系统中，这个dns是存在于公网中的，他的作用就是保存许多域名和ip(真实的dns系统比这个复杂的多，这里只是方便理解简述一下)，他找到dns以后，把域名告诉dns,让dns去查一下，看看有没有与之对应的ip，如果查到了，就会拿着ip去找那个网站去了！！这里说一下，ip实际上可以理解为地址，是我们存放程序时候标记的地址。域名只是为了帮助我们更好的记住，实际上真正要找到网站还是要靠ip。

　　到此为止，我们已经找到了与这个ip对应的服务器，那么接下来解释两者互相对话啦，浏览器告诉服务器我要看首页，服务器回答好，然后把首页交给浏览器，去看吧！！这里我打了一个比方，事实上这个过程都是建立在网络通讯协议上的，其中有一个最常用的就是http协议，浏览器与服务器之间一切交流都是建立在这个协议之上的，这里我简单的讲一下这个协议吧，http协议分为两部分，分别是请求部分和响应部分，请求部分是又浏览器发出的，服务器接受到以后读取协议内容，然后发出响应，浏览器接受到响应的内容，并把它展示到电脑上。http协议中的请求部分分为请求行，请求头信息，请求消息体三部分，请求行包括我们想要访问的域名，协议等级，请求消息头包括具体访问的文件，连接长度，浏览器内核信息等，消息体则是浏览器发送给服务器上的具体数据，这个数据只有在发送方式为post的情况才会出现在消息体上，如果是get方式，则出现在地址栏中。服务器收到相关请求以后，开始分析具体要干什么，然后去执行，执行完成以后吧数据全部返回，相应部分就不详细说明了。

　　还要注意一件事情，那就是服务器收到请求以后做的事情是如何完成的，我以PHP程序为例。假如服务器收到请求需要访问网站首页，那么首先就会去调取后台对应的首页文件，然后开始解析这个文件，解析的过程中，PHP就发挥作用了，比如说，页面中的数据都是依靠它来进去读取的，假如首页中有一块地方需要展示出今天的最新新闻，那么PHP就会调用相关程序，然后去访问数据库，把对应的数据从数据库中取出来，然后展示到页面中，以此类推，其他的的数据都是这样搞出来的。当然了，PHP还会做很多其他事情啊，比如判断登录状态，检测ip之类的，最后当PHP把所有要做的事情都做完以后，最后就是把处理好的文件返回给浏览器了，这里注意一下，服务返回给浏览器的其实就是已经生成好的静态页面了，里面没有一行后台代码，浏览器接收到这个返回到数据，然后开始逐行解析，最后展示给我们看。

　　以上就是前后台交互流程。至于Js与后台交互，说白了，就是依靠js像后台发送数据,然后接受服务器返回的数据就是了。这里要说到一个技术就是ajax,其实整体的流程都是一样的，我们通过js的事件触发ajax，像服务器发送相关数据，服务器得到数据，处理完成以后返回给我们对应的数据，js可以获取到这个数据，然后该怎么处理就怎么处理，这个和我们上面说的流程基本一样，区别就是通过 js发送请求可以达到无刷新的效果，正常我们访问一个页面，服务器都是整个页面的返回给我们，如果是通过ajax的话，只会返回我们想要的数据，这样，是不会刷新页面的，加快了速度，减少流量的浪费，还有很多好处的，不多说了。（如果不了解ajax,那么可能需要首先学习下ajax哦！！）

　　这篇文章没有一句代码，说的也不是很专业，只能作为入门来了解，有问题的地方，请大家多多指教！