本篇文章給大家總結(jié)分享一些小程序開(kāi)發(fā)中實(shí)用的小知識(shí)，希望對(duì)大家有所幫助！

了解小程序的渲染原理

背景

在網(wǎng)頁(yè)開(kāi)發(fā)中，由于js是單線程的，所以有時(shí)候會(huì)出現(xiàn)長(zhǎng)時(shí)間運(yùn)行腳本，導(dǎo)致頁(yè)面失去響應(yīng)。 頁(yè)面渲染目前有以下三種方式：

• 純客戶端原生技術(shù)渲染
• 純web技術(shù)渲染
• Hybrid渲染，即web和native渲染相結(jié)合的方式

在小程序中，選擇了Hybrid的渲染方式，將邏輯層和視圖層分開(kāi)，使用雙線程的方式運(yùn)行，使用webView渲染視圖層的界面，邏輯層運(yùn)行在JSCore中。

小程序的雙線程模型：

• 邏輯層：創(chuàng)建一個(gè)單獨(dú)的線程去執(zhí)行javascript，在這里執(zhí)行的都是有關(guān)小程序業(yè)務(wù)邏輯的代碼，負(fù)責(zé)邏輯處理，數(shù)據(jù)請(qǐng)求，接口調(diào)用。
• 視圖層：界面渲染都在webView線程里執(zhí)行，通過(guò)邏輯層代碼控制渲染哪些界面
• jsBridge：使小程序可通過(guò)API使用原生的功能

你真的了解appId，uniId，openId之間的聯(lián)系么

openID

openID是微信公眾平臺(tái)為用戶同一分配的，眾所周知，微信小程序和微信公眾號(hào)都是維護(hù)在微信公眾平臺(tái)上的，每個(gè)公眾號(hào)和小程序?yàn)榱藚^(qū)分用戶，為每個(gè)用戶都生成了唯一的openID

UnionID

UnionID是微信開(kāi)放平臺(tái)給微信用戶分配的ID。 在同一個(gè)開(kāi)放平臺(tái)下的應(yīng)用，微信用戶會(huì)有唯一的UnionID

比如：你公司有兩個(gè)應(yīng)用，小程序A和微信公眾號(hào)B，A和B的用戶信息需要打通，可以將A和B兩個(gè)應(yīng)用綁定到同一個(gè)開(kāi)放平臺(tái)下，微信開(kāi)放平臺(tái)會(huì)給微信用戶生成一個(gè)唯一的UnionID，在授權(quán)登錄注冊(cè)后，將UnionID存儲(chǔ)在用戶表里，以后從同一開(kāi)放平臺(tái)下的其他應(yīng)用授權(quán)登錄拿到UnionID后，就可以直接返回用戶信息，

AppID

AppID是不同應(yīng)用的唯一標(biāo)識(shí)

比如：你公司有1個(gè)小程序，一個(gè)公眾號(hào)兩個(gè)應(yīng)用，AppId就是這兩個(gè)應(yīng)用的唯一標(biāo)識(shí)

帶你一起總結(jié)小程序的跳轉(zhuǎn)能力，方便隨時(shí)接受領(lǐng)導(dǎo)檢驗(yàn)

今天一朋友跟我吐槽，他現(xiàn)處于一個(gè)中小型公司，老板們?cè)跁?huì)議室開(kāi)會(huì)，大boss有個(gè)問(wèn)題就是關(guān)于小程序跳轉(zhuǎn)的。一個(gè)不知道負(fù)責(zé)哪塊的領(lǐng)導(dǎo)A出來(lái)，先是問(wèn)了運(yùn)維，然后又問(wèn)了后端java大大。java大大說(shuō)這個(gè)屬于前端范疇，他們更清楚點(diǎn)，領(lǐng)導(dǎo)A聽(tīng)后直接說(shuō)了句，前端知道啥，然后走進(jìn)會(huì)議室，跟大boss反饋，沒(méi)人知道。他之前跟我說(shuō)他們公司前端地位低，這是真的低啊

h5跳轉(zhuǎn)小程序

