WeChat ミニプログラムクラウド開発のクイックスタート

クラウド開発とは何ですか?

クラウド開発は、サーバーレスアーキテクチャを使用して、フルスタックを迅速に実現できるバックエンドクラウドサービスです。開発者はサーバーを構築する必要がなく、クラウドデータベース、クラウドストレージ、クラウド機能などのクラウドサービスの基本機能を直接利用できます。

この時点で、これと現在の従来の開発モデルの違いは何だろうと考えるかもしれません。実際に家を建てるプロセスを通して、従来の開発モデルとクラウド開発モデルの違いを理解してみましょう。

伝統的な方法で家を建てる場合、次の 6 つのステップが必要です。
1) 家の基礎を築き、構造を設計し、整理します。（バックエンドのクラウドサービス基盤）
２）住宅の安定性を判断する鍵でもある地梁。（クラウドデータベースの構築）
３）石積みの主体は家の基本構造を構築することです。（クラウドストレージの構築）
4）ステップハウスに土を入れ、地面を叩いて固めます。（クラウド機能の構築）
5) 屋根にセメントを敷き、密閉します。(静的ホスティングおよび拡張機能を提供します)
6) 好みのスタイルに装飾します。(ビジネス要件のロジックコードを書く)

クラウド開発モデルには、好みのスタイルに装飾するという 1 つのステップしかありません。図 1-1 は、従来の開発で管理する必要がある基本リソースとクラウド開発で管理する必要がある基本リソースの比較を示していることがわかります。これは、2 つの間のギャップをより明確に理解するのに役立ちます。

図 1-1 従来の開発で管理する必要がある基本リソース VS クラウド開発で管理する必要がある基本リソース

それでおしまい。クラウド開発では、インフラストラクチャを管理する必要がなく、データベース、ストレージ、機能、静的ホスティングなどの基本機能と拡張機能を提供する、完全なバックエンドクラウドサービスが提供されます。従来の開発モデルと比較して、クラウド開発では人件費を少なくとも 50% 節約し、配信効率を 70% 向上させることができます。

クラウド開発モデルの調整

その前に、元のコードボーイメモプロジェクトをクラウド開発プロジェクトに変更する必要があるため、まずプロジェクト管理からプロジェクトを削除する必要があります。(新しいクラウド開発プロジェクトの場合、この手順は無視できます)

まず、ミニプログラムのプロジェクト管理ページに入ります。

次に、右上隅の「管理」ボタンをクリックして、このページの管理ステータスを入力します。

次に、以前のスタンドアロンバージョンを選択し、削除するかどうかを確認します。

次に、インポートプロジェクトインターフェイスでクラウド開発を確認できます。

この時点で入力すると、アプレット開発ツールが一連のクラウド開発デモを自動的に生成し、それを直接処理することがわかります。

これは、ミニプログラム Yunkai デモコードの一部のモジュールが見つからないことを意味するため、これを無視して、最初にすべてのデモコードを削除してください。

削除後は、通常のページのレンダリングが表示されます。

通常の状態に戻り、次に変革する必要があるのはデータ運用のビジネスです。

データキャッシュがクラウド開発を変革

変革の前に、まずアイデアを整理する必要があります。

まずは、以前に学んだ抽象的な方法を見てみましょう。
データ操作に関連するすべてのメソッドは、保守が容易な js クラスに抽出されます。
すべてのメソッドをクラウドデータベース操作機能に置き換えます。

抽象データ操作 API

ルートディレクトリ直下にapiフォルダを追加し、その下にメモ全体の操作APIを格納するmemo.jsを追加します。

整理するにはどのような方法がありますか:

メモのリストを取得する
メモの詳細を取得する
メモ情報を追加する
メモ情報を削除する
メモ情報の変更

まず、関連するメソッドの関数名を選択してから、export ステートメントを作成します。
memo.js の完全なコード

まず、リストページの onShow 関数で呼び出されるメモリストを取得しましょう。

現時点では setData はページ操作関数なので、抽象化したい部分は次のとおりです。

次に、このコードを memo.js に配置します。

getMemoList に関する memo.js コードスニペット

それをリストページの呼び出しに置き換えて、まずメモのgetMemoList関数を導入します。
List.js ヘッダーはコードスニペットをインポートします

インポート後に onShow 関数で使用される
onShow 内のすべてのコードフラグメント

同様に、以前の取得内容、削除、変更をメモ.js に抽象化できます。
メモ.js のすべてのコード

