由於網際網路連線可能很麻煩或不存在，因此您需要考慮優先離線： 編寫應用程式，過程就像沒有網際網路連線一樣。應用程式可離線運作後， 確保應用程式在上線時 所需的網路功能請繼續閱讀，瞭解有哪些訣竅 就能實作支援離線運作的應用程式
總覽
Chrome 應用程式可免費享有下列服務：
- 應用程式的檔案，包括所有 JavaScript、CSS 和字型，以及所需的其他資源 (例如 圖片)—已經下載。
- 您的應用程式可以使用 Chrome Storage API 儲存及選擇同步處理少量資料。
- 應用程式會監聽線上和離線事件，偵測連線能力變化。
不過，上述功能還不足以保證應用程式可以離線運作。你已啟用離線功能 應用程式應符合下列規則：
- 盡可能使用本機資料。
- 使用網際網路資源時，請透過
XMLHttpRequest取得並儲存資料 本機儲存空間你可以使用 Chrome Storage API、IndexedDB 或 Filesystem API 將資料儲存在本機。 - 將應用程式 UI 與資料分開。
- 區隔使用者介面和資料不僅有助於改善應用程式設計，還能簡化啟用工作 也能讓您以其他方式檢視使用者的資料。MVC 架構能 可分開存放 UI 和資料。
- 假設您可隨時關閉應用程式。
- 儲存應用程式狀態 (如果可以儲存在本機和遠端)，方便使用者隨時隨地聆聽 留下的印象
- 仔細測試應用程式。
- 確保應用程式在常見和困難情境下都能正常運作。
安全性限制
Chrome 應用程式無法放置資源：
- 本機資料會顯示在使用者的電腦上，且無法安全地加密，因此機密資訊 資料就必須保留在伺服器上。舉例來說，請勿將密碼或信用卡號碼儲存在本機。
- 應用程式執行的所有 JavaScript 必須位於應用程式的套件中。但無法內嵌。
所有「CSS 樣式」、「圖片」和「字型」一開始都可以位於應用程式的套件中 封鎖網址如果是遠端資源，就無法在 HTML 中指定。請改為取得 資料使用
XMLHttpRequest(請參閱「參照外部資源」)。然後參照 儲存資料，或是 (較適合) 儲存，然後使用 Filesystem API 載入資料。
不過，您可以載入來自外部網站的大型媒體資源，例如影片和音訊。一
這項例外狀況的原因是 <video> 和 <audio> 元素具有良好的備用選項
應用程式連線能力受限或離線時的行為。另一個原因是
含有 XMLHttpRequest 和 blob 網址的媒體目前不允許串流或部分緩衝。
如要提供採用沙箱機制的 iframe，您可以建立 <webview> 標記。內容可以是遠端內容，但
無法直接存取 Chrome 應用程式 API (請參閱嵌入外部網頁)。
Chrome 應用程式的部分限制是由內容安全政策 (CSP) 強制執行， Chrome 應用程式一律如下，不可變更：
default-src 'self';
connect-src * data: blob: filesystem:;
style-src 'self' blob: data: filesystem: 'unsafe-inline';
img-src 'self' blob: data: filesystem:;
frame-src 'self' blob: data: filesystem:;
font-src 'self' blob: data: filesystem:;
media-src * data: blob: filesystem:;
指定離線_enabled
系統會假設應用程式離線運作。如果不是，您應該宣傳這一點
表示使用者離線時，啟動圖示會變暗。如要這樣做，請將 offline_enabled 設為 false
應用程式資訊清單檔案中：
{
"name": "My app",
...
"offline_enabled": false,
...
}
將資料儲存在本機
下表列出在本機儲存資料的選項 (另請參閱管理資料)。
| API | 最適用情況 | 附註 |
|---|---|---|
| Chrome Storage API | 少量字串資料 | 非常適合設定和狀態。輕鬆地從遠端同步 (但非必要)。因配額限製而不適合儲存大量資料。 |
| IndexedDB API | 結構化資料 | 快速搜尋資料。使用 unlimitedStorage 權限。 |
| 檔案系統 API | 其他 | 提供可儲存檔案的沙箱區域。使用 unlimitedStorage 權限。 |
從遠端儲存資料
一般來說，您可以自行決定如何從遠端儲存資料，但有些架構和 API 仍可以提供協助 (請參閱 MVC 的「MVC」一節 架構)。如果使用 Chrome Storage API，系統會自動列出所有可同步處理的資料。 當應用程式上線且使用者登入 Chrome 時，系統就會同步處理。如果使用者未登入， 在登入狀態下，系統會提示使用者登入帳戶。但請注意，如果使用者已同步的資料會遭到刪除 會解除安裝應用程式{QUESTION: true?}
建議儲存使用者讓使用者資料在解除安裝應用程式後至少 30 天 提供良好的使用體驗。
將 UI 與資料區隔開來
使用 MVC 架構可協助您設計及實作應用程式，讓應用程式具備完整的資料 和應用程式的資料檢視畫面做出區隔如需 MVC 架構清單，請參閱「MVC 架構」。
如果您的應用程式與自訂伺服器通訊，伺服器應提供您資料，而非 HTML 區塊。深思熟慮 完整執行 REST 樣式
將資料與應用程式區隔後，就能更輕鬆地提供資料的不同檢視方式。 舉例來說，您可以提供任何公開資料的網站資料檢視。您不僅可以使用網站資料檢視 可讓搜尋引擎找到資料。
測試
確保應用程式在以下情況下能正常運作：
- 應用程式安裝完成後，隨即離線。換句話說，應用程式首次使用的應用程式 離線。
- 應用程式已安裝在某部電腦上，然後再同步到另一台電腦。
- 應用程式解除安裝後，會立即重新安裝。
- 應用程式同時在兩部電腦上，以同一個設定檔執行。應用程式必須能正常運作 表示某部電腦離線時，使用者會在那台電腦上執行許多作業， 電腦恢復連線後
- 應用程式的連線不穩，經常會在線上和離線之間切換。
此外，請確認應用程式不會將使用者機密資料 (例如密碼) 儲存在使用者的 這類機制更為快速