将消息从 Facebook webview 发送回机器人

Question

已经为 Facebook Messenger 在 ms bot 框架上编写了 bot，它在 webview 页面上创建 carousel using custom channel data attachment with web_url which enables messenger extensions: "messenger_extensions": true. We have Added Messenger Extensions，但不清楚如何从这里发送带有附件的消息 webview 页面返回到 Messenger，因此返回到 bot 框架。

<!DOCTYPE html>
<html>

<body>
    <style type="text/css">
        .button {
            background-color: #4CAF50;
            /* Green */
            border: none;
            color: white;
            padding: 15px 32px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            width: 50%;
            margin: 25%;
        }
    </style>

    <button type="button" class="button" onclick="sendMessage();">Complete Booking</button>

    <script type="text/javascript">
        function sendMessage() {
            alert('Booking completed. What to do now? How to send the message back to bot?')
            /// how to return? the facebook docs don't say anything
            /// you HAVE to make a server round trip.. 
            return {
                text: "HOTEL_SERVICE_PAYLOAD",
                attachments: [
                    {
                        email: "some@email.com",
                        hotelName: "Hotel marriott",
                        confirmNumber: "1234567"
                    }
                ]
            }
            MessengerExtensions.requestCloseBrowser(function success() {

            }, function error(err) {

            });
        }

        (function (d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) { return; }
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.com/en_US/messenger.Extensions.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, "script", "Messenger"));

        window.extAsyncInit = function () {
            // the Messenger Extensions JS SDK is done loading
            MessengerExtensions.getUserID(function success(uids) {
                var psid = uids.psid;//This is your page scoped sender_id
                alert("Getting PSID")
                alert("This is the user's psid " + psid);
            }, function error(err) {
                alert("Messenger Extension Error: " + err);
            });
        };
    </script>
</body>
</html>

阅读了大量 documentation and blogs including Whosebug: 。

页面上是否嵌入了 JavaScript 脚本的简单示例？谢谢！

Answer 1

如果我对问题的理解正确，您可以设置触发消息发送的 API 端点，并在 `MessengerExtensions.requestCloseBrowser() 的成功回调中命中该端点。

使用 jQuery 和节点的 express 模块的示例：

网络视图：

window.extAsyncInit = function () {
    // the Messenger Extensions JS SDK is done loading
    MessengerExtensions.getUserID(function success(uids) {
        var psid = uids.psid;//This is your page scoped sender_id
        $.post('https://myapi.com/sendOnWebviewClose', {"psid": psid})
    }, function error(err) {
        alert("Messenger Extension Error: " + err);
    });
};

服务器：

app.post('/sendOnWebviewClose', (req, res) => {
  let psid = req.body.psid;
  sendMessage(psid);
})

Answer 2

可以使用 get 请求发送参数，(https://someurl?userChannelID=)，然后在您的 js 代码中使用它们，以从您的服务器触发一条消息（我们使用直线）

将消息从 Facebook webview 发送回机器人

Send message back from Facebook webview to bot

webview

webhooks

node.js

facebook-messenger

botframework