浏览器缓存

web浏览器会自动缓存访问过的页面，当访问同一个页面的请求时，浏览器不再从服务器中重新下载页面而是优先使用本地缓存中的页面 为什么要进行web缓存 从用户的角度来看web缓存加快了上网速度，当然这是用户主观认为的增加了上网速度，从设计者的角度来看： 1.网络带宽的限制，也就是说在单位时间内，用户从网络上获取的信息是有着上限的，这就限制了用户的上网速度，而缓存可以造成一种加快上网速度的假象； 2.缓存可以有效的减少网络冗余信息的传输，即同一个页面如果用户每个一段时间就刷新一次，服务器中的页面并没有发生变化，如果用户每刷新一次服务器就传送一个新的页面这就造成了数据的冗余； 3.缓存可以有效地削弱瞬间拥塞现象；瞬间拥塞可能造成整个网络和服务器的崩溃； 虽然缓存有着种种好处，但是缓存并不是简简单单地在本地存储一个页面，缓存首先要面对的一个现实问题即网络上有海量的页面，总不能都缓存吧；为了解决这个问题，提出了缓存命中的概念（缓存命中这个概念显然是一个舶来品）所谓的 缓存命中是指 当一个请求所需的页面在本地缓存中， 并且 经过检测缓存的页面并没有在服务器发生变化，浏览器将使用本地缓存的页面（缓存页面的再检测也称为缓存页面的保鲜度，当浏览器发现所需的页面在本地缓存中，为了确定页面是否是最新的页面时，浏览器将向服务器发送一个请求询问页面是否是最新的，最新的依据就是页面的最后修改时间

1.Cookie cookie是比较老的前端缓存技术了，它的特点是想要使用它前端必须要有服务（静态网页是不行的），而且存储大小限制在4kb。那么为什么必须要有服务才能使用cookie呢？因为只要有请求涉及cookie，cookie就要在服务器和浏览器之间来回传送，而且由于浏览器的跨域限制，客户端和服务端必须要保证同源的原则（也就是跨域问题，详情见我的其他文章），由于cookie是存放在前端的，所以安全问题一直是个大问题，因此一般重要的信息不建议放在cookie中存放。 2.Session 对于服务端的程序眼来说session大家肯定很熟悉了，session是一种服务端的机制，也就是能把信息存放在服务端，所以安全可以保障，它的原理是通过session id来识别客户端，这个session id是存放在cookie中的（当然session id让用户看见没无妨），服务端会通过session id来识别客户端进行匹配和判断。它和cookie对比起来差距就很明显了，一个是把数据存在客户端；一个存在服务端，从安全性考虑的话一般像用户名密码这种私密信息一般放在session中。 3.localStorage 它的特点就是“持久”，一旦通过保存，不通过手动清除的话，就会一直保存在前端，它的保存格式是键值对的方式也就是“key-value”的方式保存的，它的存储空间大小限制在500万字符左右

一、介绍 Scrapy一个开源和协作的框架，其最初是为了页面抓取 (更确切来说, 网络抓取 )所设计的，使用它可以以快速、简单、可扩展的方式从网站中提取所需的数据。但目前Scrapy的用途十分广泛，可用于如数据挖掘、监测和自动化测试等领域，也可以应用在获取API所返回的数据(例如 Amazon Associates Web Services ) 或者通用的网络爬虫。 Scrapy 是基于twisted框架开发而来，twisted是一个流行的事件驱动的python网络框架。因此Scrapy使用了一种非阻塞（又名异步）的代码来实现并发。整体架构大致如下 引擎(EGINE) 引擎负责控制系统所有组件之间的数据流，并在某些动作发生时触发事件。有关详细信息，请参见上面的数据流部分。 调度器(SCHEDULER) 用来接受引擎发过来的请求, 压入队列中, 并在引擎再次请求的时候返回. 可以想像成一个URL的优先级队列, 由它来决定下一个要抓取的网址是什么, 同时去除重复的网址 下载器(DOWLOADER) 用于下载网页内容, 并将网页内容返回给EGINE，下载器是建立在twisted这个高效的异步模型上的 爬虫(SPIDERS) SPIDERS是开发人员自定义的类，用来解析responses，并且提取items，或者发送新的请求 项目管道(ITEM PIPLINES)

