Question

我的流程如下：用户点击站点1上的登录。从站点2打开弹出窗口，要求他使用twitter登录。然后他使用oAuth登录，因此页面会发生变化。成功登录后，弹出窗口应该关闭，站点1上的代码应该收到通知。

什么行不通：

WebIntents - 好吧，他们网站上的示例甚至都没有用，所以我没有在本地试用..
easyXDM - 与iframe通信，而不是弹出窗口。
舷窗 - 同样，使用iframe。

一个可怕的解决方案是每隔几秒刷新一次iframe，以检查用户是否已经登录。

有更好的方法吗？更好的图书馆？

Answer 1

如果您可以在用户登录后将弹出窗口引用到另一个页面，则可以使用：

主页：

localStorage.setItem('user_signed_in', false); // signed out by default
window.open("http://www.google.com/", "google_window", "menubar=no,resizable=no,scrollbars=no,status=no,width=400,height=300");

(function look_up() {
  if(localStorage.getItem('user_signed_in')) {
    go_on();
  } else {
    setTimeout(look_up, 500)
  }
}());

function go_on() {

...

}

参考页面：

localStorage.setItem('user_signed_in', true);
window.close();

请注意，引荐页面必须与主页位于同一个域中。并且，不要害怕other browsers中对本地存储的不良支持，但如果你真的想支持老歌，我相信你是can use cookies。

Answer 2

当用户点击site1上的登录按钮时，会从site2打开一个弹出窗口。

我假设您正在使用window.open通过iframe执行此操作，并且您已经找到了如何绕过大多数浏览器垃圾邮件阻止程序等。

由于您将此弹出窗口打开为新窗口，您现在可以控制该窗口，并且您实际上可以从新窗口发回内容。

这将是一些伪代码，但只是举个例子！

让我们说用户使用类似的链接登录：

<a href="" onclick="window.popup=window.open('/twitter/login.php', 'Twitter login', 'width=450,height=500'"</a>

您的弹出窗口现在可以被window.popup引用，并且在window.popup中，原始页面现在称为window.opener。

在打开弹出窗口的同一站点上，您有一个功能，如下所示：

document.handleLogin = function (returnedDataFromPopup) {
    console.log(returnedDataFromPopup);
}

用户使用oAuth登录后，您需要重定向到新页面，这在oAuth和Twitter指南中都有解释，您需要在弹出窗口中进行重定向，然后从中捕获信息登录该页面并将其发送回原始文档和handleLogin函数。

根据您的使用情况，在大多数PHP实现中，您可以执行类似这样的操作来从登录中获取数据，这当然是在执行了所有令牌和消费者密钥之后：

$userinfo = $oAuth->getAttributes(); //or something similar, depends

因此，当从Twitter重定向到新页面时，新页面看起来像：

<? php
$userinfo = $oAuth->getAttributes();
?>

<script type="text/javascript">
   window.opener.document.handleLogin(<?php echo json_encode($userinfo) ?>);
   window.close();
</script>

这实际上会在打开弹出窗口的页面上运行handleLogin（）函数，它会将弹出窗口中的userinfo发送到原始页面上的该函数，然后关闭弹出窗口。

我已经将这种技术用于oAuth，OpenID，Google等。它可以正常工作，完全不需要本地存储，cookie或页面刷新，因为你可以控制弹出窗口，你可以发回信息你甚至可以通过这样的方式改变弹出窗口中的弹出地址，如果你想做这样的事情：

window.popup.location.href = 'google.com';

这在某些情况下很方便，例如OpenID默认会关闭弹出窗口并将document.opener重定向到指定的页面，这不是你想要的，为了克服这个问题，你必须打开一些弹出窗口随机页面，最好是您控制的空白页面，然后在弹出窗口打开后立即将弹出窗口的href重定向到Twitter。

这一切看起来都非常复杂，但它是可行的，如果你到目前为止，你现在拥有了数据，你所要做的就是以某种方式通过持有site2的iframe将它推送到site1。如果没有websockets或某种事件驱动的服务器，比如node.js，推动是不可能的，你可能不得不依赖长轮询或其他东西，有很多方法可以做到这一点，我相信你'想一想，但是如果你对site1上运行的脚本有一些控制权，而你显然可以控制site2，那么你实际上可以通过一个带有一点点javascript的iframe访问一些数据，但我从来没有真正这样做过所以我不确切知道它是如何运作的。

这不是真的相关，但我真的不明白为什么有人通过其他网站的iframe登录你的网站会有用，这一切对我来说都很奇怪，但这取决于你的身材进行。

跨域弹出窗口

2 个答案: