紹介
UDESK ビデオ通話ミニアプリコード
ソフトウェアカテゴリ
- 微信ネイティブミニアプリ
ディレクトリ構造説明
- udesk_avs_mp
- README.en.md
プログラム説明ファイル - README.md
プログラム説明ファイル - app.js
ミニアプリプロジェクト記述ファイル - app.json
ミニアプリプロジェクト記述ファイル - app.wxss
ミニアプリプロジェクト記述ファイル - miniprogram_npm
npm 依存関係 - node_modules
npm 依存関係 - package-lock.json
依存関係管理ファイル - package.json
依存関係管理ファイル - pages
サードパーティ拡張パッケージ、このパッケージ内で追加のビジネスロジックを開発可能 - plugin
ミニアプリビデオプラグインパッケージ、ミニアプリビデオ共通のビジネスおよび通話機能を含む- components
ミニアプリプラグイン内部コンポーネントライブラリ - enums
ミニアプリ列挙型パッケージ - images
画像ライブラリ - index.js
プラグインパッケージエントリファイル - libs
フォント依存ライブラリ - pages
ミニアプリプラグインビジネスパッケージ - agents
カスタマーサポートリストページ、オプション、カスタマーサポートリストが設定されている顧客に有効 - call
通話ページ、デフォルトの通話ページ - connect
ビデオ通話確立ページ - error
統一エラーハンドリングページ - form
オフラインフォーム、事前問い合わせフォームページ、オプション - goods
相談対象ページ、オプション、相談対象リストが設定されている顧客に有効 - msgHis
メッセージ履歴ページ - preIndex
前処理ロジックページ、主に認証、稼働時間、データ前処理を処理 - queue
待機ページ、通話待機状況を処理するために使用 - stores
ルーティングプラグインページ、オプション、ルーティングプラグインが設定されている顧客向け、通常カスタマーサポートリストと併用 - survery
満足度評価ページ、満足度評価ロジックを処理、オプション、満足度評価が設定されている顧客に有効 - verifyCode
認証コード入力ページ、オプション、通話認証が有効な顧客にこのページを表示 - wait
応答待機ページ、待機ページとは異なり、このページに入ると顧客は待機列から外れ、カスタマーサポートの応答を待つ状態 - utils
ユーティリティパッケージ
- components
インストールチュートリアル
このリポジトリをクローンし、微信ミニアプリ開発者ツールにインポートします
使用説明
-
使用前にこのドキュメント(http://udesk.udesk.cn/hc/articles/222881)を読み、ドキュメントに記載されている操作が完了していることを確認してください
-
サブパッケージインポート説明(ソースコード連携でミニアプリサイズ制限を超える場合、サブパッケージを使用可能)、参照アドレス (https://developers.weixin.qq.com/miniprogram/dev/framework/subpackages/basic.html)
-
app.jsonにweui依存関係を追加します。この依存方法では、weui-miniprogramはメインパッケージサイズを占有しません。
例1を参照 -
app.jsonでpluginパッケージをサブパッケージに調整します。調整が必要なページは以下の通りです。
例2を参照
-
例1
"useExtendedLib": {
"weui": true
}
例2
{
"pages": [
"pages/index/index"
],
"subPackages": [
{
"root": "plugin/",
"pages": [
"pages/preIndex/index",
"pages/call/index",
"pages/queue/index",
"pages/wait/wait",
"pages/connect/connect",
"pages/survery/survery",
"pages/goods/index",
"pages/error/index",
"pages/stores/index",
"pages/agents/index",
"pages/form/index",
"pages/verifyCode/index",
"pages/msgHis/msgHis"
]
}
],
"window": {
"enablePullDownRefresh": false,
"navigationBarTitleText": ""
},
"sitemapLocation": "sitemap.json",
"useExtendedLib": {
"weui": true
},
"permission": {
"scope.userLocation": {
"desc": "あなたの位置情報は、近くの店舗までの距離を計算するために使用されます"
}
}
}
-
設定ファイル説明(通常、ソースコードにはミニアプリsdkAppIdが提供されており、開発者ツールにインポートして直接使用できます)
- app.js 既存のミニアプリに組み込む場合、app.jsのロジックを保持する必要があります。
例3を参照
- app.js 既存のミニアプリに組み込む場合、app.jsのロジックを保持する必要があります。
例3
App({
onLaunch: function (res) {
},
onShow: function (res) {
},
//グローバルキャッシュオブジェクト。
miniReferer: {
sdkAppId: 's3233faUJs0Jm2x',
},
});
-
ページ間ジャンプ連携説明
-
ミニアプリホームページをpages/index/indexに調整します
-
連携データ転送説明
-
フロー概要
-
顧客ミニアプリがビジネスロジックを完了した後、ビデオページにジャンプして通話を行い、通話完了後に顧客ミニアプリページに戻ります。
-
フロー詳細
-
通話回数制限について
- 顧客ミニアプリがビデオミニアプリページにcallTimesパラメータを渡し、ビデオミニアプリはこのパラメータに基づいて通話回数を制御します
- 通話回数が不足している場合、顧客ミニアプリページに戻ります
-
顧客ミニアプリページにジャンプするタイミングについて
- 通話回数が不足している場合にジャンプ
- ビデオ終了時にジャンプ
- 満足度評価時にジャンプ
-
-
ページ間ジャンプ方法の説明
- 顧客ミニアプリがビジネスを完了した後のジャンプ先ページアドレス: plugins/pages/preIndex/index
- パラメータ転送説明
- パラメータ転送方法
- ページジャンプ前に転送するパラメータを app.globalData.udeskAvsMiniReferer に保存します
- 署名検証方法
- ページ間ジャンプでは署名検証は不要です
- ページ間ジャンプデモ(サポートパラメータを含む)
例4を参照
- パラメータ転送方法
-
-
例4
navigateToMiniPage: function(){
app.miniReferer = {
sdkAppId:'s3233faUJs0Jm2x', //ミニアプリ認証済みsdkAppId
customerInfo: {
//顧客情報
// id:123, //顧客ID 渡さない場合は自動的に新規顧客が作成されます
nickName: "テスト顧客", //ニックネーム
avatar: "", //顧客アイコンアドレス
// email: "2311153387332@qq.com",
// telephones: [
// { id: null, content: "14312223333" },
// { id: null, content: "17422112233" },
// ], // 電話 [{id,電話番号}], idを渡さないかidがnullの場合は新規追加を意味します
// description: "顧客説明", //顧客説明
// level: "vip", // 顧客レベル, 'vip'(vip顧客)または'normal'(通常顧客)
// customerToken: null, //顧客外部識別子、サードパーティが提供する顧客の一意な識別子。この識別子が同じ場合、udeskは同じユーザーとして認識します
// organizationIds: [1, 2], // 顧客会社id、事前に顧客会社リスト取得インターフェースを呼び出す必要があります
// customFields: {
// //顧客カスタムフィールド 値TextField_1 は顧客が連結します(事前に顧客カスタムフィールド取得インターフェースを呼び出す必要があります)
// TextField_1: "通常テキスト内容",
// SelectField_1: ["0"],
// },
},
// ビジネス記録情報 必須ではありません
// noteInfo: {
// content: "テストタイトル123",
// customFields: {
// //顧客カスタムフィールド 値TextField_1 は顧客が連結します(事前に顧客カスタムフィールド取得インターフェースを呼び出す必要があります)
// TextField_1: "通常テキスト内容", //通常テキスト
// SelectField_8: "1",
// SelectField_5: "1", //ラジオボタン
// SelectField_1641: "1", //単一選択ドロップダウン
// SelectField_1645: "0,1,2,3" //複数選択
// }
// },
// bizId: "", // 連携側ビジネスid、イベントコールバックで通話記録をプッシュする際にbizIdが返され、サードパーティは通話記録を対応する注文に紐付けることができます。
callTimes: 1, //許可通話回数 -1は制限なし デフォルト -1
//customChannel: "beijing", //カスタムチャネル デフォルトは空
callDirect: { //相談対象リストとルーティングリストを使用する場合、このオブジェクトを初期化できません
enable: false,
//agentId: '12',
//agentGroupId: '13'
}, //直接通話フローに入ります。 デフォルトfalse オプション true/false
voiceOnly: false, //音声モードのみを使用するかどうか、デフォルトfalse オプション true/false
/**
戻りジャンプ説明:
1.commonNavigateを設定。満足度ページがある場合は満足度ページで戻りジャンプ、満足度ページがない場合は通話終了後に戻りジャンプ
2.ミニアプリに戻る際、pathの後にnavigateTypeプロパティが追加されます。プロパティ値は 1 認証失敗ジャンプ 2 通話回数不足ジャンプ、3通話終了ジャンプ、4満足度評価ジャンプ タイプは数字
3. pathの後にbizIdを追加し、顧客ビジネス主キー値を透過転送
* */
commonNavigate: {
path: "/pages/index/index",
},
currentNavigateType:'navigateInPage'
}
console.log(app.miniReferer);
wx.redirectTo({
url: '/plugin/pages/preIndex/index',
})
},
-
ミニアプリ間ジャンプ連携説明(ミニアプリジャンプのプロンプトあり、微信制限)
-
連携データ転送説明
-
フロー概要
- 顧客ミニアプリがビジネスロジックを完了した後、ビデオミニアプリにジャンプして通話を行い、通話完了後に顧客ミニアプリに戻ります。(ミニアプリジャンプのプロンプトあり)
-
フロー詳細
-
通話回数制限について
- 顧客ミニアプリがビデオミニアプリにcallTimesパラメータを渡し、ビデオミニアプリはこのパラメータに基づいて通話回数を制御します
- 通話回数が不足している場合、顧客ミニアプリに戻ります
-
顧客ミニアプリにジャンプするタイミングについて
- 通話回数が不足している場合にジャンプ
- ビデオ終了時にジャンプ
- 満足度評価時にジャンプ
-
-
-
ミニアプリ間ジャンプデモ
例5を参照
-
例5
navigateToMiniProgram: function () {
wx.navigateToMiniProgram({
appId: "wx2e1223222cf230d0",
envVersion: "trial", // develop 開発版、trial 体験版、release 正式版、デフォルトは正式版
/**
* sign 署名方式 sha256("微信ミニアプリID"+"ジャンプパス(クエスチョンマークとパラメータを除く)"+"extraDataリクエストボディ文字列"+"秘密鍵"+"nonce(uuidでリクエストを一意に識別)"+"timestamp(タイムスタンプ)")
*/
path:
"plugin/pages/preIndex/index?sign=b46e9cba961f30889d0f0de4312b7b732ba4f7e081562ef5d1d27556258843bf&nonce=c33442bdffaa×tamp=12233311",
extraData: {
options: {
sdkAppId: 's3233faUJs0Jm2x',
customerInfo: {
//顧客情報
// id: 1222, //空の場合、ミニアプリは新規顧客を作成します
nickName: "テスト顧客", //ニックネーム
//avatar: "", //顧客アイコンアドレス
// email: "2333387332@qq.com",
// telephones: [
// { id: null, content: "13312223333" },
// { id: null, content: "13422112233" },
// ], // 電話 [{id,電話番号}], idを渡さないかidがnullの場合は新規追加を意味します
// description: "顧客説明", //顧客説明
// level: "vip", // 顧客レベル, 'vip'(vip顧客)または'normal'(通常顧客)
// customerToken: "", //顧客外部識別子、サードパーティが提供する顧客の一意な識別子。この識別子が同じ場合、udeskは同じユーザーとして認識します
// organizationIds: [1, 2], // 顧客会社id、事前に顧客会社リスト取得インターフェースを呼び出す必要があります
// customFields: {
// //顧客カスタムフィールド 値TextField_1 は顧客が連結します(事前に顧客カスタムフィールド取得インターフェースを呼び出す必要があります)
// TextField_1: "通常テキスト内容",
// SelectField_1: ["0"],
// },
},
// ビジネス記録情報 必須ではありません
// noteInfo: {
// content: "テストタイトル123",
// customFields: {
// //顧客カスタムフィールド 値TextField_1 は顧客が連結します(事前に顧客カスタムフィールド取得インターフェースを呼び出す必要があります)
// TextField_1: "通常テキスト内容", //通常テキスト
// SelectField_8: "1",
// SelectField_5: "1", //ラジオボタン
// SelectField_1641: "1", //単一選択ドロップダウン
// SelectField_1645: "0,1,2,3" //複数選択
// }
// },
// bizId: "123abc", // 連携側ビジネスid、イベントコールバックで通話記録をプッシュする際にbizIdが返され、サードパーティは通話記録を対応する注文に紐付けることができます。
callTimes: 1, //許可通話回数 -1は制限なし デフォルト -1
// customChannel: "beijing", //カスタムチャネル デフォルトは空
callDirect: { //相談対象リストとルーティングリストを使用する場合、このオブジェクトを初期化できません
enable: true, //ミニアプリにジャンプ後、直接通話フローに入ります。 デフォルトfalse オプション true/false
// agentId: 12, // カスタマーサポートid 必須ではありません
// agentGroupId: 7, // カスタマーサポートグループid 必須ではありません
},
voiceOnly: false, //音声モードのみを使用するかどうか、デフォルトfalse オプション true/false
}
}
})
},