概述 互联网应用发展到今天，从单体应用架构到SOA以及今天的微服务，随着微服务化的不断升级进化，服务和服务之间的稳定性变得越来越重要，分布式系统之所以复杂，主要原因是分布式系统需要考虑到网络的延时和不可靠，微服务很重要的一个特质就是需要保证服务幂等，保证幂等性很重要的前提需要分布式锁控制并发，同时缓存、降级和限流是保护微服务系统运行稳定性的三大利器。 随着业务不断的发展，按业务域的划分子系统越来越多，每个业务系统都需要缓存、限流、分布式锁、幂等工具组件，distributed-tools组件(暂未开源)正式包含了上述分布式系统所需要的基础功能组件。 distributed-tools组件基于tair、redis分别提供了2个springboot starter，使用起来非常简单。 以使用缓存使用redis为例，application.properties添加如下配置 redis.extend.hostName=127.0.0.1 redis.extend.port=6379 redis.extend.password=pwdcode redis.extend.timeout=10000 redis.idempotent.enabled=true 接下来的篇幅，重点会介绍一下缓存、限流、分布式锁、幂等的使用方式。 缓存 缓存的使用可以说无处不在，从应用请求的访问路径来看，用户user

这个系列的文章的第二篇，继续总结~~ 这是从一个问题上衍生出的知识体系，这个问题是 从输入URL到页面加载的过程 。 先梳理下这个流程 第一步 从浏览器接收url到开启网络请求线程（浏览器的进程/线程模型，js的运行机制） 浏览器的进程 浏览器是多进程的。有一个主进程，以及每一个tab页都会新开一个进程（某些情况下（比如空白tab）多个tab会合并成一个进程） 进程可能包括主进程，插件进程，GPU，tab页等等。 brower进程 主进程，负责协调，主控等 第三方插件进程 每种类型的插件都会有一个进程，仅当使用插件时才会创建。 GPU进程 只有一个，用于3d绘制 浏览器默认进程(内核) 每个tab页对应一个进程，负责页面渲染，脚本执行，互不影响，有时候会优化（多个空白tab会合并成一个） 浏览器的多线程内核 每个tab页可以看作浏览器的内核的进程，这个进程是多线程的，它有以下几大线程: GUI渲染线程 JavaScript线程(这就是为什么一直说JS是单线程的原因) 事件触发线程 定时器触发线程 网络请求线程 每次网络请求都需要开辟单独线程进行，如果url解析到http请求，就会新开线程去处理资源下载。（http2.0可以实现tcp连接复用） JS的运行机制 参考我的另一篇文章 js执行机制 事件循环 第二步 开启网络线程到发出一个完整的http请求（dns查询，tcp/IP请求

与 HTTP 协作的 Web 服务器 一台 Web 服务器可搭建多个独立域名的 Web 网站，也可作为通信路径上的中转服务器提升传输效率。 一. 用单台虚拟主机实现多个域名 HTTP/1.1 规范允许一台 HTTP 服务器搭建多个 Web 站点。比如，提供 Web 托管服务（Web Hosting Service）的供应商，可以用一台服务器为多位客户服务，也可以以每位客户持有的域名运行各自不同的网站。这是因为利用了虚拟主机（Virtual Host，又称虚拟服务器）的功能。即使物理层面只有一台服务器，但只要使用虚拟主机的功能，则可以假想已具有多台服务器。 2.图示：客户端使用 HTTP 协议访问服务器时，会经常采用类似 www.hackr.jp 这样的主机名和域名。 3.在互联网上，域名通过 DNS 服务映射到 IP 地址（域名解析）之后访问目标网站。可见，当请求发送到服务器时，已经是以 IP 地址形式访问了。 所以，如果一台服务器内托管了 www.tricorder.jp 和 www.hackr.jp 这 两个域名，当收到请求时就需要弄清楚究竟要访问哪个域名。 解决：在相同的 IP 地址下，由于虚拟主机可以寄存多个不同主机名和域名的 Web 网站，因此在发送 HTTP 请求时，必须在 Host 首部内完整指定主机名或域名的 URI。 二.通信数据转发程序 ：代理、网关、隧道

HTTP 1.0 在HTTP1.0中，可以在服务端设置 Expires 的HTTP头来告诉客户端在多久之后重新请求服务，可以通过 if-modified-since 的条件请求来使用缓存，其中发送时间是文件最初被下载的时间，而不是过期时间。如果文件没有改变，服务器可以响应 304-Not Modified 表示文件未改变，客户端可以继续使用缓存的文件。 HTTP1.0中服务器在返回时，可以通过在响应头中添加 Last-Modified 的方式表示资源上一次更改时间。请求时传递的 if-modified-since 值就是 Last-Modified 的值。但是这个时间仅仅只能代表编辑时间，如果文件内容没有变化，一样会修改这个时间，所以再次请求还是会重新加载资源，而不会使用缓存。 HTTP 1.1 引入了文件标签 e-tag ，e-tag 是文件或对象的唯一标识，也就是一个MD5值， e-tag 通过Response Heasers 返回。 e-tag 在使用时会结合 If-None-Match 搭配使用，当缓存过期时，浏览器会在请求头中设置 If-None-Match ,值服务端返回的e-tag值（MD5）,当文件未发生变化时，MD5值是不变的，此时服务端可以响应 304 状态码，浏览器继续使用本地缓存，如果返回200，则服务器返回新的文件和新的 e-tag 值。 HTTP1

