問題背景

一款小程序默認會有三個版本（開發(fā)、體驗、生產），而同一臺手機打開同一個小程序只會對應一份本地存儲（storage），這就會導致當我們在本地存儲中記了某些信息時，因為使用過不同版本的小程序，本地存儲就會出現(xiàn)不匹配或是被覆蓋的情況。為了解決這個問題，我們來設計一個可行的方案。

小程序版本

官方文檔點這里

• 開發(fā)版 develop：本地預覽，本地真機調試 所對應的小程序版本，只有在當前開發(fā)者的設備上使用，一般都是開發(fā)階段調試功能一次性生成并使用。
• 體驗版 trial：本地開發(fā)完成后，一般會上傳當前版本至小程序后臺，小程序后臺會有對應的版本記錄，可以將上傳的該版本設置成體驗版，供有體驗版權限的項目人員使用。
• 生產版 release：即發(fā)布后的線上版本，所有人可使用。

小程序的本地存儲

官方文檔點這里

如果熟悉web的同學，應該很容易理解，小程序的本地存儲就和web本地存儲一樣，會有本地的 storage，具體 api 使用可以直接看官方文檔，存儲格式就是一個 key 對應一個 value。就像上文背景中說到的，因為小程序有多個版本，但是本地存儲一個小程序只會有一個 storage，所以使用 api 去讀寫 storage 的時候，就沒法區(qū)分小程序版本，尤其是當擁有體驗版權限的項目人員，在第一次使用生產版本時，會因為存在過體驗版的本地存儲而影響第一次打開正式版的體驗效果。 下面我們就列一下可行的解決方案。

方案1：讀寫加標志

因為 storage 的數(shù)據格式是 鍵值對 one key one value，那我們就可以在讀寫 storage 的時候都加上 版本 區(qū)分，這樣自然而然就鍵值就都分開了。

我簡單寫下大概的偽代碼

// 本地存儲鍵名map
const STORAGE_KEY_MAP = {
  /** api環(huán)境 */
 API_HOST: '__api_host__'
};

// 設置 開發(fā)版 字段
wx.setStorageSync(STORAGE_KEY_MAP.API_HOST + '@develop', 'dev1');

// 設置 體驗版 字段
wx.setStorageSync(STORAGE_KEY_MAP.API_HOST  + '@trial', 'dev1');

// 設置 生產版 字段（就不帶版本后綴了）
wx.setStorageSync(STORAGE_KEY_MAP.API_HOST , 'dev1');

// 讀取
wx.getStorageSync(STORAGE_KEY_MAP.API_HOST + '@develop');
wx.getStorageSync(STORAGE_KEY_MAP.API_HOST  + '@trial');
wx.getStorageSync(STORAGE_KEY_MAP.API_HOST)

通過給鍵名加上版本的標志后，讀寫 storage 都不會再受版本的影響。這是最基礎最直接的一種方式，因為本地存儲的大小為10M，我們用????這個方法等于會同時存儲三個版本的本地存儲數(shù)據，單純用這個方式上就會有些冗余的感覺了。為了更優(yōu)雅的使用本地存儲，我更推薦使用下面提供的第2種方案。

方案2：讀寫加標志 + 監(jiān)測生產版本更新

這個方案不會影響生產版，上線后的小程序本地只會有一份數(shù)據。結合方案1，我們改進的是，通過監(jiān)測生產版本更新，清空 storage。

解釋下是什么意思，因為主要是體驗版和生產版之間的 storage 會有影響，在一個小程序上線前，會有一批有體驗權限的人，去試用此次即將上線的版本。當這同一批人在發(fā)布后打開小程序，讀取 storage 就會是上次使用體驗版存儲在本地的數(shù)據。為了將這兩個版本的 storage 隔離，我們就要使用 方案1，先將體驗版的 storage 標注出來，在生產版本發(fā)布后，打開生產版時，將之前存儲的標注為體驗版的 storage 清除，這樣我們每個版本就只會存在一個版本的 storge 了（為什么呢？因為下一次的體驗版本，一定是基于上一個生產版而產生的，在上一個生產版本使用時，我們已經將之前的非生產版本 storage 已經清楚了，那么使用新體驗版時，其實就回到了一個初始化的狀態(tài)了）。

使用這個方案在「開發(fā)->測試->發(fā)布」這一個正向的流程中是相對比較合理的，也就是每次發(fā)版后，非生產版本的小程序重新開始記錄本地存儲，

這里會有三個需要注意的地方，

• 小程序的更新機制：在冷啟動時，即首次打開小程序，或者小程序超過30分鐘被自動銷毀后打開，都會默認更新為最新版本的小程序（用戶無感）。在小程序還屬于熱啟動時（正在當次使用中，沒有隱藏過前臺），是不會立刻主動下載新版本的，熱啟動期間想要更新小程序需通過「刪除小程序、重新進入小程序」手動獲取最新版本的小程序。
• 小程序提供的監(jiān)聽版本管理的 api，即是讓我們在使用本地舊版本的時候感知到是否后臺有最新版本的發(fā)布。注意：非生產版本小程序沒有版本號的概念，無法使用版本更新監(jiān)聽，可以更改編譯模式設置模擬更新。
• 因為我們需要清空非生產版本的 storage，所以我們在前期設置 storage 的時候，得將 key 統(tǒng)一維護，這樣我們才能直接知道我們會設置進 storage 的 Key Map，便于批量刪除。

下面我們來寫一下相關的實現(xiàn)

版本定義

// 版本
const APP_ENV_MAP = {
  /** 開發(fā)版 */
  develop: "develop",
  /** 體驗版 */
  trial: "trial",
  /** 生產版 */
  release: "release",
};

獲取當前小程序版本

使用 api getAccountInfoSync 會返回小程序版本信息

// 獲取當前小程序版本
function getEnvByAccountInfo() {
  try {
    const accountInfo = wx.getAccountInfoSync();
    return accountInfo.miniProgram.envVersion; // 版本
  } catch (error) {
    return null;
  }
}

// 當前是否為生產版本
const IS_RELEASE = getEnvByAccountInfo() === APP_ENV_MAP.release;

生產新版本監(jiān)測

使用 api getUpdateManager 管理小程序更新

STORAGE_KEY_MAP 是維護好的 storage key map 集合，IS_RELEASE 是判斷當前版本是否為生產版小程序

// app.js
onLaunch: function () {
    // 獲取小程序更新管理
    const updateManager = wx.getUpdateManager();

    // 監(jiān)聽是否有新版本
    updateManager.onCheckForUpdate(function (res) {
      // 所有體驗版key
      const allTrialKeys = Object.values(STORAGE_KEY_MAP).map((key) =>
        getEnvStorageKey(key, APP_ENV_MAP.trial)
      );

      // 所有開發(fā)版key
      const allDevKeys = Object.values(STORAGE_KEY_MAP).map((key) =>
        getEnvStorageKey(key, APP_ENV_MAP.develop)
      );

      // 當前是生產版且存在更(gèng)新的生產版本
      if (IS_RELEASE && res.hasUpdate) {
        // 沒有批量刪除的api，只能這么刪了
        [...allTrialKeys, ...allDevKeys].forEach((key) => {
          uni.removeStorageSync(key);
        });
      }
    });
  },

整個過程大概就是這樣子

總結

到此這篇關于微信小程序版本機制和storage如何平滑兼容的文章就介紹到這了,更多相關小程序版本機制和storage平滑兼容內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！