Gupshup 聊天 Web 小部件重定向问题



我用Gupshup构建了一个机器人,这确实是一个很酷的工具。他们为我们提供了一个可以放在任何网站上的网络小部件。但是小部件似乎存在非常严重的问题。假设我将小部件放在我的页面 www.xyz.com 上。从桌面使用时,THings很好。当我从我的Android设备打开它时,小部件将我重定向到 Builquickbots.com 这不应该发生。我该如何解决这个严重的问题?

他们提供的小部件的 UI 代码

<script>
window.tcAsyncInit = function() {
tc.init ({
botkey: "fe2c4c7-p4opop9-0000-0000-243gg7366d69",
appUISetting : '%7B%22minimisedScreen%22%3A%7B%22minText%22%3A%22Chat%20with%20Me%22%2C%22width%22%3A%22350%22%2C%22textColor%22%3A%22%23565656%22%7D%2C%22chatScreen%22%3A%7B%22maxText%22%3A%22Me%20Online%22%2C%22imageDisplayType%22%3A%22rectangular%22%2C%22textColor%22%3A%22%23000000%22%7D%2C%22loginScreen%22%3A%7B%22height%22%3A%22410%22%2C%22formHeading%22%3A%22Please%20tell%20us%20about%20yourself.%22%2C%22nameLabel%22%3A%22Add%20Name%22%2C%22emailLabel%22%3A%22Add%20Email%22%2C%22phoneLabel%22%3A%22Add%20Phone%20No%22%2C%22messageLabel%22%3A%22Add%20Message%22%2C%22submitBtnText%22%3A%22Start%20Chatting%22%7D%2C%22contentScreen%22%3A%7B%22customfontSize%22%3A%2214%22%2C%22fontFamily%22%3A%22sans-serif%22%2C%22botBgColor%22%3A%22%23e2e2e2%22%2C%22botColor%22%3A%22%23444%22%2C%22userBgColor%22%3A%22%23acdae9%22%2C%22userColor%22%3A%22%23000000%22%7D%2C%22commonWidget%22%3A%7B%22width%22%3A%22350%22%2C%22height%22%3A%22370%22%2C%22bgColor%22%3A%22%23eeeeee%22%2C%22bgImage%22%3A%22https%3A//media.licdn.com/mpr/mpr/shrink_200_200/AAEAAQAAAAAAAAbRAAAAJDNjNzljNWFlLTNiZjctNDZmNC1iNTQzLWI0ODNkMzRmYWQxMw.png%22%2C%22perMenuImg%22%3A%22%22%2C%22borderColor%22%3A%22%23d4d4d4%22%2C%22textColor%22%3A%22%23ff4400%22%2C%22titleTextFont%22%3A%2218%22%2C%22titleWinHeight%22%3A%2245%22%2C%22RDStatus%22%3A%22No%22%2C%22webView%22%3A%22Yes%22%2C%22isResponsive%22%3A%22Yes%22%2C%22msgEncryption%22%3A%22No%22%2C%22allowHtmlFromBot%22%3A%22No%22%2C%22widgetType%22%3A%22Normal%22%2C%22persistenceMenu%22%3A%22%7B%20%5Ct%5C%22disableinput%5C%22%3A%20false%2C%20%5Ct%5C%22menu%5C%22%3A%20%5B%7B%20%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Templates%5C%22%2C%20%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22nested%5C%22%2C%20%5Ct%5Ct%5C%22menu%5C%22%3A%20%5B%7B%20%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Word%20Templates%5C%22%2C%20%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22text%5C%22%20%5Ct%5Ct%7D%2C%20%7B%20%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Powerpoint%20Templates%5C%22%2C%20%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22nested%5C%22%2C%20%5Ct%5Ct%5Ct%5C%22menu%5C%22%3A%20%5B%7B%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Blank%5C%22%2C%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22text%5C%22%20%5Ct%5Ct%5Ct%5Ct%7D%2C%20%5Ct%5Ct%5Ct%5Ct%7B%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Customer%20Account%20Planning%5C%22%2C%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22text%5C%22%20%5Ct%5Ct%5Ct%5Ct%7D%2C%20%5Ct%5Ct%5Ct%5Ct%7B%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Interim%20Guidelines%5C%22%2C%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22text%5C%22%20%5Ct%5Ct%5Ct%5Ct%7D%2C%20%5Ct%5Ct%5Ct%5Ct%7B%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22title%5C%22%3A%20%5C%22Account%20Planning%5C%22%2C%20%5Ct%5Ct%5Ct%5Ct%5Ct%5C%22type%5C%22%3A%20%5C%22text%5C%22%20%5Ct%5Ct%5Ct%5Ct%7D%20%5Ct%5Ct%5Ct%5D%20%5Ct%5Ct%7D%5D%20%5Ct%7D%5D%20%7D%22%2C%22logo%22%3A%22https%3A//www.gupshup.io/images/botwidget/ic_dummy_chat_g.png%22%2C%22user%22%3A%22http%3A//www.buildquickbots.com/widget/bots/8d755751f41ebca83f2f90e3781615e4/2328c115a6043bb25539fdf3e968a770/user.png%22%2C%22bot%22%3A%22http%3A//www.buildquickbots.com/widget/bots/8d755751f41ebca83f2f90e3781615e4/2328c115a6043bb25539fdf3e968a770/bot.png%22%7D%7D',
version : 'v2'
});
};
(function(d, s, id){
var js, tjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
css = d.createElement('link');
css.type = "text/css";
css.rel = "stylesheet";
css.href = '//www.buildquickbots.com/botwidget/v2/demo/static/css/style.css';
css1 = d.createElement('link');
css1.type = "text/css";
css1.rel = "stylesheet";
css1.href = 'https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.css';
js.src = '//www.buildquickbots.com/botwidget/v2/demo/static/js/sdk.js';
tjs.parentNode.insertBefore(js, tjs);
tjs.parentNode.insertBefore(css,tjs);
tjs.parentNode.insertBefore(css1,tjs);
}(document, 'script', 'tc-sdk'));
</script>