対応するビジネスシナリオで呼び出しするには、呼び出しの前にメソッドを導入する必要があります。インポートされたコードは比較的繰り返しが多いため、以下にはインポートされたコードは掲載されず、使用されたコードのみが掲載されます。

コードメソッド呼び出しの削除:
list.js の del 関数のすべてのコード

メモの詳細を確認する Call:
edit.jsのonLoad関数の全コード

メソッド呼び出しの追加と削除:
edit.js の save 関数での保存と変更に関するコードスニペット

この時点で、最初のステップが完了しました。まずデータ操作オブジェクトを抽出し、次にクラウドデータベース操作を実行します。

クラウドデータベースの運用

データベースを初期化する

まず、クラウド開発コンソールに入りましょう。

次に「データベース」を選択します。

Cloud Development は JSON データベースを提供しており、その名前が示すように、データベース内の各レコードは JSON 形式のオブジェクトです。データベースには複数のコレクション (リレーショナルデータのテーブルに相当) を含めることができ、コレクションは JSON 配列とみなすことができます。配列内の各オブジェクトはレコードであり、レコードの形式は JSON オブジェクトです。

利用可能なコレクションが存在しないことがわかり、再度コレクションメモを作成してメモデータを保存します。

新しいデータを追加する

確認したい新しいテストデータを手動で追加して、「レコードの追加」をクリックしてみましょう。

上記のテストデータを使用して追加します

さらに、さまざまな種類のデータを追加できることがわかり、クラウド開発データベースでは次のデータタイプが提供されます。

文字列: 文字列
番号: 番号
オブジェクト: オブジェクト
配列: 配列
Bool: ブール値
日付時刻
地理: 複数の地理位置情報タイプ
ヌル

最初はデフォルトで文字列型のデータを使用しますが、追加が完了するとメモコレクションにデータが表示されます。

データテーブルにはすでにデータが含まれていますが、それを取得するにはどうすればよいでしょうか?

データベースデータを取得する

アプレット編集デスクに戻り、データの取得方法を修正してみましょう。

これはローカルデータを取得する方法、以下はデータベースを取得する方法です

電話をかけるためにリストページに移動すると、エラーが見つかりました。

その前にクラウド API を初期化する必要があることがわかりました。
ここで問題が発生します。後でクラウド API への呼び出しが多数発生するため、最初にすべてを初期化する必要があります。この初期化は 1 回だけ行う必要があります。この時点で初期化をどこで呼び出せばよいでしょうか?
アプリケーションの最初から関数を呼び出す必要があり、一度だけ呼び出す必要がある場合は、app.js の onLaunch ライフサイクルで関数を呼び出すことができます。
app.js の onLaunch 関数のコードスニペット

次に、呼び出しを見てみましょう。ここでデバッグテクニックを説明します。デバッガーの [ネットワーク] パネルを使用し、フィルターするクラウドラベルを選択します。ここで、先ほどの API リクエストを呼び出すことができます。

まずリクエストのステータスを確認します。ステータスの観点から見ると、これは成功したリクエストです。

次に、返されたデータを見てみましょう。

明らかにデータがあるのに、なぜそれを取得できないのでしょうか?
クラウド開発データベースコレクションの読み取り権限の問題が原因です。デフォルトでは、新しく作成されたコレクションの読み取り権限は、作成された場合にのみ読み書きできます。最初のテストデータは手動で入力されるため、作成者がいないため、デフォルトの権限を読み取ることはできません。
クラウド開発コントロールパネルにアクセスし、データベース => データ権限を見つけます。

権限を「作成者は読み書きのみ可能」から「すべてのユーザーが読み書き可能、作成者のみが読み書き可能」に変更してみます。変更が完了したら、取得メソッドを再度呼び出して、返された結果にこのテストデータが表示されることを確認します。

データは出てきますが、エラーログが残っていることがわかります。

特定のコードブロック:

理由: クラウド API を使用する前に使用していたキャッシュ操作 API は特定のデータを返す同期操作でしたが、変更されたデータ取得メソッドは非同期関数であり、リストページにデータが送信されて使用されることはありません。最終的に、リストデータオブジェクトは空になり、リストの長さは当然ながら未定義のエラーメッセージが表示されます。

上記の success メソッドの実装を使用してデータベースからデータを取得することに加えて、Promise スタイルでの呼び出しもサポートしています。単純に、
ラップされたコールバック関数の呼び出しメソッドをコールバック関数と呼ばれるチェーンに変更すると理解できます。