應(yīng)用緩存 AllicationCache
瀏覽器本身的緩存機(jī)制
- 瀏覽器會(huì)對(duì)靜態(tài)文件（html,css,js,圖片等）進(jìn)行自動(dòng)緩存
- 下次訪問(wèn)該網(wǎng)頁(yè)，會(huì)讀取緩存
- 讀取緩存之前進(jìn)行判斷，第一次判斷緩存時(shí)間和服務(wù)器上傳文件的最后一次修改時(shí)間。
- 如果緩存時(shí)間大于最后一次修改時(shí)間，證明緩存之后，服務(wù)器上沒(méi)有對(duì)文件進(jìn)行修改，此時(shí)，瀏覽器會(huì)直接讀取緩存文件
- 如果緩存時(shí)間小于最后一次修改時(shí)間，證明緩存之后，服務(wù)器又對(duì)對(duì)文件進(jìn)行修改，此時(shí)，瀏覽器會(huì)重新下載服務(wù)器上的靜態(tài)文件，并重新進(jìn)行緩存
應(yīng)用緩存的優(yōu)點(diǎn)
- 進(jìn)行離線瀏覽
- 速度，已緩存資源加載得更快
- 減少服務(wù)器負(fù)載，瀏覽器將只從服務(wù)器下載更新過(guò)或修改過(guò)的資源
Cache Manifest
- manifest屬性：如果啟用應(yīng)用程序緩存，在文檔的
<html>標(biāo)簽中包含manifest屬性，每個(gè)指定了manifest的頁(yè)面在用戶對(duì)其訪問(wèn)時(shí)都會(huì)被緩存。如果未指定 manifest 屬性，則頁(yè)面不會(huì)被緩存（除非在 manifest 文件中直接指定了該頁(yè)面）。 - manifest 文件的建議的文件擴(kuò)展名是：".appcache"。
- 在html中使用屬性
manifest引入 manifest文件 - 請(qǐng)注意，manifest 文件需要配置正確的 MIME-type，即 "text/cache-manifest"。必須在 web 服務(wù)器上進(jìn)行配置。
- Manifest文件
- manifest 文件是簡(jiǎn)單的文本文件，它告知瀏覽器被緩存的內(nèi)容（以及不緩存的內(nèi)容）。
- manifest 文件可分為三個(gè)部分：
- CACHE - 在此標(biāo)題下列出的文件將在首次下載后進(jìn)行緩存
- NETWORK - 在此標(biāo)題下列出的文件需要與服務(wù)器的連接，且不會(huì)被緩存
- FALLBACK - 在此標(biāo)題下列出的文件規(guī)定當(dāng)頁(yè)面無(wú)法訪問(wèn)時(shí)的回退頁(yè)面（比如 404 頁(yè)面）
如：
CACHE MANIFEST
#version: 0.0.1
緩存文件.html
緩存文件.css
NETWORK:
不緩存的文件.html
FALLBACK:
404.html
-
更新緩存
- 一旦應(yīng)用被緩存，它就會(huì)保持緩存直到發(fā)生下列情況：用戶清空瀏覽器緩存；manifest 文件被修改；由程序來(lái)更新應(yīng)用緩存
- 一旦文件被緩存，則瀏覽器會(huì)繼續(xù)展示已緩存的版本，即使您修改了服務(wù)器上的文件。為了確保瀏覽器更新緩存，您需要更新 manifest 文件。
applicationCache對(duì)象
- 屬性
- status 返回緩存的狀態(tài)
- 方法
- update() 發(fā)起應(yīng)用緩存下載進(jìn)程
- abort() 取消正在進(jìn)行的緩存下載
- swapcache() 切換成本地最新的緩存環(huán)境
- 事件
- checking 用戶代理檢測(cè)更新或者在第一次嘗試下載manifest文件的時(shí)候，本事件往往是第一個(gè)觸發(fā)的
- noupdate 檢測(cè)出manifest文件沒(méi)有更新
- downloading 用戶代理發(fā)現(xiàn)更新并且正在取資源，或者第一次下載manifest文件列表中列舉的資源
- progress 用戶代理正在下載資源manifest文件中的需要緩存的資源
- updateready manifest中列舉的文件已經(jīng)重新下載并更新成功，接下來(lái)js可以使用swapCache()方法更新到應(yīng)用程序中
- error
- absolete manifest的請(qǐng)求出現(xiàn)404或者410錯(cuò)誤，應(yīng)用程序緩存被取消
WebRTC
- WebRTC是“網(wǎng)絡(luò)實(shí)時(shí)通信”（Web Real Time Communication）的縮寫，它主要用來(lái)讓瀏覽器實(shí)時(shí)獲取和交換視頻、音頻和數(shù)據(jù)。
作用
- 調(diào)用系統(tǒng)的攝像頭和麥克風(fēng)
使用
-
navigator.getUserMedia(options， success, error)
- streams：表示包括哪些多媒體設(shè)備的對(duì)象
- success：回調(diào)函數(shù)，獲取多媒體設(shè)備成功時(shí)調(diào)用,接受一個(gè)MediaStream的實(shí)例作為參數(shù)
- error：回調(diào)函數(shù)，獲取多媒體設(shè)備失敗時(shí)調(diào)用，接受一個(gè)error對(duì)象作為參數(shù)
-
options
{ video:true/false, audio:true/false }
MediaStream
成功后的回調(diào)函自動(dòng)傳入該對(duì)象作為參數(shù)
觸摸屏的事件
事件類型
- touchstart
- touchend
- touchmove
touchEvent
- targetTouches 屬性 獲取touchlist對(duì)象，一個(gè) TouchList 對(duì)象，是包含了如下觸點(diǎn)的 Touch 對(duì)象：觸摸起始于當(dāng)前事件的目標(biāo) element 上，并且仍然沒(méi)有離開(kāi)觸摸平面的觸點(diǎn). 只讀屬性.
touchList
- 表示所有touch對(duì)象的集合
- 一個(gè)touch對(duì)象表示一個(gè)觸摸點(diǎn)
touch對(duì)象
*clientX 觸點(diǎn)相對(duì)于可見(jiàn)視區(qū)(visual viewport)左邊沿的的X坐標(biāo). 不包括任何滾動(dòng)偏移. 只讀屬性.
*clientY 觸點(diǎn)相對(duì)于可見(jiàn)視區(qū)(visual viewport)上邊沿的的Y坐標(biāo). 不包括任何滾動(dòng)偏移. 只讀屬性.
*pageX 觸點(diǎn)相對(duì)于HTML文檔左邊沿的的X坐標(biāo). 當(dāng)存在水平滾動(dòng)的偏移時(shí), 這個(gè)值包含了水平滾動(dòng)的偏移. 只讀屬性.
*pageY 觸點(diǎn)相對(duì)于HTML文檔上邊沿的的Y坐標(biāo). 當(dāng)存在水平滾動(dòng)的偏移時(shí), 這個(gè)值包含了垂直滾動(dòng)的偏移. 只讀屬性.
*screenX
*screenY
*....
