微软 bot 框架 webchat 直连的秘密——NODE JS

Question

我需要使用 HTML 网络聊天隐藏直线频道的秘密，尝试了这个解决方案，但在获取时总是让我出错。我在 process.env 中获得了 Azure 门户中直线通道的秘密

索引.js

const dotenv = require('dotenv');
const path = require('path');
const restify = require('restify');

const bodyParser = require('body-parser'); 
const request = require('request'); 
const corsMiddleware = require('restify-cors-middleware'); 


const { BotFrameworkAdapter, MemoryStorage, ConversationState, UserState   } = require('botbuilder');

const { EBOT } = require('./eBot');

const ENV_FILE = path.join(__dirname, '.env');
dotenv.config({ path: ENV_FILE || process.env.directLineSecret });

const cors = corsMiddleware({ 
  origins: ['*'] 
}); 

const server = restify.createServer();
server.pre(cors.preflight); 
server.use(cors.actual); 
server.use(bodyParser.json({ 
  extended: false 
})); 
server.listen(process.env.port || process.env.PORT || 3978, () => {
    console.log(`\n${ server.name } listening to ${ server.url }`);
    console.log('\nGet Bot Framework Emulator: https://aka.ms/botframework-emulator');
    console.log('\nTo talk to your bot, open the emulator select "Open Bot"');
});

// Generates a Direct Line token 
server.post('/directline/token', (req, res) => { 
  const options = { 
    method: 'POST', 
    uri: 'https://directline.botframework.com/v3/directline/tokens/generate', 
    headers: { 
      'Authorization': `Bearer ${process.env.directLineSecret}` 
    }};
  request.post(options, (error, response, body) => { 
    if (!error && response.statusCode < 300) { 
      res.send({ 
        token: body.token 
      }); 
    } else { 
      res.status(500).send('Call to retrieve token from DirectLine failed'); 
    } 
  }); 
});

server.post('/api/messages', (req, res) => {
    adapter.processActivity(req, res, async (context) => {
        await ebot.run(context);
    });
});

还有 webchat.html：

<script src="https://cdn.botframework.com/botframework-webchat/latest/webchat.js"></script>
<script>
            (async function () {
            const res = await fetch('https://directline.botframework.com/v3/directline/tokens/generate', { method: 'POST' });
            const webChatToken = await res.json();
    
              window.WebChat.renderWebChat({
                directLine: window.WebChat.createDirectLine({ token: webChatToken })
              }, document.getElementById('webchat'));
    
              document.querySelector('#webchat > *').focus();
            })().catch(err => console.error(err));
    
</script>

/// 更新

错误：

** 加载资源失败：服务器响应状态为403()

** webchat.js:2 POST https://directline.botframework.com/v3/directline/conversations403

** webchat.js:2 Uncaught t {message: "ajax error 403", xhr: XMLHttpRequest, request: {...}, status: 403, responseType: "json", ...}

那怎么办？，我错过了什么？

Answer 1

解决了，问题在于 api 令牌函数的制作方式，这是为了从 index.js 检索 json 响应而起作用的：

server.post('/directline/token', async function(req, res) {
        const result = await fetch('https://directline.botframework.com/v3/directline/tokens/generate', {
            method: 'POST',
            headers: {
                Authorization: 'Bearer ' +  process.env.DirectLineSecret
            }
        });
        const token = await result.json();
        res.send(token);
});

我在问题中发布的不是发送令牌响应，而是发送一个巨大的请求对象。希望对您有所帮助！

Answer 2

您的特定实现的问题是，虽然您设置了一个 API 用于生成令牌并将其返回给网络聊天，但您实际上并没有调用该端点。而不是

const res = await fetch('https://directline.botframework.com/v3/directline/tokens/generate', { method: 'POST' });

你应该有

const res = await fetch('http://localhost:3978/directline/token', { method: 'POST' });

它会调用以将 Direct Line 密钥交换为令牌，然后将令牌返回给您的网络聊天实例。