gpt4 book ai didi

javascript - 在 Angular 2 应用程序中使用 Microsoft BotFramework-WebChat 时遇到问题

转载 作者:行者123 更新时间:2023-11-30 21:02:54 25 4
gpt4 key购买 nike

根据文档,我在将 botframework 实现到本地运行的 Angular 应用程序时遇到了一些问题

简单:在您的非 React 网站中,内联运行 Web Chat

添加一个 DirectLine(不是网络聊天) channel ,并生成一个 Direct Line Secret。确保启用 Direct Line 3.0。

在您的网站上包含 botchat.css 和 botchat.js,例如:

<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.botframework.com/botframework-webchat/latest/botchat.css" rel="stylesheet" />
</head>
<body>
<div id="bot"/>
<script src="https://cdn.botframework.com/botframework-webchat/latest/botchat.js"></script>
<script>
BotChat.App({
directLine: { secret: direct_line_secret },
user: { id: 'userid' },
bot: { id: 'botid' },
resize: 'detect'
}, document.getElementById("bot"));
</script>
</body>
</html>

现在,我已经在 header 和 js 文件中插入了构建 CSS 的本地路径,然后在我的组件中,我声明了变量 BotChat

declare var BotChat;

然后我将脚本放入我的构造函数

constructor() {
BotChat.App({
directLine: { secret: direct_line_secret },
user: { id: 'userid' },
bot: { id: 'botid' },
resize: 'detect'
}, document.getElementById("bot"));
}

但它似乎并没有工作,我也在控制台中收到此错误

Loading failed for the <script> with source 
“http://localhost:4200/BotFramework-WebChat-master/botchat.js”

Error: [object Object]
Stack trace:
resolvePromise@http://localhost:4200/polyfills.bundle.js:7633:31

任何帮助将不胜感激

最佳答案

在你的 chatsidebar.component.ts 中添加 after all imports 语句

声明 var BotChat;

这实际上是告诉您在其他地方声明了一些全局变量并且您想使用它的 typescript 方式。

declare keyword

另外请尝试使用 angular 的 renderer2 而不是直接的 dom 操作。

Angular renderer

关于javascript - 在 Angular 2 应用程序中使用 Microsoft BotFramework-WebChat 时遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46944658/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com