ajax+客户端与服务器端的交互

一. AJAX

原生JS

var xhr=new XMLHttpRequest();

xhr.open("GET","[请求地址]",false);

xhr.onreadystatechange=function(){

    if(xhr,readystate===4 && xhr.status==200){

    }

}

xhr.send(null);

$.ajax({

    url:"",

    method:"",

    dataType:"json",

    async:true,

    data:null,

    success:function(){}

})

二. 客户端和服务器端的交互

使用js完成客户端程序编写,使用node.js完成服务器端程序的编写

DOS命令:通过一系列命令进行I/O操作
- I/O:input/output 输入输出,对文件或者文件夹的增删改查
  - 创建的内容有些时候存储在内存中,有些时候存储在物理磁盘下
- 打开DOS命令
  - 在当前用户的默认路径下打开:WIN+R->cmd(运行窗口)
  - 在指定的文件目录中打开DOS:
    1. 找到指定的文件目录,在空白处,shift+鼠标右键->在此处打开DOS命令
    2. 找到指定的文件目录,在地址栏中输入cmd,也可以快速在当前目录下打开DOS窗口
    3. 现在默认路径下打开,然后输入磁盘:,进入到指定的磁盘,然后再输入cd(把需要进入的文件目录拖拽到命令框中)->这样也可以进入
- 常用的DOS命令
  - 查看自己电脑的IP地址以及DNS等信息
    - ipconfig:查看简单的信息 IP地址/子网掩码/默认网关
    - ipconfig -all:基于简单的基础上可以看到更为详细, 物理地址(MAC地址)/DNS等信息
    - ping www.baidu.com:查看网络窗口
    - CTRL+C不管按一次还是两次能结束当前正在进行的命令操作结束
    - 在当前窗口不关闭的情况下,按上下键可以切换之前已经输入的命令
    - cls:清屏
    - exit:退出关闭窗口
    - cd 文件目录:进入到指定的文件目录
    - dir(linux:ls):查看当前目录下所有的文件及文件目录
      - /a:显示所有的文件和文件夹,包括隐藏的
    - 创建和删除文件夹
      - mkdir+文件夹名:创建文件夹
      - rmdir+文件夹名:删除文件夹
    - 创建和删除文件
      - copy con xxx.xx->按enter开始输入内容->内容输入完成按Ctrl+z,然后再按enter键
      - del xxx.xx->删除某一个文件
面试题
- 当你在浏览器的地址栏中输入一个网站,到浏览器中看到京东商城这个网页中的内容,中间都经历了哪些事情
  - 客户端和服务器端的交互模型"HTTP事务"
    - Request请求阶段
      1. 客户端首先通过域名,到DNS服务器上,找到服务器对应的外网IP地址
      2. 通过外网IP地址,找到对应的项目服务器
      3. 通过端口号,在服务上找到对应的项目资源文件目录(因为发布项目的时候,已经把项目目录和项目端口号对应了)
    - Response响应阶段
      1. 服务器端会把客户端需要请求的资源文件的"源代码",返回给客户端的浏览器
      2. 客户端浏览器接收到返回内容后,开始进行渲染和解析
网站发布
- 租一台服务器(阿里云:主机/虚拟服务器),给服务器连接网络,连接网络后,服务器有一个外网IP地址(别人通过外网IP可以找到服务器)
- 买域名(域名备案)
- 把我们项目的源代码,上传到服务器的指定磁盘下=>ftp上传:把本地资源文件上传到服务器的指定位置下(一般都会有FTP上传工具:fileZilla)
- 发布网站/发挥项目,一台服务器可以发挥很多的项目,多个项目之间使用端口进行区分
  - 工具:iis,apache,nginx,node..
- 域名解析(DNS解析):把我们购买的域名和服务器的外网IP关联在一起,以后只要提到这个域名,其实指的就是对于的服务器
一个完整的URI:https://www.baidu.com:443/xxx/xxx.html?name=zf&age=8#video
- URI:统一资源标识符
- URL:统一资源定位符
- URN:统一资源名称
- URI=URL+URN
- 上述的一个完整的URI可以分6部分,前3部分为URL,后3部分为URN
  1. HTTP/HTTPS/FTP:传输协议
    - 浏览器默认使用HTTP,但网站可以进行重定向使用HTTPS
    - HTTP:超文本传输协议(占据90%市场),客户端和服务器端除了传输文本以外,还可以传输图片,音视频等富媒体资源(二进制文件流/BASE64...)
    - HTTPS:传输通道经过SSL加密HTTP,基本和金钱打交道的网站都是HTTPS传输协议的
    - FTP:资源文件传输协议,经常应用于对服务器资源文件的管理(上传和下载...)
  2. 域名
    - 一级域名:www.qq.com
      - 需要购买的,二级三级域名只需要自己去分配即可
    - 二级域名:sport.qq.com
    - 三级域名:kbs.sport.qq.com
  3. 端口号
    - 80:HTTP默认
    - 443:HTTPS默认
    - 21:FTP默认
    - 端口号的取值范围:0-65535之间,端口号被一个项目/程序占用,其它的程序就不能在使用这个端口号了
  4. 请求资源文件的路径和名称
    - /student/index.html 请求的是当前项目student文件夹下的index.html文件
    - /index.html 请求的是当前项目根目录下的index.html文件,在不指定请求文件的时候,默认请求的资源文件一般都是/index.html或者/default.html(可以在服务器中配置默认的请求文件)
  5. 问号传参
    - ?xxx.xxx&xxx=xxx...
    - 客户端可以通过问号传递参数的方式,把一些信息传递给服务器端
    - 在从列表页面跳转到详情页面的时候,点击列表页面中的每一条记录,都会跳转到指定的详情页面,详情页面展示的内容是不一样的
      - 但是详情页面都是同一个页面,想要展示不一样的内容,就需要区分点击的是那一条记录,此时我们通过问号传参的方式进行
      - 在详情页面我们获取传递的参数值,根据mid值得不一样,从服务器获取不同的数据展示即可
  6. 哈希值(HASH)
    - #video
    - 客户端也可以通过这种方式把信息传递给服务器(一般不用)
    - 锚点定位
    - 通过哈希值实现页面的路由切换

巴特西

ajax+客户端与服务器端的交互

一. AJAX

二. 客户端和服务器端的交互

最新文章

热门文章