零、前言 　　最近参与了一个立足 seo 的移动端项目，公司前端工程主栈 vue，所以理所当然的用上了 nuxt，UI 主要选择了 Vant。 一、公共列表页的缓存 　　公共列表页由于数据量较大，故需要滚动触发分次加载以模拟分页，当客户端加载到了一定页数之后(>= 2)，点击某条数据进去查看详情，然后返回列表页，这时候如果没有缓存的话，列表页会按照初始参数(即从分页 1 开始)发请求拉数据，并且丢失浏览位置。一方面，浪费请求资源，另一方面，用户体验不佳。因此，针对这两个问题，最后决定开启缓存。 　　vue 中的缓存直接使用 <keep-live> 组件即可，配合上 vue-router 中的 scrollBehavior 往往能比较容易地实现。当然这里容易有忽略：“scrollBehavior 只在支持 history.pushState 的浏览器中可用。” 接受三个参数，to, from, savedPosition, 而 savedPosition “当且仅当 popstate 导航 (通过浏览器的 前进/后退 按钮触发) 时才可用。” 这意味这个参数着只有 this.$router.go(...) 有效，this.$router.push() 时是无效的！并且，我们在使用 <keep-live> 时，通常会在自定义的路由中添加某些字段，但 nuxt 的路由是自动生成的

Nginx简介： ​ Nginx同Apache一样都是一种WEB服务器。基于REST架构风格，以统一资源描述符(Uniform Resources Identifier)URI或者统一资源定位符(Uniform Resources Locator)URL作为沟通依据，通过HTTP协议提供各种网络服务。 ​ 这些服务器在设计之初受到当时环境的局限，例如当时的用户规模，网络带宽，产品特点等局限并且各自的定位和发展都不尽相同。这也使得各个WEB服务器有着各自鲜明的特点。 　　Apache的发展时期很长，而且是毫无争议的世界第一大服务器。它有着很多优点：稳定、开源、跨平台等等。它出现的时间太长了，它兴起的年代，互联网产业远远比不上现在。所以它被设计为一个重量级的。它不支持高并发的服务器。在Apache上运行数以万计的并发访问，会导致服务器消耗大量内存。操作系统对其进行进程或线程间的切换也消耗了大量的CPU资源，导致HTTP请求的平均响应速度降低。 　　这些都决定了Apache不可能成为高性能WEB服务器，轻量级高并发服务器Nginx就应运而生了。 　　俄罗斯的工程师Igor Sysoev，他在为Rambler Media工作期间，使用C语言开发了Nginx。Nginx作为WEB服务器一直为Rambler Media提供出色而又稳定的服务。 Nginx特点： Nginx使用基于事件驱动架构

一共抓到11个包，浏览器使用的端口是52085，服务器使用的端口是80，经过SYN、SYN/ACK、ACK的 三个 包之后建立连接，浏览器 第四 个包TCP发送了一个“GET / HTTP/1.1”请求报文，Web服务器回复了第 五 个包，在TCP协议层面确认：“刚才的报文我已经收到了”，不过这个TCP包HTTP协议是看不见的，服务器从磁盘上把那个文件全读出来，再拼成符合HTTP格式的报文，发回去吧这就是的第六个包“HTTP/1.1 200 OK”，底层走的还是TCP协议，这时浏览器就收到了响应数据，但里面是什么呢？所以也要解析报文。一看，服务器给我的是个 HTML文件，好，那我就调用排版引擎、JavaScript引擎等等处理一下，然后在浏览器窗口里展现出了欢迎页面 浏览器 服务器 DNS CDN插上一脚，CDN会缓存网站的大部分资源，比如图片、CSS样式表，所以有的HTTP请求就不需要再发到Apple，CDN就可以直接响应你的请求，把数据发给你，单手CDN无法缓存动态资源，HTTP请求只能经过无数的路由器、网关、代理，最后到达目的地，目标网站的服务器对外表现的是一个I P地址 ，但为了能够扛住高并发，在内部也是一套复杂的架 构。通常在入口是负载均衡设备，例如 四层的LVS或者七层的Nginx ，在后面是许多的服务器，构成一个更强更稳定的集群。负载均衡设备会先访问系统里的缓存服务器