產(chǎn)品：小羊，我們這個(gè)公眾號(hào)點(diǎn)擊這個(gè)按鈕需要跳轉(zhuǎn)到某某某小程序上去。這個(gè)功能必須實(shí)現(xiàn)

好咯需求有了，開(kāi)始給方案唄

• 方案一：點(diǎn)擊按鈕，給個(gè)彈框，彈框里放個(gè)二維碼。引導(dǎo)用戶長(zhǎng)按識(shí)別
  • 操作流程場(chǎng)，用戶轉(zhuǎn)化率低，大部分用戶基本上就懶得操作了
• 方案二：使用微信的開(kāi)放標(biāo)簽wx-open-launch-weapp
  • 可以跳轉(zhuǎn)任意合法合規(guī)的小程序（感覺(jué)這個(gè)功能后面會(huì)有更多限制出來(lái)）

經(jīng)過(guò)和產(chǎn)品討論，第二種方案更適合點(diǎn)，開(kāi)整：

步驟：

• 已認(rèn)證的服務(wù)號(hào)，服務(wù)號(hào)綁定“js接口安全域名”下的網(wǎng)頁(yè)可使用此標(biāo)簽跳轉(zhuǎn)任意合法合規(guī)小程序
• 引入js文件?https://res.wx.qq.com/open/js/jweixin-1.6.0.js
• 通過(guò)config接口注入權(quán)限配置，并通過(guò)openTagList字段申請(qǐng)所需要的開(kāi)放標(biāo)簽

wx.config({
  debug: false,
  appId: '',   // 公眾號(hào)唯一標(biāo)識(shí)
  timestamp: '',  // 生成簽名的時(shí)間戳
  nonceStr: '',   // 生成簽名的隨機(jī)串
  signature: '',  // 簽名
  jsApiList: ["wx-open-launch-weapp"],
  openTagList: ["wx-open-launch-weapp"] // 微信開(kāi)放標(biāo)簽 小程序跳轉(zhuǎn)按鈕：<wx-open-launch-weapp>
});
// 通過(guò)ready處理成功驗(yàn)證
wx.ready(function () {
  console.log(&#39;ready&#39;)

})
// 處理失敗驗(yàn)證
wx.error(function(error) {
  console.error("err", error);
});

<wx-open-launch-weapp
  id="launch-btn"
  username="gh_xxxxxxxx"
  path="pages/home/index?user=123&action=abc"
>
  <script type="text/wxtag-template">
    <style>.btn { padding: 12px }</style>
    <button class="btn">打開(kāi)小程序</button>
  </script>
</wx-open-launch-weapp>

微信客服消息中帶跳轉(zhuǎn)小程序鏈接

文本內(nèi)容....<a href=&#39;&#39; data-miniprogram-appid=&#39;{{appid}}&#39; data-miniprogram-path=&#39;pages/index/index&#39;>點(diǎn)擊跳小程序</a>

• data-miniprogram-appid填寫(xiě)小程序鏈接，表示跳轉(zhuǎn)小程序
• data-miniprogram-path 小程序路徑，可帶參數(shù)
• 公眾號(hào)必須和小程序相關(guān)聯(lián)
• 鏈接中的各個(gè)屬性值必須使用單引號(hào)

小程序跳轉(zhuǎn)小程序

wx.navigateToMiniProgram({
    envVersion: 'release', // 要打開(kāi)的小程序版本，develop: 開(kāi)發(fā)版，trial：體驗(yàn)版，release：正式版。僅在當(dāng)前小程序?yàn)殚_(kāi)發(fā)版或體驗(yàn)版時(shí)此參數(shù)有效。
    appId: ’‘, // 跳轉(zhuǎn)appid
    path: ’‘  //  跳轉(zhuǎn)路徑
})

• 需要用戶手動(dòng)觸發(fā)
• 需要用戶確認(rèn)跳轉(zhuǎn)

【相關(guān)學(xué)習(xí)推薦：小程序開(kāi)發(fā)教程】

以上是總結(jié)分享一些小程序開(kāi)發(fā)中實(shí)用的小知識(shí)的詳細(xì)內(nèi)容。更多信息請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！