一、http
- HTTP:超文本传输协议,是一个请求响应的协议,是无状态的协议。指定了客户端可能发送给服务器什么样的消息以及得到什么样的响应。规定了请求和响应过程中的约定。
- 请求:
请求报文的内容包括三部分:请求行,请求头,请求体,(里面放的是信息)
响应:
响应报文的内容包括三部分:响应行,响应头,响应体,(里面放的是信息)
2.1 常见状态码:
200 ok 响应成功
400:客户端请求有语法错误
401:请求未经授权
报头域一起使用**
403 Forbidden //服务器收到请求,但是拒绝提供服务
404 Not Found //请求资源不存在,输入了错误的URL
500 Internal Server Error //服务器发生不可预期的错误
503 Server Unavailable //服务器当前不能处理客户端的请 求,一段时间后可能恢复正常
3.url地址:
http://host:port/abs path?
host 主机名 ;port 端口号; abs_path主机上的资源 路径
?后面是get请求方式的参数
二、cookie
- cookie的概念:是浏览器的一种机制,它是将document对象的cookie属性提供给js;可以由js封装使用;
- cookie是存于用户硬盘的一个文件,这个文件对应一个域名,cookie可以跨越一个域名下的多个网页,但不能跨越多个域名使用。
cookie是存储于访问者的计算机的变量。每当计算机通过浏览器请求某个页面,就会发送cookie。可以使用 js 创建cookie和获取它的值;
3. cookie作用
1、服务器用来识别客户端,客户端使用cookie,服务器端使用session
具体过程:当浏览器首次发送请求时,服务端会产生一个唯一的编号(sessionId)。响应时,把编号(sessionId)发给浏览器端,浏览器端把接收到sessionId保存在cookie里。下次请求时,把sessionId携带上。服务器根据携带的sessionId,就能区分不同的客户端。 - 保存数据
cookie 可以在客户端保存数据
cookie 会把数据保存浏览器端的硬盘上 - cookie的使用场景
一周免登录、历史浏览记录、自动识别比如密码
电话号码
# cookie的代码部分
document.cookie= "jian=zhi;expires=失效时间;path=允许访问cookie的文件路径 ;domain=允许该cookie的域名''
cookie参数的详细解释
1、键=值 : 保存在cookie里的数据,键是表示唯一性的
2、expires=失效时间点:表示cookie在什么时间点失效。这是GMT格式的日期字符串。默认情况是临时存储,会话级别(简单粗暴的理解为:打开网站到关掉网站),会话结束后,就失效了
3、path=允许访问该cookie的文件的路径
3.1)、不设置path时(默认情况下),保存的cookie只有当前路径(保存cookie的html文件所在的路径)下的html文件,及其当前路径的子路径下的html文件可以使用,当前路径的父路径,兄弟路径不能拿到的
3.2)、设置path后,在path所设置的路径及其子路径下的html文件都可以访问。
如: path=/ 表示根目录及其子目录可以访问(其实就是整个网站)
如: path=/abc 表示网站根目录下的abc目录及其子目录可以访问
4、domain=允许访问该cookie的域名
如:domain=“www.163.com”;表示保存的cookie可以被www.163.com里的网页读取。
4. 删除cookie
cookie没法直接删除,可以通过设置失效时间删除。如设置过去的时间,
5、封装cookie(摘抄的)
// 保存cookie
// 参数:
// 键
// 值
// 有效期(单位:天)
// 可以访问的路径
// 可以访问的域名
// 返回值:无
function saveCookie(key,value,dayCount,path,domain){
let d = new Date();
d.setDate(d.getDate()+dayCount);
// document.cookie= `${key}=${value};expires=${d.toGMTString()}`;
let str = `${key}=${escape(value)};expires=${d.toGMTString()}`;
// path&&(str+=`path=${path};`);
if(path){
str+=`path=${path};`
}
if(domain){
str+=`domain=${domain};`
}
document.cookie= str;
}
// 获取cookie:根据键获取值
// 参数
// 键
// 返回值:键对应的值;
function getCookie(key){
let str = unescape(document.cookie);
let arr = str.split("; "); //["username=jzm","city=西安","userpass=123"]
for(let i in arr){
if(arr[i].split("=")[0]==key){
return arr[i].split("=")[1];
}
}
return null;
}
// 删除cookie
// 参数:
// 键
// 返回值:无
function removeCookie(key){
saveCookie(key,"byebye",-1)
}
注意:
如果有中文问题(以前的浏览器),使用encodeURIComponent进行编码(URI的编码),使用decodeURIComponent进行解码。
如:
let str=“渠 博”;
let result =encodeURIComponent(str);
console.log(result);//E6%B8%A0%20%E5%8D%9A
console.log(decodeURIComponent(result));//
6. cookie的特点
1、生命周期:
cookie 不设置生命周期,临时存储于内存;是会话级别的,会话结束后失效,设置失效时间,有效期到了,失效
2、cookie的数据每次都会发送给服务器端,占用了网络流量
3、安全性:cookie会随着HTTP Header发送到服务端,不安全,容易被截获。
4、cookie 大小4kb,只能保存字符串
5、cookie设置了有效期,保存在硬盘上
localStorage:的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据,否则数据永远不会消失。
sessionStorage:仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念,sessionStorage是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭,即使刷新页面或者进入同源另一个页面,数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面,sessionStorage也是不一样的。
7、XSS攻击(摘抄借鉴)
1)、概念:
XSS攻击,是跨站脚本攻击(Cross Site Scripting)。通常指的是通过利用网页开发时留下的漏洞,通过巧妙的方法注入恶意指令代码到网页,使用户加载并执行攻击者恶意制造的网页程序。这些恶意网页程序通常是JavaScript,但实际上也可以包括Java、 VBScript、ActiveX、 Flash 或者甚至是普通的HTML。攻击成功后,攻击者可能得到包括但不限于更高的权限(如执行一些操作)、私密网页内容、会话和cookie等各种内容。
2)、原理:
通过将一些字符特殊地对待来区别文本和标记,例如,小于符号(<)被看作是HTML标签的开始,
3)、防止XSS攻击
<style>
#box{
width: 300px;
height: 400px;
border:1px solid black;
}
</style>
<body>
<div id="box">
</div>
<input id="txt" type="text" style="width: 800px"><br/>
<input type="button" value="留言" onclick="send()">
</body>
</html>
<script>
function send(){
// $("box").innerHTML += $("txt").value+"<br/>"
// 如何防止
let str = $("txt").value;
str = str.replace(/</g,"<");
str = str.replace(/>/g,">");
console.log("str",str);
$("box").innerHTML += str;
}
</script>