小規模なプログラム開発における実践的な知識を要約して共有する-ミニプログラム開発-php.cn

小規模なプログラム開発における実践的な知識を要約して共有する

青灯夜游

リリース： 2022-01-26 10:50:10

転載

3072 人が閲覧しました

この記事では、小規模なプログラム開発における実践的な知識を要約して共有します。皆様のお役に立てれば幸いです。

小規模なプログラム開発における実践的な知識を要約して共有する

#ミニプログラムのレンダリング原理を理解する

バックグラウンド

Web 開発では、js がシングルスレッドであるため、スクリプトが長時間実行され、ページの応答が失われることがあります。現在、ページをレンダリングするには次の 3 つの方法があります。

純粋な Web テクノロジレンダリング
ハイブリッドレンダリング、つまり、次の 3 つの方法を組み合わせたものです。 Web およびネイティブレンダリング方法

ミニプログラムでは、ハイブリッドレンダリング方法が選択され、ロジック層とビュー層が分離され、デュアルスレッドで実行されます。WebView は、インターフェイスのレンダリングに使用されます。ビュー層とロジック層は JSCore で実行されます。

ミニプログラムのデュアルスレッドモデル:

View レイヤー: インターフェイスのレンダリングは webView スレッドで実行され、どのインターフェイスはロジックレイヤーコードを通じて制御されます
jsBridge: 小さなプログラムが API を通じてネイティブ関数を使用できるようにします

小規模なプログラム開発における実践的な知識を要約して共有する

appId、uniId、openId の関係を本当に理解していますか

openID

openID は、WeChat パブリックプラットフォームによってユーザーに均一に割り当てられます。ご存知のとおり、WeChat ミニプログラムと WeChat パブリックアカウントは WeChat パブリックプラットフォーム上で維持されます。ユーザーを区別するために、各パブリックアカウントとミニプログラムは各ユーザーに一意の ID を提供します。各ユーザーは一意の openID

小規模なプログラム開発における実践的な知識を要約して共有する

#UnionID

UnionID を生成します。UnionID は WeChat に割り当てられる ID です。 WeChatオープンプラットフォームによるユーザー。同じオープンプラットフォーム下のアプリケーションの場合、WeChat ユーザーは一意の UnionID を持ちます。

例: あなたの会社には、ミニプログラム A と WeChat 公式アカウント B の 2 つのアプリケーションがあります。A と B のユーザー情報が必要です。オープンすると、2 つのアプリケーション A と B を同じオープンプラットフォームにバインドできます。WeChat オープンプラットフォームは、WeChat ユーザーに対して一意の UnionID を生成します。承認されたログインと登録の後、UnionID はユーザーテーブルに保存され、将来的には、同じオープンプラットフォームから開かれるようになります。プラットフォーム下の他のアプリケーションがログインして UnionID を取得することを許可された後、ユーザー情報

# を直接返すことができます。小規模なプログラム開発における実践的な知識を要約して共有する ##AppID

AppID は、さまざまなアプリケーションの一意の識別子です。

例: あなたの会社には、1 つのミニプログラム、1 つの公式アカウント、2 つのアプリケーションがあります。AppIdは、これら 2 つのアプリケーションの一意の識別子です

小規模なプログラム開発における実践的な知識を要約して共有する

ミニプログラムのジャンプ能力を要約して、リーダーシップを発揮できるようにしてください。

#今日、友人が私に愚痴をこぼしました。彼は現在中小企業で働いているとのことでした。上司たちは会議室で会議をしています。 . 大ボスがミニプログラムジャンプについて質問です。自分がどの部分を担当しているのか分からないリーダーAが出てきて、最初に運用保守のことを聞き、次にバックエンドのJavaのことを聞いてきました。 Java の上司は、これはフロントエンドのカテゴリに属し、より明確であると言いました。これを聞いたリーダー A は、「フロントエンドに何がわかっているのですか?」と直接言い、会議室に入り、上司にフィードバックしました。 . 誰も知りませんでした。彼は以前、彼らの会社のフロントエンドの地位が低いと私に言いました。これは本当に低いです。

h5 Jump Mini Program

製品: Xiaoyang , 公式アカウントは、このボタンをクリックして特定のアプレットにジャンプする必要があります。この関数は実装する必要があります。

要件が揃ったので、計画を始めましょう

オプション 1: ボタンをクリックして、ポップ音を鳴らします。・ポップアップボックスにQRコードを入れてください。ユーザーを長押しして
操作プロセスフィールドを特定するように誘導します。ユーザーのコンバージョン率は低く、ほとんどのユーザーは基本的に操作するのが面倒です

オプション 2: を使用します。 WeChat のオープンラベル wx -open-launch-weapp
合法かつ準拠したミニプログラムにジャンプできます (この機能には後でさらに制限がかかると思います)

## 合格製品と話し合った後、2 番目のオプションの方が適切です。開始手順:
手順:

認定サービスアカウント、サービスアカウントをバインドします。「js インターフェイスセキュリティドメイン名」の下にある Web ページは、このタグを使用して法的かつ準拠したミニプログラムにジャンプできます

js ファイルの紹介 https://res.wx.qq.com/open/js/ jweixin-1.6.0.js

wx.config({
  debug: false,
  appId: &#39;&#39;,   // 公众号唯一标识
  timestamp: &#39;&#39;,  // 生成签名的时间戳
  nonceStr: &#39;&#39;,   // 生成签名的随机串
  signature: &#39;&#39;,  // 签名
  jsApiList: ["wx-open-launch-weapp"],
  openTagList: ["wx-open-launch-weapp"] // 微信开放标签 小程序跳转按钮：<wx-open-launch-weapp>
});
// 通过ready处理成功验证
wx.ready(function () {
  console.log(&#39;ready&#39;)

})
// 处理失败验证
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">打开小程序</button>
  </script>
</wx-open-launch-weapp>

ログイン後にコピー

文本内容....<a href=&#39;&#39; data-miniprogram-appid=&#39;{{appid}}&#39; data-miniprogram-path=&#39;pages/index/index&#39;>点击跳小程序</a>

ログイン後にコピー

data-miniprogram-appid填写小程序链接，表示跳转小程序
data-miniprogram-path 小程序路径，可带参数
公众号必须和小程序相关联
链接中的各个属性值必须使用单引号

小程序跳转小程序

wx.navigateToMiniProgram({
    envVersion: &#39;release&#39;, // 要打开的小程序版本，develop: 开发版，trial：体验版，release：正式版。仅在当前小程序为开发版或体验版时此参数有效。
    appId: ’‘, // 跳转appid
    path: ’‘  //  跳转路径
})

ログイン後にコピー