Javascript 使用DirectLineJS创建网站_Javascript_Html_Botframework_Direct Line Botframework

Javascript 使用DirectLineJS创建网站

javascript html botframework

Javascript 使用DirectLineJS创建网站,javascript,html,botframework,direct-line-botframework,Javascript,Html,Botframework,Direct Line Botframework,我正在尝试将DirectLineJS设置为仅用于测试目的的网站。我已经构建了DirectLineJS repo，并按照此处的文档将/build/directLine.js添加到我的网站文件夹中在HTML页面中，我只是使用一个按钮尝试通过直达线路发送消息 <html> <head> <meta charset="UTF-8" /> <title>Bot Chat</title> <script src="

我正在尝试将DirectLineJS设置为仅用于测试目的的网站。我已经构建了DirectLineJS repo，并按照此处的文档将/build/directLine.js添加到我的网站文件夹中

在HTML页面中，我只是使用一个按钮尝试通过直达线路发送消息

<html>

<head>
    <meta charset="UTF-8" />
    <title>Bot Chat</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="http://unpkg.com/botframework-directlinejs/directLine.js" type="javascript"></script>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <style>
        .wc-chatview-panel {
            width: 320px;
            height: 500px;
            position: relative;
        }

        .h2 {
            font-family: Segoe UI;
        }
    </style>
</head>

<body>

    <h2 style="font-family:Segoe UI;">Welcome to my custom Bot!</h2>
    <section class="container"> 

        <input id="clickMe" type="button" value="clickme" onclick="connectDirectLine();" />

    </section>

    <textarea id="myTextarea">
342 Alvin Road
Ducksburg</textarea>

    <p>Click the button to change the contents of the text area.</p>

    <button type="button" onclick="myFunction()">Try it</button>

    <script>
        function myFunction() {
            var text = document.getElementById("myTextarea").value;
            console.log(text)
        }
    </script></body>

</html>

<script>        
        function connectDirectLine() {

            import { DirectLine } from 'botframework-directlinejs';
            var directLine = new DirectLine({
                secret: "mySecret",
            });

            directLine.postActivity({
                from: { id: 'myUserId', name: 'myUserName' }, // required (from.name is optional)
                type: 'message',
                text: 'a message for you, Rudy'
            }).subscribe(
                id => console.log("Posted activity, assigned ID ", id),
                error => console.log("Error posting activity", error)
                );

            directLine.activity$
                .filter(activity => activity.type === 'message' && activity.from.id === 'yourBotHandle')
                .subscribe(
                message => console.log("received message ", message)
                );
        }
</script>
<html


机器人聊天
.wc聊天室视图面板{
宽度：320px；
高度：500px；
位置：相对位置；
}
.h2{
字体系列：SegoeUI；
}
欢迎来到我的定制机器人！
阿尔文道342号
达克斯堡
单击按钮以更改文本区域的内容
试试看
函数myFunction（）{
var text=document.getElementById（“myTextarea”）.value；
console.log（文本）
}
函数connectDirectLine（）{
从'botframework directlinejs'导入{DirectLine}；
var directLine=新的directLine({
秘密：“我的秘密”，
});
directLine.postActivity({
from:{id:'myUserId'，name:'myUserName'}，//必需（from.name是可选的）
键入：“消息”，
短信：“给你的留言，鲁迪”
}).订阅(
id=>console.log（“发布的活动，分配的id”，id），
error=>console.log（“错误发布活动”，error）
);
directLine.activity$
.filter（activity=>activity.type=='message'&&activity.from.id==='yourBotHandle'）
.订阅(
message=>console.log（“收到的消息”，消息）
);
}
您正在将TypeScript
与JavaScript
混合使用
要使用Direct Line
，请将以下内容添加到页面的HTML
：
<script src="http://unpkg.com/botframework-directlinejs/directLine.js"/>

注意DirectLine.DirectLine
您将TypeScript
与JavaScript
混合使用
要使用Direct Line
，请将以下内容添加到页面的HTML
：
<script src="http://unpkg.com/botframework-directlinejs/directLine.js"/>

请注意DirectLine.DirectLine
，因此我将其添加到了HTML中，但是Connector.js import语句仍然存在同样的问题。是否需要将脚本移动到html页面？您需要删除导入语句！抱歉我不清楚没关系！现在我已经删除了import语句，但这次我收到了错误索引。html:77未捕获引用错误：在ConnectDirectLine上未定义DirectLine如果从“botframework directlinejs”添加导入{DirectLine}，会发生什么；？好的，我解决了。首先，从脚本声明中删除type=“javascript”，但最重要的是，您需要更新对var directLine=new directLine.directLine的调用({因此我已经将其添加到HTML中，但是Connector.js import语句仍然会出现同样的问题。我需要将脚本移动到HTML页面吗？您需要删除import语句！抱歉，我不清楚无需担心！现在我删除了import语句，但这一次我收到了错误索引。HTML:77 Uncaught ReferenceError:DirectLine是在ConnectDirectLine未定义如果从“botframework directlinejs”添加导入{DirectLine}会发生什么？好的，我解决了它。首先从脚本声明中删除type=“javascript”，但最重要的是，您需要更新对var DirectLine=new DirectLine.DirectLine的调用({