如何使用 angular2 在 Office 加载项中实现对话框 API？

Posted 2023-03-31

【中文标题】如何使用 angular2 在 Office 加载项中实现对话框 API？

【英文标题】：How to implement the Dialog API in Office Add-ins with angular2?

【发布时间】：2017-08-13 01:08:38

【问题描述】：

我想在我的office插件中实现oauth，因为我找到了office js dialog api并通过它发现它很有趣。

我担心的是我想用 angular 2 来实现它，所以我无法很好地处理它。

预期结果应该是

主页（目前是简单的 html 页面，但我希望它是 angular 2 组件的一部分）

用户将选择登录

打开登录对话框

（在对话框中第一个本地页面，然后重定向到当前域之外的某个自定义域页面）

回调

登录成功后加载菜单和数据。

完成 oauth 后，我正在加载我的 Angular 2 应用程序。我想用 Angular 2 应用程序完成整个循环。

【问题讨论】：

这不是代码编写服务；你的实现在哪里，有什么问题？

【参考方案1】：

你有没有机会看看Office Helpers？它将帮助您非常轻松地进行 OAuth。

我不确定您的具体情况，但假设您想使用 *** API 进行身份验证，那么您将执行以下操作：

async function authenticate() 
    /* Invoke the library */
    let authenticator = new OfficeHelpers.Authenticator();

    /* Register the OAuth provider by passing a name and the configuration */
    authenticator.endpoints.add('***', 
        clientId: '<client id goes here>',
        baseUrl: 'https://stackexchange.com',
        redirectUrl: 'https://localhost:3000',
        authorizeUrl: '/oauth/dialog',
        scope: '<scope goes here>',
        responseType: 'token',
        state: true /* generate a random state */
    );

    /* returns a token or an OAuth Error */
    return await authenticator.authenticate('***'); 

如果您还有其他问题，请随时在此处发布问题或发表评论。

【讨论】：

还有一个常规的对话，你可以看看***.com/questions/41940581/…