最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

在不重新加载Node.js的情况下将var发送到FrontEnd

运维笔记admin12浏览0评论

在不重新加载Node.js的情况下将var发送到FrontEnd

在不重新加载Node.js的情况下将var发送到FrontEnd

如何在node.js中重新发送var到frontend,而无需重新加载,重定向或再次呈现这样的页面。我创建了一个聊天,我不想在有人发送消息后重新加载页面...是一个机器人用QnA Microsoft制作。

res.render('mainpage',{frontend_var:backend_var});

前端

<div class="direct-chat-messages">
            <%
            for(var i = 0; i < imax;i+=2){
            %>
            <div class="direct-chat-msg doted-border">
                <div class="direct-chat-info clearfix">
                    <span class="direct-chat-name pull-right">You</span>
                </div>
                <div class="direct-chat-text ">
                    <%=message[i+1]%>
                </div>
            </div>
            <div class="direct-chat-msg  ">
                <div class="direct-chat-info clearfix">
                    <span class="direct-chat-name pull-right">BOT</span>
                </div>
                <img alt="message user image" src=".png" class="direct-chat-img">
                <div class="direct-chat-text ">
                    <%=message[i]%>
                </div>
            </div>
            <%
            }
            %>
        </div>


    </div>

    <form method="post" enctype="multipart/form-data" action="/users/send">
        <div class="popup-messages-footer">
            <input type="text" id="status_message" placeholder=" Type a message..." rows="10" cols="40" name="message">
            <span class="input-group-btn right"><a class="waves-effect waves-light btn-small" > <input type="submit" value="Send"></a></span>
        </div>
    </form>
</div>

后端

app.post('/send',upload.any(),function (req,res,next) {
    const translated = JSON.stringify({"question": req.body.message});
    const extServerOptionsPost = {
        host: 'westus.api.cognitive.microsoft',
        path: '.0/knowledgebases//generateAnswer',
        method: 'POST',
        headers: {
            'Ocp-Apim-Subscription-Key': '',
            'Content-Type': 'application/json',
            'Content-Length': Buffer.byteLength(translated)
        }
    };

    const reqPost = http.request(extServerOptionsPost, function (bot) {
        bot.on('data', function (data) {
            process.stdout.write("done"); // primul console.log
            imax++;
            message[imax] = JSON.parse(data).answers[0].answer;
            imax++;
            message[imax] = req.body.message;
            res.render('Bot', {message:message , imax:imax});
        });
    });
    reqPost.write(translated);
});
回答如下:

将此添加到您的nodeJS:它将充当后端钩子,前端(远远低于)可以保持联系。

//Given chatObject is a variable you want to send to the client:
app.get("/updateChats", function(req,res)
{
 res.send(JSON.stringify(chatObject));
//Serializes the chatObject into a string
}

在客户端,您需要编写一些JSON同步内容:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        // if it worked, parse that string, make it back into an object
        var chatObject = JSON.parse(this.responseText);
        console.log(chatObject)//do with it as you please :)
    }
};
xmlhttp.open("GET", "/updateChats", true);
xmlhttp.send();

考虑setInterval'ing在前端同步代码以保持拉/刷新聊天消息

发布评论

评论列表(0)

  1. 暂无评论