无法通过 IE11/es5 的 botframework-webchat 中的自定义 store/dispatch 发送消息
Can't send a message via custom store/dispatch in botframework-webchat for IE11/es5
我的客户需要 IE11 支持我们的聊天机器人。我不得不修改网络聊天代码,使其不使用箭头函数等 es6 功能,因为它们在 IE11/es5 中不受支持。在大多数情况下,我是成功的,但我无法开始工作的一件事是发送我正在发送的消息事件。新代码在 Chrome 中有效,但我在 IE11 中收到 Expected identifier 错误消息。这是相关代码:
const store = window.WebChat.createStore({}, function({dispatch}) { return function(next) { return function(action) {
if (action.type === 'WEB_CHAT/SEND_MESSAGE') {
// Message sent by the user
PageTitleNotification.Off();
clearTimeout(interval);
} else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY' && action.payload.activity.name !== "inactive") {
// Message sent by the bot
clearInterval(interval);
interval = setTimeout(function() {
// Change title to flash the page
PageTitleNotification.On('Are you still there?');
// Notify bot the user has been inactive
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
}, 3000)
}
return next(action);
}}});
以前第一行看起来像
const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
问题出现在 function({dispatch})
。 IE 控制台显示需要一个标识符,整个网络聊天无法加载。它在 Chrome 中运行良好。如果我将 function({dispatch})
更改为仅 function(dispatch)
,机器人会呈现,但发送非活动消息到机器人(下方)的调度语句在 IE OR Chrome.
// Notify bot the user has been inactive
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
为什么 IE 无法将 {dispatch}
识别为标识符,我该怎么做才能使其正常工作?
IE11 不支持该语法。 ES6 允许通过变量名设置对象属性,所以 ES5 等效为:
window.WebChat.createStore({}, { dispatch: dispatch }) {
// ...
}
编辑:
经过一些调试,最终的解决方案是直接将dispatch
对象传递给createStore
函数,并访问它的dispatch
方法:
dispatch.dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
您可以重命名参数以减少冗余,但这不是必需的。
您发布的代码的问题是您从来没有 return next(action)
。因此,流在通过 store
时永远不会前进。添加这一行,网络聊天将按预期每 3 秒发送一次。如果需要,您可以参考 05.custom-components/b.send-typing-indicator 网络聊天示例中的代码。
请注意:
- 我注释掉了
PageTitleNotification
因为它是未定义的。
- 我确实必须定义
interval
,您必须在未提供的代码中的其他地方定义它。
- 确保您使用的是
webchat-es5.js
CDN,它在 IE 上使用 运行 的 polyfill 支持。
希望得到帮助!
var interval;
const store = window.WebChat.createStore({}, function(dispatch) {
return function(next) {
return function(action) {
console.log(action)
if (action.type === 'WEB_CHAT/SEND_MESSAGE') {
// Message sent by the user
// PageTitleNotification.Off();
clearTimeout(interval);
} else
if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
// Message sent by the bot
clearInterval(interval);
interval = setTimeout(function() {
// Change title to flash the page
// PageTitleNotification.On('Are you still there?');
// Notify bot the user has been inactive
dispatch.dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
}, 3000)
}
return next( action )
}
}
} );
开发者控制台:
机器人日志记录:
我的客户需要 IE11 支持我们的聊天机器人。我不得不修改网络聊天代码,使其不使用箭头函数等 es6 功能,因为它们在 IE11/es5 中不受支持。在大多数情况下,我是成功的,但我无法开始工作的一件事是发送我正在发送的消息事件。新代码在 Chrome 中有效,但我在 IE11 中收到 Expected identifier 错误消息。这是相关代码:
const store = window.WebChat.createStore({}, function({dispatch}) { return function(next) { return function(action) {
if (action.type === 'WEB_CHAT/SEND_MESSAGE') {
// Message sent by the user
PageTitleNotification.Off();
clearTimeout(interval);
} else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY' && action.payload.activity.name !== "inactive") {
// Message sent by the bot
clearInterval(interval);
interval = setTimeout(function() {
// Change title to flash the page
PageTitleNotification.On('Are you still there?');
// Notify bot the user has been inactive
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
}, 3000)
}
return next(action);
}}});
以前第一行看起来像
const store = window.WebChat.createStore({}, ({ dispatch }) => next => action => {
问题出现在 function({dispatch})
。 IE 控制台显示需要一个标识符,整个网络聊天无法加载。它在 Chrome 中运行良好。如果我将 function({dispatch})
更改为仅 function(dispatch)
,机器人会呈现,但发送非活动消息到机器人(下方)的调度语句在 IE OR Chrome.
// Notify bot the user has been inactive
dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
为什么 IE 无法将 {dispatch}
识别为标识符,我该怎么做才能使其正常工作?
IE11 不支持该语法。 ES6 允许通过变量名设置对象属性,所以 ES5 等效为:
window.WebChat.createStore({}, { dispatch: dispatch }) {
// ...
}
编辑:
经过一些调试,最终的解决方案是直接将dispatch
对象传递给createStore
函数,并访问它的dispatch
方法:
dispatch.dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
您可以重命名参数以减少冗余,但这不是必需的。
您发布的代码的问题是您从来没有 return next(action)
。因此,流在通过 store
时永远不会前进。添加这一行,网络聊天将按预期每 3 秒发送一次。如果需要,您可以参考 05.custom-components/b.send-typing-indicator 网络聊天示例中的代码。
请注意:
- 我注释掉了
PageTitleNotification
因为它是未定义的。 - 我确实必须定义
interval
,您必须在未提供的代码中的其他地方定义它。 - 确保您使用的是
webchat-es5.js
CDN,它在 IE 上使用 运行 的 polyfill 支持。
希望得到帮助!
var interval;
const store = window.WebChat.createStore({}, function(dispatch) {
return function(next) {
return function(action) {
console.log(action)
if (action.type === 'WEB_CHAT/SEND_MESSAGE') {
// Message sent by the user
// PageTitleNotification.Off();
clearTimeout(interval);
} else
if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
// Message sent by the bot
clearInterval(interval);
interval = setTimeout(function() {
// Change title to flash the page
// PageTitleNotification.On('Are you still there?');
// Notify bot the user has been inactive
dispatch.dispatch({
type: 'WEB_CHAT/SEND_EVENT',
payload: {
name: 'inactive',
value: ''
}
});
}, 3000)
}
return next( action )
}
}
} );
开发者控制台:
机器人日志记录: