您可以将 Google 信息与 RCS 和 Google 钱包结合使用来设计无缝的签到流程：用户完成签到，收到登机牌后，再从“信息”应用中将其直接添加到 Google 钱包。进入航班钱包后，如果航班详情发生变化，卡券会自动更新。用户可以直接在手机上快速访问最新的登机牌。
本文档介绍了实现 Google 钱包流程的登机牌的技术步骤。此外，它还提供了一个示例对话，提供设计提示，助您通过 RBM 获得顺畅、高效的签到体验。
技术实现
如需实现 Google 钱包流程的登机牌，您将使用 Google Wallet API 和 RBM API。
前提条件
要开始使用 Google Wallet API，请按照以下必要步骤操作：
- 注册 Google 钱包发卡机构帐号，这样您就可以为 Google 钱包创建和分发卡券。
- 创建 Google Cloud Platform (GCP) 项目（如果您还没有的话）。
- 启用 Google Wallet API。
- 创建服务帐号和密钥，以便您可以调用 Google Wallet API。
- 在 Google Pay 和钱包控制台中为服务帐号授权。
- 请使用登机牌模板创建新的登机课程。
Google 钱包 API
如需创建登机牌并生成 RBM 的“添加到 Google 钱包”网址，请按照这些步骤操作：
- 执行必要的身份验证和授权。
- 创建卡券对象。
- 获取已签名的 JSON Web 令牌 (JWT)。已编码的 JWT 的长度上限为 2048 个字符。
- 使用 JWT 生成“添加到 Google 钱包”网址。
RBM API
如需从 RBM 发送“添加到 Google 钱包”建议，请发送“打开网址”操作。 在消息载荷中，执行以下操作：
- 对于“
text”，输入“添加到 Google 钱包”。 - 对于
url，输入“添加到 Google 钱包”网址。
Google 钱包图标会自动显示在建议标签上。
对话设计
此示例使用对话的独特功能来引导用户完成完整的签到流程。它演示了如何使用自然对话框和丰富的功能（如一键式建议和复合信息卡）帮助用户实现目标。在本例中，他们的目标是：(1) 自定义我的航班体验；(2) 接收我的登机牌；(3) 将其添加到 Google 钱包中，以便在机场轻松使用。
以下是对话概览。然后是设计提示和流程的分步详解。如需为代理实现类似的设计，请参阅步骤下方的代码示例。
设计建议
在设计签到流程时，请牢记以下原则：
- 您的第一条消息是最重要的。简要说明对话的目的，以便用户有理由与之互动。
- 每条消息都应提供少量信息并提示用户做出响应。建议的回复和建议的操作可让您轻松执行下一步。
- 您的代理应该是响应式的，而不是机器人的。请使用能体现您的品牌语气的语言。您如何向客户提出理想的品牌代表聊天？
- 人们会觉得自己很特别。您可以根据用户的航班历史记录推荐座位或餐点，从而为他们办理登机手续的个性化。
- 复合信息卡和轮播界面可让对话更具活力。您可以分享图片和详细信息，帮助用户在选项中进行选择。
- 好的对话会收尾。在发送用户的登机牌之前，请确认用户的办理登机手续详细信息。通过友好的发送方式增加人工联系。
签到流程
代理会通知用户办理登机手续。
代码示例
const suggestions = [ { reply: { text: '⚡ Check in', postbackData: 'checkIn', }, }, { reply: { text: '⏰ Remind me later', postbackData: 'remindMe', }, }, { reply: { text: '✈️ View my flight details', postbackData: 'flightDetails', }, }, { reply: { text: '🔀 Change my flight', postbackData: 'flightChange', }, }, ]; const params = { messageText: 'Check-in for your flight', messageDescription: '👏 Happy morning, Jo! Check-in is now open for your flight from London to Mumbai on ' + getFlightTime() + ' at 2:00PM. What would you like to do? ', msisdn: phoneNumber, suggestions: suggestions, imageUrl: getImageUrl('fly.png'), height: 'MEDIUM', }; rbmApiHelper.sendRichCard(params);用户点按建议的回复以签到。
客服人员为签到流程设定了预期。
代码示例
const params = { messageText: "OK, great. It's just 3 simple steps to check in. Here's the first step to get you onboard:", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendPolicyImage(msisdn); });代理会要求用户同意安全政策。
代码示例
const suggestions = [ { reply: { text: 'Yes, I agree', postbackData: 'policy_agree', }, }, { reply: { text: "No, I don't agree", postbackData: 'policy_nack', }, }, ]; const params = { messageText: 'Baggage safety policy', messageDescription: 'To help us ensure a safe flight, please review our safety policy and let us know you agree', msisdn: msisdn, suggestions: suggestions, imageUrl: getImageUrl('policyImage.png'), height: 'MEDIUM', orientation: 'HORIZONTAL', thumbnailImageAlignment: 'LEFT', }; rbmApiHelper.sendRichCard(params);用户点按建议的回复以表示同意。
客服人员会感谢用户并介绍下一步。
代码示例
const params = { messageText: "Thank you - A safe passenger is a happy passenger! Here's the next step:", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendPlan(msisdn); });代理会提示用户选择座位。
代码示例
const suggestions = [ { reply: { text: 'View the seat map', postbackData: 'view_seat_map', }, }, ]; const outerSuggestions = [ { reply: { text: '17A', postbackData: 'seat_17A', }, }, { reply: { text: '17C', postbackData: 'seat_17C', }, }, { reply: { text: '18A', postbackData: 'seat_18A', }, }, { reply: { text: 'Show me more', postbackData: 'more', }, }, ]; const params = { messageText: 'Choose your seat', messageDescription: "It's time to sit back and get comfy! 💺 We've recommended some seats based on your last flight. Choose the one you want, or let us know your preferred seat by typing the number.", msisdn: msisdn, imageUrl: getImageUrl('seatMap.png'), height: 'TALL', orientation: 'VERTICAL', outerSuggestions: outerSuggestions }; rbmApiHelper.sendRichCard(params);用户点按所选座位的建议回复。
代理会确认用户的选择。
代码示例
this.seatmap[msisdn] = seat; const params = { messageText: `Seat ${seat}, you got it`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function(res) { self.sendFoodOptions(msisdn); });代理会要求用户选择在乘坐飞机时用餐。
代码示例
const params = { messageText: `Now let's talk food 😋 You can pre-order your in-flight meal. Would you be happy with a vegetarian entree or a chicken entree?`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function(res) { self.sendFoodDetails(msisdn); });代理会显示膳食选项。
代码示例
const cardContents = [ { title: 'Panzanella salad (v)', description: 'Ingredients: bread, lettuce, onions, tomatoes, olive oil', suggestions: [ { reply: { text: 'Choose vegetarian', postbackData: 'veggie', }, }, ], media: { height: 'MEDIUM', contentInfo: { fileUrl: getImageUrl('salad.jpg'), }, }, }, { title: 'Grilled chicken with greens', description: 'Ingredients: chicken, potatoes, peppers, olive oil', suggestions: [ { reply: { text: 'Choose chicken', postbackData: 'chicken', }, }, ], media: { height: 'MEDIUM', contentInfo: { fileUrl: getImageUrl('chicken.png'), }, }, }, ]; const params = { msisdn: msisdn, cardContents: cardContents, }; rbmApiHelper.sendCarouselCard(params);用户点按所选餐点的建议回复。
代理会确认用户的选择。
代码示例
const params = { messageText: `Vegetarian it is 💚`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendAskConfirmation(msisdn); });代理汇总签到的详细信息。
代码示例
let seat = this.seatmap[msisdn]; const suggestions = [ { reply: { text: "Yes, I'm happy with that", postbackData: 'happy', }, }, { reply: { text: 'Change my seat', postbackData: 'change_seat', }, }, { reply: { text: 'Change my meal', postbackData: 'change_meal', }, }, ]; const params = { messageText: "Here's what we've noted down: You've opted for seat " + seat + " and a vegetarian meal. Please confirm your choices.", msisdn: msisdn, suggestions: suggestions }; rbmApiHelper.sendMessage(params);用户点按建议的回复，以确认办理登机手续的详细信息。
客服人员会告知确认已完成。
代码示例
const params = { messageText: "Hooray! You're now checked in for your flight ☑️ Here's your boarding pass. We're so happy to host you soon!", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendWalletPass(msisdn); });代理发送用户的登机牌。
代码示例
this.walletHelper.createFlightPassUrl(this.seatmap[msisdn]).then((url) => { let suggestions = [ { action: { text: 'Add to Google Wallet', postbackData: 'addToWallet', openUrlAction: { url: url }, }, }, ]; const params = { messageText: 'HS123 LHR to BOM\nPassenger: Jo Flow', messageDescription: "We'll keep you up to date! You'll get a notification if your flight details change.", msisdn: msisdn, suggestions: suggestions, imageUrl: getImageUrl('boardingPass.png'), height: 'TALL', orientation: 'HORIZONTAL', thumbnailImageAlignment: 'LEFT', }; rbmApiHelper.sendRichCard(params); });在这张水平复合卡中，图片是由航空公司提供的功能完备的登机牌。图片应显示所需的所有登机信息，包括可扫描的条形码。用户只需点按图片，即可通过 Google 的“信息”应用查看和扫描登机牌。
系统会在复合信息卡上显示添加到 Google 钱包建议。此建议会触发打开网址操作，该操作可打开 Google 钱包应用，在该应用中，用户可以轻松地将登机牌添加到钱包中。（如果应用不在用户设备上，系统会提示用户安装该应用）。将卡券添加到 Google 钱包后，如果航班详情发生变化，用户会自动收到航班提醒和状态更新。
凡是未向 Google 钱包添加卡券的用户，都应及时更新。向用户发送有关复合信息卡上显示的登机信息的任何变化。
用户点按建议的操作，将卡券添加到 Google 钱包。
系统会打开 Google 钱包应用。用户点按按钮即可将卡券添加到钱包。
用户点按按钮即可查看卡券。
系统会显示包含二维码的登机牌。