如何解决此问题?

您可以创建托管在任何域上的自定义 html 页面,并在 iframe 标记中加载机器人小部件。这是带有 iframe 的 html 代码。

<html>
<head>
</head>
<body>
<iframe id ="some_iframe_id" style="position: absolute; top: 0px; left: 0px; width: 99%; height: 99%; margin: 0px; padding: 0px;"></iframe>
<script>
window.tcAsyncInit = function (a) {
var userid = "anon:" + Math.floor(Math.random() * 100000);
var username="User";
a.init({
botkey: "{{BOT_KEY}}",
version: "3",
appUISetting:"%7B%22openMode%22%3A%7B%22text%22%3A%22Mubble%20Assistant%22%2C%22height%22%3A390%2C%22width%22%3A320%7D%2C%22closeMode%22%3A%7B%22text%22%3A%22Mubble%20Assistant%22%2C%22width%22%3A250%2C%22displayType%22%3A%22rectangular%22%7D%2C%22common%22%3A%7B%22logo%22%3A%22https%3A//www.gupshup.io/images/botwidget/ic_dummy_chat_g.png%22%2C%22imgDispType%22%3A%22circular%22%2C%22bgColor%22%3A%22%23765999%22%2C%22fontSize%22%3A16%2C%22fontColor%22%3A%22%23ffffff%22%7D%2C%22content%22%3A%7B%22bot%22%3A%22https%3A//www.gupshup.io/images/botwidget/ic_bot.png%22%2C%22botBubbleColor%22%3A%22%23f5f5f5%22%2C%22botFontColor%22%3A%22%23797979%22%2C%22user%22%3A%22https%3A//www.gupshup.io/images/botwidget/ic_user.png%22%2C%22userBubbleColor%22%3A%22%23765999%22%2C%22userFontColor%22%3A%22%23ffffff%22%2C%22pageTitle%22%3A%22Chat%20Bot%22%2C%22fontSize%22%3A14%2C%22fontFamily%22%3A%22sans-serif%22%7D%2C%22config%22%3A%7B%22persistenceMenu%22%3A%22%7B%5C%22disableinput%5C%22%3Afalse%2C%5C%22menu%5C%22%3A%5B%7B%5C%22title%5C%22%3A%5C%22Level1%20-%20Element1%5C%22%2C%5C%22type%5C%22%3A%5C%22nested%5C%22%2C%5C%22menu%5C%22%3A%5B%7B%5C%22title%5C%22%3A%5C%22Level2%20-%20Element1%5C%22%2C%5C%22type%5C%22%3A%5C%22text%5C%22%7D%2C%7B%5C%22title%5C%22%3A%5C%22Level2%20-%20Element2%5C%22%2C%5C%22type%5C%22%3A%5C%22nested%5C%22%2C%5C%22menu%5C%22%3A%5B%7B%5C%22title%5C%22%3A%5C%22Level3%20-%20Element1%5C%22%2C%5C%22type%5C%22%3A%5C%22text%5C%22%7D%5D%7D%2C%7B%5C%22title%5C%22%3A%5C%22Level2%20-%20Element4%5C%22%2C%5C%22type%5C%22%3A%5C%22nested%5C%22%2C%5C%22menu%5C%22%3A%5B%7B%5C%22title%5C%22%3A%5C%22Level3%20-%20Element1%5C%22%2C%5C%22type%5C%22%3A%5C%22text%5C%22%7D%5D%7D%2C%7B%5C%22title%5C%22%3A%5C%22Level2%20-%20Element5%5C%22%2C%5C%22type%5C%22%3A%5C%22text%5C%22%7D%5D%7D%2C%7B%5C%22title%5C%22%3A%5C%22Level2%20-%20Element4.1%5C%22%2C%5C%22type%5C%22%3A%5C%22text%5C%22%7D%5D%7D%22%2C%22perMenuImg%22%3A%22%22%2C%22attachment%22%3A%22Yes%22%2C%22widgetType%22%3A%22Text%22%2C%22msgEnc%22%3A%22No%22%2C%22webView%22%3A%22Yes%22%2C%22RDStatus%22%3A%22No%22%2C%22isResponsive%22%3A%22No%22%7D%7D",
userObj: {
"roomid": userid,
"sender": {
"id": userid,
"name": username
},
"recipient": {
"id": userid,
"name": "Bot"
},
"message": {
"text": "Hello",
"type": "text"
}
}
}, function(){
document.getElementById('some_iframe_id').src = a.getRedirectUrl();
});
};
</script>
<script id="gs-sdk" src='//www.buildquickbots.com/botwidget/v3/demo/static/js/sdk.js?v=3' key="{{BOT_KEY}}" callback="tcAsyncInit" ></script>
</body>
</html>

您可以使用以下 URL 获取您的 appUISetting字符串: https://botwidget.gupshup.io/ChatChannel/api/bot/{{botKey}}/botconfig

Gupshup的Web小部件托管在 Builquickbots.com 因此当您使用移动设备打开它时,它会重定向到URL。这就是 Web 小部件的当前行为。

您可以在 DNS 中配置CNAME记录并将其指向 buildquickbots.com。这会将请求重定向到您的域,但仅适用于 HTTP。

由于 SSL 证书限制,从技术上讲,不可能为 HTTPS 执行此操作。

最新更新