如何在当前 Web 应用程序的 iframe 中使用有效令牌？答案

【问题标题】：How to use valid token in iframe from current web application?如何在当前 Web 应用程序的 iframe 中使用有效令牌？
【发布时间】：2020-06-24 11:31:23
【问题描述】：

我有两个 Web 应用程序（应用程序 A 和应用程序 B），并希望将其中一个 (A) 用作另一个 (B) 中的 iframe。我在当前的 Web 应用程序 (B) 中有一个令牌，它在 iframe (A) 中也有效。 iframe Web 应用程序 (A) 使用 OIDC js 身份验证和 angularjs，现在我如何将令牌从 B 发送到 A 并使用它？

在我的 A 应用程序中，我有这个：

var config = {
    authority: '...my auth server ...',
    client_id: '...'
    ...
}

mgr = new OidcTokenManager(config);

if (window.location.hash && window.location.hash.indexOf('id_token') > -1) {
    mgr.processTokenCallbackAsync().then(function () {
        //checkSessionState();
    }, function (error) {
    });
}

这很好用，但是当我使用 A 作为 iframe 时，mgr 无法正确启动，并且某些属性如 access_token 未定义！

【问题讨论】：

如果 B 有令牌，您可以通过查询参数（将 iframe URL 设置为也包含令牌）或 postMessage 将其发送到 iframe。
谢谢@MoshFeu。是的，我试过了，但我有提到的错误！ mgr 未启动。

标签： javascript openid-connect

【解决方案1】：

使用 Javascript 函数从 A => B => A 发布数据

来自 Parrent 应用程序的 JavaScript 代码

 document
      .querySelector(`iframe`)
      .contentWindow.postMessage({ token: '112121' }, "*");

接收器或 iframe 应用程序代码

window.addEventListener('message', receiveToken,*);

const receiveToken = message => {
    if (message.data && message.data.token){
        console.log(message.data.token)
   }

【讨论】：