ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

AJAX请求报文

2021-04-08 22:30:21  阅读:144  来源: 互联网

标签:请求 Ctrl Shift 报文 xhr AJAX Command 响应


AJAX请求报文

#请求报文

行 GET/POST url="";HTTP/2.0
头 Host: baidu.com
Cookie: name=baidu
Content-type:application/x-www-form-urlencoded
User-Agent:chrome 89
空行
体(post可空可不空GET空格 )
eg:username=admin&password=admin

#响应报文

行 http/2.0(协议版本) 200(响应状态码) ok(响应状态字符串)
头 content-Type:text/html;charset=utf-8
content-length:2048(长度)
content-encoding:gzip(压缩方式)
空行
体(响应的主要结果)

	<html>
		<head>
		</head>
		<body>
		<h1>这是一段话</h1>
		</body>
	</html>

#相应响应状态码

*404找不到
*403 被禁止
*401 没有权限
*500 内部错误
*200 ok


先创建一个JS文件,引入express,node激活服务器

main.JS

//1.引入express
const express = require("express");
//创建应用对象
const app = express();
//3.创建路由规则
app.get("/server", (require, response) => {
  response.setHeader("Access-Control-Allow-Origin", "*");
  response.send("HELLO AJAX,你学会了吗");
});
//4.监听端口启动服务
app.listen(8000, () => {
  console.log("服务已经启动,8000端口监听中...请稍等");
});

创建一个HTML页面

#count{
    width: 200px;
    height: 200px;
    border: 1px s``olid #110df3;
}
<body>
    <button>点击尝试一下</button>
    <div id="count"></div>
    <script>
        const btn=document.getElementsByTagName('button')[0];
        const count=document.getElementById('count');
        btn.οnclick=function(){
           // 1.创建一个对象
            const xhr=new XMLHttpRequest();
            //2.初始化,设置请求方法和URL
            xhr.open('GET','http://127.0.0.1:8000/server');
            //3.发送
            xhr.send();
            //4.事件绑定,
            xhr.onreadystatechange=function(){
                if(xhr.readyState===4){
                    //判断响应结果
                    if(xhr.status>=200&&xhr.status<300){
                        // 1.响应行
                        console.log("状态码:"+xhr.status);
                        console.log("状态字符串:"+xhr.statusText);
                        console.log("获取所有的响应头:"+xhr.getAllResponseHeaders());
                        console.log("获取响应体:"+xhr.response);
                        count.innerHTML=xhr.response;
                    }else{

                    }
                }
            }
        }
    </script>
</body>

#快捷键

撤销:<kbd>Ctrl/Command</kbd> + <kbd>Z</kbd>
重做:<kbd>Ctrl/Command</kbd> + <kbd>Y</kbd>
加粗:<kbd>Ctrl/Command</kbd> + <kbd>B</kbd>
斜体:<kbd>Ctrl/Command</kbd> + <kbd>I</kbd>
标题:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>H</kbd>
无序列表:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>U</kbd>
有序列表:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>O</kbd>
检查列表:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>C</kbd>
插入代码:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>K</kbd>
插入链接:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd>
插入图片:<kbd>Ctrl/Command</kbd> + <kbd>Shift</kbd> + <kbd>G</kbd>
查找:<kbd>Ctrl/Command</kbd> + <kbd>F</kbd>
替换:<kbd>Ctrl/Command</kbd> + <kbd>G</kbd

在这里插入图片描述

标签:请求,Ctrl,Shift,报文,xhr,AJAX,Command,响应
来源: https://blog.csdn.net/weixin_45010901/article/details/115532228

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有