authentication - 如何以编程方式关闭谷歌一键登录 iframe？

Question

我有一个登录表单，其中我使用谷歌一键登录。我正在以角度开发此功能。因此，当我进入登录页面时，google 一键登录 iframe 将加载到页面中。但当我进入另一个页面时，实际问题出现了，我的 google 一键登录 iframe 保持在页面一角。

我已经尝试使用 jquery 删除 iframe，但在这种情况下，iframe 已成功删除，但当通过从一个页面导航到另一页面再次加载登录页面时，iframe 不会再次显示。

所以我认为，如果我务实地触发 iframe 关闭按钮的关闭事件，那么我的问题就解决了。但我找不到任何官方文档。为了它。

有什么方法可以实用地关闭该 iframe 吗？

Answer 1

这是我在更多谷歌搜索后找到的答案。

首先在组件上Delcare:

declare const googleyolo: any;

我将 iframe 添加到登录表单中，如下所示:

    const hintPromise = googleyolo.hint({
      supportedAuthMethods: [
        "https://accounts.google.com"
      ],
      supportedIdTokenProviders: [
        {
          uri: "https://accounts.google.com",
          clientId: "Your google yolo client id"
        }
      ]
    }).then((credential) => {
          // automatically Call this function after click on one account
      }
    }, (error) => {
      console.log('error', error);
    });

    const bodyObserver = new MutationObserver(mutationsList => {
      mutationsList.forEach((mutation: any) => {
        mutation.addedNodes.forEach((node: any) => {
          if (node.nodeName === 'IFRAME' && node.src.includes('smartlock.google.com/iframe/')) {
            bodyObserver.disconnect();
            node.classList.add('google-inserted-frame');
            node.setAttribute('id', 'googleYoloIframe');
          }
        });
      });
    });
    bodyObserver.observe(window.document.body, {
      childList: true
    });
  }

这里以编程方式忽略 IFrame :

var iframe = $('#googleYoloIframe');
if(iframe.length > 0){
  googleyolo.cancelLastOperation();
}