Sending Message from Web Messenger in Smooch

I'm having the problem below when I call the code from https://github.com/smooch/smooch-web/

smooch.4.5.4.min.js:5 Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('file://') does not match the recipient window's origin ('null').

Also, the code below is in the way I'm getting this problem.

<!DOCTYPE html>
<html>
<head>
    <link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

    <!-- Trecho 1: adicionar antes do fim do head -->
    <script>
        ! function(e, n, t, r) {
            function o() {
                try {
                    var e;
                    if ((e = "string" == typeof this.response ? JSON.parse(this.response) : this.response).url) {
                        var t = n.getElementsByTagName("script")[0],
                            r = n.createElement("script");
                        r.async = !0, r.src = e.url, t.parentNode.insertBefore(r, t)
                    }
                } catch (e) {}
            }
            var s, p, a, i = [],
                c = [];
            e[t] = {
                init: function() {
                    s = arguments;
                    var e = {
                        then: function(n) {
                            return c.push({
                                type: "t",
                                next: n
                            }), e
                        },
                        catch: function(n) {
                            return c.push({
                                type: "c",
                                next: n
                            }), e
                        }
                    };
                    return e
                },
                on: function() {
                    i.push(arguments)
                },
                render: function() {
                    p = arguments
                },
                destroy: function() {
                    a = arguments
                }
            }, e.__onWebMessengerHostReady__ = function(n) {
                if (delete e.__onWebMessengerHostReady__, e[t] = n, s)
                    for (var r = n.init.apply(n, s), o = 0; o < c.length; o++) {
                        var u = c[o];
                        r = "t" === u.type ? r.then(u.next) : r.catch(u.next)
                    }
                p && n.render.apply(n, p), a && n.destroy.apply(n, a);
                for (o = 0; o < i.length; o++) n.on.apply(n, i[o])
            };
            var u = new XMLHttpRequest;
            u.addEventListener("load", o), u.open("GET", "https://" + r + ".webloader.smooch.io/", !0), u.responseType = "json", u.send()
        }(window, document, "Smooch", "<APP_ID>");
    </script>
</head>

<body>
    <div class="main-content">
        <h1>
            Página Teste
        </h1>
    </div>

    <script>

        Smooch.init({
            appId: '<APP_ID>'}).then(function() {
            // Your code after init is complete

        });

    </script>

</body>

When I type a message from slack or from telegram, the message arrives to web messenger. However, when I type the message from web messenger, it doesn't go to telegram and slack.

I have three integrations: telegram, slack and web messenger.

Could you help to solve this problem, please?

Solution

To get rid of the error

smooch.4.5.4.min.js:5 Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('file://') does not match the recipient window's origin ('null')

you need to serve your html file from a server, try something like Python's simpleHTTPServer (or anything you prefer)

python -m SimpleHTTPServer 8000

then just navigate to http://localhost:8000.

Now, let's talk about what to expect from the channels. Slack is a business system that you can use to respond to users sending messages from Telegram and the web messenger. Once you solve the above problem with the web messenger, messages will go through to Slack.

I want to emphasize that Telegram and the web messenger are fundamentally different from Slack as a channel. Telegram and web are end-user channels which a business's customers can use to talk to a business. The business uses Slack to receive those messages and respond to their customers.