アプレット内でアプレットコードを生成する方法

王林
リリース: 2021-01-13 09:38:13
転載
8648 人が閲覧しました

アプレット内でアプレットコードを生成する方法

はじめに:

ミニ プログラムは、ダウンロードやインストールを行わずに使用できるアプリケーションであり、アプリケーションが「手の届くところにある」という夢を実現します。ユーザーはスキャンまたは検索することでアプリを開くことができます。また、「Use and Go」の概念を体現しており、ユーザーはアプリケーションをインストールしすぎることを心配する必要はありません。アプリケーションはいつでもどこでも利用できるようになりますが、インストールまたはアンインストールする必要はありません。

(学習ビデオ共有: プログラミング入門)

ミニ プログラムでは、ミニ プログラム コードを生成するにはどうすればよいでしょうか? 現在、ミニ プログラムは次のユーザーと共有できますが、ただし、ミニ プログラム コードの普及は、友達と直接共有するか、写真として共有するか、オフライン コード スキャンへの入り口として使用するかにかかわらず、トラフィックを引き付けるための重要な入り口です。

効果の例:

アプレット内でアプレットコードを生成する方法

アプレット内でアプレットコードを生成する方法

具体的な実装:

ビュー要素内のアプレット コードバインド イベント

<view bindtap="onViewTap">小程序码</view>
ログイン後にコピー

アプレット上のロジック コード

Page({
  data: {},
  // 绑定的点击事件函数
  onViewTap() {
    this.createQrCode(); // 调用生成小程序码
  },

  // 生成小程序码
  createQrCode() {
    this.showLoading();
    wx.cloud
      .callFunction({
        // 请求云函数
        // 云函数getQrCode
        name: &#39;getQrCode&#39;,
      })
      .then((res) => {
        console.log(res);
        const fileId = res.result;
        wx.previewImage({
          // 小程序码,生成后直接预览,前台展示
          urls: [fileId],
          current: fileId,
        });
        this.hideLoading();
      });
  },

  // toast生成中
  showLoading() {
    wx.showLoading({
      title: &#39;正在生成中...&#39;,
      icon: &#39;none&#39;,
    });
  },

  hideLoading() {
    wx.hideLoading();
  },
});
ログイン後にコピー

アプレット上の上記のコード行

クラウド関数実装コード

作成CloudFunctions フォルダー内の getQrCode クラウド関数は、デフォルトで config.json、index.js、package.json の 3 つのファイルを作成します。

そのうち、config.json には上記の

{
  "permissions": {
    "openapi": [
      "wxacode.getUnlimited"
    ]
  }
}
ログイン後にコピー

が含まれています。 wxacode.getUnlimited を使用して小さなプログラム コードを生成する構成です。この構成は修正されています

そして、index.js

// 云函数入口文件
const cloud = require(&#39;wx-server-sdk&#39;);

cloud.init();

// 云函数入口函数
exports.main = async (event, context) => {
  const wxContext = cloud.getWXContext(); // 获取上下文
  const result = await cloud.openapi.wxacode.getUnlimited({
    // 调用生成小程序码的接口,携带一些参数,例如:scene
    scene: wxContext.OPENID,
  });
  // console.log(result)
  const upload = await cloud.uploadFile({
    // 生成的小程序码上传到云存储中
    cloudPath: &#39;qrcode/&#39; + Date.now() + &#39;-&#39; + Math.random() + &#39;.png&#39;, // 生成的小程序码存储到云存储当中去,路径
    fileContent: result.buffer,
  });
  return upload.fileID; // 返回文件的fileID,也就是该图片
};
ログイン後にコピー

内の次のコードは、小さなプログラム コードを生成します。これは、主に wxacode.getUnlimited インターフェイス

を使用して、大量のコードを必要とするビジネス シナリオに適したミニ プログラム コードを取得することで実現できます。このインターフェイスを通じて生成されたミニ プログラム コードは永続的に有効で、数量は一時的に無制限です

#関連ドキュメント

wxacode.getUnlimited ミニ プログラム コード生成インターフェイスのドキュメント

cloud.uploadFile ローカル リソースをクラウド ストレージにアップロードする

結論

小さなプログラムで小さなプログラム コードを生成するには 2 つの方法があります。1 つは https 呼び出しです。この記事では、クラウド呼び出しが最も単純で、access_token と認証を取得する必要がありません。

ミニ プログラム側でアプレット コードを生成するクラウド関数リクエストを開始します。クラウド関数側はクラウド関数を借用 wxcode.getUnlimitedインターフェースを呼び出してミニプログラムコードを生成し、クラウドストレージにアップロードし、クラウドストレージ上の画像のファイルIDを返し、クラウド関数から返されたファイルIDを取得しますミニプログラム側で、このファイルIDに基づいてミニプログラムのコードを表示します

関連する推奨事項:

ミニプログラム開発チュートリアル

以上がアプレット内でアプレットコードを生成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:juejin.im
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート