mirror of
https://github.com/zhwei820/learn.lianglianglee.com.git
synced 2025-09-17 08:46:40 +08:00
813 lines
21 KiB
HTML
813 lines
21 KiB
HTML
<!DOCTYPE html>
|
||
|
||
<!-- saved from url=(0046)https://kaiiiz.github.io/hexo-theme-book-demo/ -->
|
||
|
||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
|
||
<head>
|
||
|
||
<head>
|
||
|
||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
|
||
|
||
<link rel="icon" href="/static/favicon.png">
|
||
|
||
<title>18 我都这么成功了,你却说我不行 - HTTP 的特点和缺点.md.html</title>
|
||
|
||
<!-- Spectre.css framework -->
|
||
|
||
<link rel="stylesheet" href="/static/index.css">
|
||
|
||
<!-- theme css & js -->
|
||
|
||
<meta name="generator" content="Hexo 4.2.0">
|
||
|
||
</head>
|
||
|
||
|
||
|
||
<body>
|
||
|
||
|
||
|
||
<div class="book-container">
|
||
|
||
<div class="book-sidebar">
|
||
|
||
<div class="book-brand">
|
||
|
||
<a href="/">
|
||
|
||
<img src="/static/favicon.png">
|
||
|
||
<span>技术文章摘抄</span>
|
||
|
||
</a>
|
||
|
||
</div>
|
||
|
||
<div class="book-menu uncollapsible">
|
||
|
||
<ul class="uncollapsible">
|
||
|
||
<li><a href="/" class="current-tab">首页</a></li>
|
||
|
||
</ul>
|
||
|
||
|
||
|
||
<ul class="uncollapsible">
|
||
|
||
<li><a href="../">上一级</a></li>
|
||
|
||
</ul>
|
||
|
||
|
||
|
||
<ul class="uncollapsible">
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/01 我应该站在谁的肩膀上 - OSI vs TCPIP模型.md.html">01 我应该站在谁的肩膀上 - OSI vs TCPIP模型.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/02 万丈高楼平地起- 物理层 + 数据链路层.md.html">02 万丈高楼平地起- 物理层 + 数据链路层.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/03 OSI的灵魂就是我 - 网络层.md.html">03 OSI的灵魂就是我 - 网络层.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/04 要快还是要稳你说好了 - 传输层.md.html">04 要快还是要稳你说好了 - 传输层.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/05 是时候展现真正的技术了 - 应用层.md.html">05 是时候展现真正的技术了 - 应用层.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/06 重回小学课堂 - 二进制101.md.html">06 重回小学课堂 - 二进制101.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/07 1+1 = 2吗? - 二进制的计算.md.html">07 1+1 = 2吗? - 二进制的计算.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/08 16进制又是个什么鬼? - 16进制的讲解.md.html">08 16进制又是个什么鬼? - 16进制的讲解.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/09 我想有个家 - 什么是IP地址.md.html">09 我想有个家 - 什么是IP地址.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/10 我可是住二环的人 - IP地址的组成和分类.md.html">10 我可是住二环的人 - IP地址的组成和分类.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/11 我已经没地方住了吗 - IPv6.md.html">11 我已经没地方住了吗 - IPv6.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/12 向左还是向右 - IP路由.md.html">12 向左还是向右 - IP路由.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/13 我能给你安全感 - TCP(一).md.html">13 我能给你安全感 - TCP(一).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/14 我那不为人知的秘密是什么 - TCP(二).md.html">14 我那不为人知的秘密是什么 - TCP(二).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/15 不问收没收到,就问快不快 - UDP.md.html">15 不问收没收到,就问快不快 - UDP.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/16 我为什么与众不同 - TCP高级篇(拥塞模型).md.html">16 我为什么与众不同 - TCP高级篇(拥塞模型).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/17 来,先看看我的家谱 - HTTP的身世.md.html">17 来,先看看我的家谱 - HTTP的身世.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
<a class="current-tab" href="/专栏/全解网络协议/18 我都这么成功了,你却说我不行 - HTTP 的特点和缺点.md.html">18 我都这么成功了,你却说我不行 - HTTP 的特点和缺点.md.html</a>
|
||
|
||
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/19 我老了,让我儿子来吧 - HTTP2.md.html">19 我老了,让我儿子来吧 - HTTP2.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/20 稳重的大外甥 - HTTPS.md.html">20 稳重的大外甥 - HTTPS.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/21 HTTP的高级篇 - HTTPClient(Java).md.html">21 HTTP的高级篇 - HTTPClient(Java).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/22 想来我家,你自己查呀 - DNS.md.html">22 想来我家,你自己查呀 - DNS.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/23 来的早,不如来得巧 - NAT.md.html">23 来的早,不如来得巧 - NAT.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/24 辛苦的邮政 - SMTP.md.html">24 辛苦的邮政 - SMTP.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/25 你就是看不见我 - VPN.md.html">25 你就是看不见我 - VPN.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/26 黑客的好帮手 - SSH.md.html">26 黑客的好帮手 - SSH.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/27 你可以得到我的心,却得不到我的人 - 物理安全设备.md.html">27 你可以得到我的心,却得不到我的人 - 物理安全设备.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/28 你怎么证明你就是你 - 身份验证和访问控制.md.html">28 你怎么证明你就是你 - 身份验证和访问控制.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/29 我要怎么藏好我的考研资料 - 网络攻击(一).md.html">29 我要怎么藏好我的考研资料 - 网络攻击(一).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/30 我要怎么藏好我的考研资料 - 网络攻击(二).md.html">30 我要怎么藏好我的考研资料 - 网络攻击(二).md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/31 如何保护我的考研资料 - 网络攻击防范.md.html">31 如何保护我的考研资料 - 网络攻击防范.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/32 Linux网络安全 - 安全实战.md.html">32 Linux网络安全 - 安全实战.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
<li>
|
||
|
||
|
||
|
||
|
||
|
||
<a href="/专栏/全解网络协议/33 结语.md.html">33 结语.md.html</a>
|
||
|
||
|
||
|
||
</li>
|
||
|
||
</ul>
|
||
|
||
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<div class="sidebar-toggle" onclick="sidebar_toggle()" onmouseover="add_inner()" onmouseleave="remove_inner()">
|
||
|
||
<div class="sidebar-toggle-inner"></div>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<script>
|
||
|
||
function add_inner() {
|
||
|
||
let inner = document.querySelector('.sidebar-toggle-inner')
|
||
|
||
inner.classList.add('show')
|
||
|
||
}
|
||
|
||
|
||
|
||
function remove_inner() {
|
||
|
||
let inner = document.querySelector('.sidebar-toggle-inner')
|
||
|
||
inner.classList.remove('show')
|
||
|
||
}
|
||
|
||
|
||
|
||
function sidebar_toggle() {
|
||
|
||
let sidebar_toggle = document.querySelector('.sidebar-toggle')
|
||
|
||
let sidebar = document.querySelector('.book-sidebar')
|
||
|
||
let content = document.querySelector('.off-canvas-content')
|
||
|
||
if (sidebar_toggle.classList.contains('extend')) { // show
|
||
|
||
sidebar_toggle.classList.remove('extend')
|
||
|
||
sidebar.classList.remove('hide')
|
||
|
||
content.classList.remove('extend')
|
||
|
||
} else { // hide
|
||
|
||
sidebar_toggle.classList.add('extend')
|
||
|
||
sidebar.classList.add('hide')
|
||
|
||
content.classList.add('extend')
|
||
|
||
}
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
function open_sidebar() {
|
||
|
||
let sidebar = document.querySelector('.book-sidebar')
|
||
|
||
let overlay = document.querySelector('.off-canvas-overlay')
|
||
|
||
sidebar.classList.add('show')
|
||
|
||
overlay.classList.add('show')
|
||
|
||
}
|
||
|
||
function hide_canvas() {
|
||
|
||
let sidebar = document.querySelector('.book-sidebar')
|
||
|
||
let overlay = document.querySelector('.off-canvas-overlay')
|
||
|
||
sidebar.classList.remove('show')
|
||
|
||
overlay.classList.remove('show')
|
||
|
||
}
|
||
|
||
|
||
|
||
</script>
|
||
|
||
|
||
|
||
<div class="off-canvas-content">
|
||
|
||
<div class="columns">
|
||
|
||
<div class="column col-12 col-lg-12">
|
||
|
||
<div class="book-navbar">
|
||
|
||
<!-- For Responsive Layout -->
|
||
|
||
<header class="navbar">
|
||
|
||
<section class="navbar-section">
|
||
|
||
<a onclick="open_sidebar()">
|
||
|
||
<i class="icon icon-menu"></i>
|
||
|
||
</a>
|
||
|
||
</section>
|
||
|
||
</header>
|
||
|
||
</div>
|
||
|
||
<div class="book-content" style="max-width: 960px; margin: 0 auto;
|
||
|
||
overflow-x: auto;
|
||
|
||
overflow-y: hidden;">
|
||
|
||
<div class="book-post">
|
||
|
||
<p id="tip" align="center"></p>
|
||
|
||
<div><h1>18 我都这么成功了,你却说我不行 - HTTP 的特点和缺点</h1>
|
||
|
||
<p>上一小节我们做了这个关于HTTP的介绍。那我们今天来看一下, 到底HTTP有什么缺点, 我们必须要把这个功不可没的元老换掉呢。</p>
|
||
|
||
<h3>队头阻塞(Head-of-line blocking) :</h3>
|
||
|
||
<p>你想这么一个场景呀。客户发了Data1,回复收到,然后发了Data2, 但是丢了, 客户端这边不会等呀, 继续发Data3,但是server这边收到了Data3,却没有Data2,就苦苦的等呀等。直到收到了Data2,发ack2给客户端, 才会继续。所以在server这边,这个就会增加时间。也就是不能给他的应用层发送任何消息,直到排好序。请求好像瀑布模式,之前的请求会阻拦后面的请求。</p>
|
||
|
||
<p>HTTP1.1还记得吗,在持久连接的基础上,进一步地支持在持久连接上使用管道化(pipelining)特性。管道化允许客户端在已发送的请求收到服务端的响应之前发送下一个请求,借此来减少等待时间提高吞吐。如果多个请求能在同一个TCP请求发送的话,还能提高网络利用率。但是因为HTTP管道化本身可能会导致队头阻塞的问题,以及一些其他的原因,现代浏览器默认都关闭了管道化。</p>
|
||
|
||
<h3>流量控制 Flow control</h3>
|
||
|
||
<p>另一个TCP影响HTTP的问题是Flow control也就是流量控制,用于处理拥塞。如果有两台挨着的电脑连接100m的网,可以开始传送100m来回,没有任何问题。如果这个服务器不能处理100m就要降到50m,但是如果提前知道,这个也没问题,我们可以设置成50m。但是现实世界是,我们没有两个互联的电脑对吧。成千上万的电脑,路由,交换器以及各种机器。每一个机器都有他自己的限制。如果一开始设置一个特别高的速率的话,会造成拥挤, 阻塞网络。如果速率低的话,又会没有效率,TCP处理的方法就是流量控制flow control(就是我们TCP章节讲解的拥塞机制),意思就是可以根据网络的反应来不断的条件传输速率,TCP的实现方法是慢启动, 选一个很小的window size,然后增加。如果开始产生不良反应,降低。这个慢启动会影响所有TCP连接和每一个http请求。所以TCP为了保证可靠并且能够处理拥塞。TCP给HTTP带来了一系列的影响也就是延迟。终于我们的主角HTTP2该出来拯救世界了? 还没有. 主角上场之前, 都会有很多其他的小罗罗对吧。</p>
|
||
|
||
<p>SPDY就是这样一个产物</p>
|
||
|
||
<h3>SPYD</h3>
|
||
|
||
<p><img src="assets/20210219113630838.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>2012年Google如一声惊雷一样提出了SPDY的方案,优化了HTTP1.X的请求延迟,解决了HTTP1.X的安全性,具体如下:</p>
|
||
|
||
<ol>
|
||
|
||
<li>降低延迟,针对HTTP高延迟的问题,SPDY优雅的采取了多路复用(multiplexing)。多路复用通过多个请求stream共享一个TCP连接的方式,解决了HOL blocking的问题,降低了延迟同时提高了带宽的利用率。</li>
|
||
|
||
<li>请求优先级(request prioritization)。多路复用带来一个新的问题是,在连接共享的基础之上有可能会导致关键请求被阻塞。SPDY允许给每个request设置优先级,这样重要的请求就会优先得到响应。比如浏览器加载首页,首页的html内容应该优先展示,之后才是各种静态资源文件,脚本文件等加载,这样可以保证用户能第一时间看到网页内容。</li>
|
||
|
||
<li>Header压缩。前面提到HTTP1.x的header很多时候都是重复多余的。选择合适的压缩算法可以减小包的大小和数量。</li>
|
||
|
||
<li>基于HTTPS的加密协议传输,大大提高了传输数据的可靠性。</li>
|
||
|
||
<li>服务端推送(server push),采用了SPDY的网页,例如我的网页有一个sytle.css的请求,在客户端收到sytle.css数据的同时,服务端会将sytle.js的文件推送给客户端,当客户端再次尝试获取sytle.js时就可以直接从缓存中获取到,不用再发请求了。</li>
|
||
|
||
</ol>
|
||
|
||
<p>SPDY构成图</p>
|
||
|
||
<p><img src="assets/20210219113653326.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>但是大佬们能让你Google独大吗, 于是基于SPDY发表了升级版也就是我们的HTTP2。 HTTP2.0和SPDY的区别</p>
|
||
|
||
<ul>
|
||
|
||
<li>HTTP2.0 支持明文HTTP传输,而SPDY强制使用HTTPS</li>
|
||
|
||
<li>HTTP2.0 消息头的压缩算法采用HPACK而非SPDY采用的DEFLATE - http://zh.wikipedia.org/wiki/DEFLATE。</li>
|
||
|
||
</ul>
|
||
|
||
<p>Http2是一个二进制协议。二进制肯定比这个文本要好传输呀。它呢保持Http1.1里面的所有语义,比如Http1.x里面定义的所有头文件,资源等等。所有的工作都是用来解决Http1的缺点。如果通俗的讲,Http2是关于什么的?, 它是关于performance的。</p>
|
||
|
||
<p>下面说一个小的知识点呀</p>
|
||
|
||
<p><img src="assets/20210219113711326.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>你知道SPDY,这个是google自己研发的解决http1.x的效率问题的协议对不对。后来Http2就出来了,Google就放弃使用SPDY了,是一个类似但是不一样的协议呀,现在这个协议已经不用了,Chrome在2016年就已经不用了。http2是15年正式发布的。</p>
|
||
|
||
<p><img src="assets/20210219113725242.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>从上图,你可以查看浏览器的哪个版本支持HTTP2。你仔细看一下,基本已经都支持了,很多网站也都声称实现了Http2。</p>
|
||
|
||
<h3>HTTP2</h3>
|
||
|
||
<p>我们来深入看一下Http2。</p>
|
||
|
||
<p>Http1.1中,使用明文发送请求,拿到回复</p>
|
||
|
||
<p><img src="assets/20210219113741507.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>HTTP2中可以看出,使用的是二进制,但是内容必须和http1.1包含的内容是一样的,Verb(请求方法,知道有几种吗?9种,分别是GET,HEAD,POST,PUT,DELETE,CONNECT,OPTIONS,TRACE,PATCH),Resource(资源)以及其他的头文件等等。同样回复中也包含相同的内容,唯一的区别就是从明文变成了二进制。Http2和http1.1是不兼容的。但是我们需要Http2可以在现在的www的架构上运行,我们不可能把几十年创建的架构, 网络全部重建。如果Http2不能在现有的url上工作,那就是一场噩梦呀。所以这就是Http2必须能在http1的基础上工作。</p>
|
||
|
||
<p><img src="assets/20210219113756872.png" alt="在这里插入图片描述" /></p>
|
||
|
||
<p>为了在Http2使用明文, 客户端需要发一个升级请求包含在头信息-> h2c。如果服务器支持http2,它会返回101表示换协议。返回信息,升级h2c。如果服务器不支持连接升级,会返回200或者404的状态码。</p>
|
||
|
||
<p>Frame(桢) 是HTTP2.0 通信的最小单位,每个帧包含帧首部,至少也会标识出当前帧所属的流。</p>
|
||
|
||
<p>流->已建立的连接上的双向字节流。</p>
|
||
|
||
<p>• 消息-> 与逻辑消息对应的完整的一系列数据帧。</p>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div>
|
||
|
||
<div style="float: left">
|
||
|
||
<a href="/专栏/全解网络协议/17 来,先看看我的家谱 - HTTP的身世.md.html">上一页</a>
|
||
|
||
</div>
|
||
|
||
<div style="float: right">
|
||
|
||
<a href="/专栏/全解网络协议/19 我老了,让我儿子来吧 - HTTP2.md.html">下一页</a>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
|
||
|
||
<a class="off-canvas-overlay" onclick="hide_canvas()"></a>
|
||
|
||
</div>
|
||
|
||
<script defer src="https://static.cloudflareinsights.com/beacon.min.js/v652eace1692a40cfa3763df669d7439c1639079717194" integrity="sha512-Gi7xpJR8tSkrpF7aordPZQlW2DLtzUlZcumS8dMQjwDHEnw9I7ZLyiOj/6tZStRBGtGgN6ceN6cMH8z7etPGlw==" data-cf-beacon='{"rayId":"709976442ced3cfa","version":"2021.12.0","r":1,"token":"1f5d475227ce4f0089a7cff1ab17c0f5","si":100}' crossorigin="anonymous"></script>
|
||
|
||
</body>
|
||
|
||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||
|
||
<script async src="https://www.googletagmanager.com/gtag/js?id=G-NPSEEVD756"></script>
|
||
|
||
<script>
|
||
|
||
window.dataLayer = window.dataLayer || [];
|
||
|
||
|
||
|
||
function gtag() {
|
||
|
||
dataLayer.push(arguments);
|
||
|
||
}
|
||
|
||
|
||
|
||
gtag('js', new Date());
|
||
|
||
gtag('config', 'G-NPSEEVD756');
|
||
|
||
var path = window.location.pathname
|
||
|
||
var cookie = getCookie("lastPath");
|
||
|
||
console.log(path)
|
||
|
||
if (path.replace("/", "") === "") {
|
||
|
||
if (cookie.replace("/", "") !== "") {
|
||
|
||
console.log(cookie)
|
||
|
||
document.getElementById("tip").innerHTML = "<a href='" + cookie + "'>跳转到上次进度</a>"
|
||
|
||
}
|
||
|
||
} else {
|
||
|
||
setCookie("lastPath", path)
|
||
|
||
}
|
||
|
||
|
||
|
||
function setCookie(cname, cvalue) {
|
||
|
||
var d = new Date();
|
||
|
||
d.setTime(d.getTime() + (180 * 24 * 60 * 60 * 1000));
|
||
|
||
var expires = "expires=" + d.toGMTString();
|
||
|
||
document.cookie = cname + "=" + cvalue + "; " + expires + ";path = /";
|
||
|
||
}
|
||
|
||
|
||
|
||
function getCookie(cname) {
|
||
|
||
var name = cname + "=";
|
||
|
||
var ca = document.cookie.split(';');
|
||
|
||
for (var i = 0; i < ca.length; i++) {
|
||
|
||
var c = ca[i].trim();
|
||
|
||
if (c.indexOf(name) === 0) return c.substring(name.length, c.length);
|
||
|
||
}
|
||
|
||
return "";
|
||
|
||
}
|
||
|
||
|
||
|
||
</script>
|
||
|
||
|
||
|
||
</html>
|
||
|