【AJAX】基础知识

AJAX优点

• 实现可以无需刷新页面的域服务器通信
• 允许根据用户时间来更新部分的页面内容

AJAX缺点

• 没有浏览历史，不能回退
• 存在跨域问题
• SEO不友好

请求报文

• 格式

  请求行       请求类型(GET/PUSH 等)  URL路径  HTTP协议版本 
  请求头       Host: xxx.com
                Cookie: name=xxx
                Content-type: application/x-www-from-urlencoded
                ....
                
  请求空行 不一定有空行
  请求体       GET请求的请求体为空，POST不为空
  

响应报文

• 格式

  响应行       HTTP协议版本  响应状态码  响应状态字符串
  响应头       Content-type: text/html;charser=utf-8
                Content-length: 2048
                Content-encoding: gzip
                
  响应空行 一定有空行
  响应体       
                    
                    
                     
                        
  xxx
                    
                
  

Express框架（基于nodejs）

1. 引入express

   const express = require("express")

2. 创建应用对象

   const app = express()
   

3. 创建路由规则

   app.get('/', (request, response)=>{
    //设置响应
    response.send('Hello Express')
   })
   

   • request是对请求报文的封装
   • response是对响应报文的封装

4. 监听端口

   app.listen(8080, ()=>{
    console.log("服务启动，端口8080")
   })
   

AJAX基本步骤

需求：在网页上有一个元素，还有一个按钮，点击按钮就会发送AJAX请求，更新元素

• GET.HTML

  点击发送请求