@ descope/出界应用程序-widget
设置
创建一个 .env 文件
在部件包中创建 .env 包含的文件;
DESCOPE_BASE_URL= # env base url
DESCOPE_PROJECT_ID= # project ID
DESCOPE_WIDGET_ID= # default: outbound-applications-widget
DEBUG_MODE= # "true" / "false", default: "false"
DESCOPE_THEME= # "light" / "dark" / "os", default: "light"
示例
// replace x.x.x with the latest release of the widget: https://www.npmjs.com/package/@descope/outbound-applications-widget
<script src="https://descopecdn.com/npm/@descope/[email protected]/dist/index.js"></script>
<descope-outbound-applications-widget
base-url="<DESCOPE_BASE_URL>"
project-id="<DESCOPE_PROJECT_ID>"
tenant="<DESCOPE_TENANT>"
debug="<DEBUG_MODE>"
theme="<DESCOPE_THEME>"
widget-id="<DESCOPE_WIDGET_ID>"
></descope-outbound-applications-widget>
<script>
function onLogout(error) {
window.location.reload();
}
const descopeWidgetEle = document.getElementsByTagName('descope-outbound-applications-widget')[0];
descopeWidgetEle.logout = onLogout;
</script>
认证
要使用部件, 您必须登录 如果您没有得到认证, 登录流程将先运行, 登录后将打开部件
启动部件
运行 npm start 启动部件.
建筑
项目结构
/app- 包含index.html/lib- 部件的源代码lib/widget- 与部件有关的执行lib/widget/api- 与API通话有关的逻辑lib/widget/mixins- 部件特定逻辑lib/widget/state- 国家管理逻辑
API 密码
混合
部件由混音组成,每个混音包含特定的逻辑部分,有时会曝光一个可用于其他混音的API.
混音可以由相上而下组成,这样我们就可以通过将几个混音组合在一起来创造出新的混音.
混合创建者
创建混音符的函数,可以得到配置,并返回混音符的函数.
单通混音
由于混合剂是可相容的,在某些情况下我们希望确保混合剂只装入一次. 例如:当它的逻辑不需要在由不同的混合体组成时运行多次时.
对于本案,我们有一个包装功能(createSingletonMixin),以确保混合剂只装入一次,无论会装入多少次.
混音器应该用 createSingletonMixin 包装功能,除非有多次运行混音逻辑的原因.
状态
我们正在使用几种工具来处理部件的状态:
- Redux 工具箱 用于部件的状态管理.
- 雷杜克·通克(Redux Thunk) aPI的电话和Aync操作
- 重新选择 在不发生变异状态时,不撞击性能或触发状态再重新计算.
司机
一个抽象层,为组件提供 API,并能够处理部件内组件之间的相互作用.
使用驱动器的动机是将部件的代码从组件的执行中解开,因此重要的是只使用驱动器与组件互动(而不是依赖组件的执行细节).
德维
使用模拟屏幕
由于屏幕被动态获取, 当为部件开发新屏幕时, 您可能想要使用模拟模板 。 为此,只需将呼叫改为: fetchWidgetPage 包含您 HTML 的字符串.