繼微信、QQ 之后，QQ 瀏覽器上也可以使用小程序了。

12 月 5 日，QQ瀏覽器小程序宣布，實現與微信小程序打通。QQ 瀏覽器 Android 版現已上線小程序，在搜索的場景下，小程序嵌入 QQ 瀏覽器「搜索直達」，作為直接的內容承載。用戶在搜索框輸入關鍵詞后，相關小程序會在關鍵詞智能推薦列表優先推薦，并直接展示相關內容。墨跡天氣、騰訊翻譯君等小程序已經成功入駐。

除此之外，QQ 瀏覽器小程序兼容適配了微信小程序，號稱「只需三步」開發者即可完成適配工作將微信小程序移植到 QQ 瀏覽器上運行。

知曉程序也在第一時間體驗了整個適配過程，接下來將為大家一一講解其中的細節和關注點。值得一提的是，騰訊官方將 QQ 瀏覽器（QQ Browser）小程序稱為 QB 小程序，聽到這個名字想必大家會有種奇妙的感覺。

安裝并注冊 QB 小程序調試工具

在你正式上手調試前，我們需要提醒以下三點注意事項：

目前開發者工具只支持安卓；

小程序的正式名稱、圖標和簡介是用戶可見的，并且填寫完成后暫時沒有辦法修改，所以填寫一定要謹慎；

qbDebugKey 是設備唯一的，每臺手機都會生成一個 qbDebugKey。

目前 QB 小程序的調試頁面和介紹頁面還十分簡陋，也沒有相關的 PC 端開發工具，所以開發者仍需在微信開發者工具上完成小程序的開發，然后適配成 QB 小程序。

1. 使用微信掃描二維碼進入 QB 小程序調試頁面。

掃描二維碼后，頁面可能會提示「調試內核版本過舊」，需按照提示長按識別頁面中的二維碼下載安裝最新版調試內核，安裝完成后再重新掃描上方二維碼進入。

2. 進入調試頁面后，需先完成「注冊」。 在注冊頁面中：

• packageName 是小程序的唯一標識，一旦注冊成功，packageName 會在后臺與 qbDebugKey 綁定，注冊后只有當前設備可以使用這個 packageName 進行登錄，如果需要給這個 packageName 綁定其他開發設備，可以在登錄后進行添加。
• 開發者昵稱是 qbDebugKey 的別名，方便開發者管理開發設備。
• 小程序的正式名稱、圖標和簡介是用戶可見的，注冊完成后暫時不提供修改方法，請謹慎填寫。
  

同時，你需要將 qbDebugKey 添加到微信小程序的 app.json 配置文件里，如下所示：

{"window": {"navigationBarBackgroundColor": "#FFF","navigationBarTitleText": "知曉課堂","navigationBarTextStyle": "black","qbDebugKey": ["495f18a64485eeac5e78ccbxxx", "7e2f29d50e78411b3915128exxx"]}, }

注意：只有在 app.json 里配置過測試機生成的 qbDebugKey，測試機才能使用 QQ 瀏覽器小程序調試工具調試該小程序。一臺手機對應一個 qbDebugKey。

3.如果你完成了注冊或已有其他開發者為你添加了開發權限，輸入對應小程序 并點擊「登錄」按鈕進入進入開發者管理后臺頁面。

在此頁面中，你可以點擊「開發者權限管理」添加其它開發設備，需要輸入待添加設備的 qbDebugKey 和昵稱，添加成功后，新設備就可以使用該 packageName 進行登錄了。

安裝調試版 QQ 瀏覽器

點擊「啟動 QB 打開小程序」按鈕，如果沒有下載調試版 QQ 瀏覽器，這步操作會下載調試版 QQ 瀏覽器。

如果你手機中未安裝 QQ 瀏覽器或安裝的版本非正確的調試版本，在點擊后會提示「請先下載調試版 QQ 瀏覽器」，按照提示再次點擊按鈕即可開始下載安裝；安裝完成后再次回該頁面點擊啟動按鈕即可拉起 QQ 瀏覽器啟動要調試的小程序。

調試兼容性

在以上兩步完成后，接下來我們需要調試兼容性，直到小程序能夠跑起來。這里主要注意 QB 小程序和微信小程序的幾點區別：

• QB 小程序的登錄態與微信小程序不互通，并且沒有 unionId 概念
• QB 小程序不支持自定義導航欄顏色
• QB 小程序的 canvas 不支持 measureText, 意味著沒有辦法在 canvas 上進行文本換行
• QB 小程序不支持下拉刷新
• QB 小程序的 intersectionObserver 無法使用
• QB 小程序不支持模版消息
• QB 小程序不支持打開跳轉其他小程序
• 微信強相關的 API 都不支持

這里主要參考QQ瀏覽器小程序開發者文檔。

提交預覽，在 QQ 瀏覽器打開

處理好了兼容性問題之后，就可以在QQ瀏覽器中預覽小程序了。

1.首先在 QB 小程序調試工具中點擊「微信掃碼」 按鈕，掃描微信開發者工具中預覽生成的二維碼，此時會進入到微信環境下的小程序，先點擊右上角圓點退出小程序，返回到 QB 小程序調試工具中。

2.然后點擊「啟動 QB 打開小程序」按鈕，在已安裝好調試版 QQ 瀏覽器情況下，會自動跳轉到 QQ 瀏覽器小程序環境，進入后就能看到效果。

▲ 在 QQ 瀏覽器中的預覽效果

3.預覽沒問題之后就可以上傳一個體驗版，輸入版本號，上傳成功后會有一個 url 返回，復制這個 url 到 QQ 瀏覽器中就能打開小程序了。

4.關于分享問題。QQ 瀏覽器小程序可以分享到微信朋友圈、微信好友、QQ 好友、QQ 空間，和微信小程序分享不同的是，QQ 瀏覽器小程序分享是創建一張分享海報，里面有 QQ 瀏覽器小程序二維碼，在安卓手機中長按識別即可自動打開小程序。

提交審核并上線

體驗版測試沒問題之后，在 QB 小程序調試工具中點擊「包狀態管理」，進入到提交包的歷史列表，點擊需要提審的版本提交審核。

審核通過后即可上線發布。

---

本文首發于「知曉云」公眾號：https://mp.weixin.qq.com/s/Joaz-CFWCVPjvZ4ovzAC5w

如果你還想了解 更多小程序開發技巧，快速掌握小程序開發能力。

歡迎掃描下方二維碼關注「知曉云」，我們會持續為更新與小程序有關的實戰教程哦～

總結

以上是生活随笔為你收集整理的手把手教你迁移微信小程序到 QQ 浏览器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。