4

我有一个 HTML5 应用程序，它使用 Azure 移动服务身份验证来登录（直接来自示例代码......在下面提供）。它适用于所有桌面浏览器和 Safari 中的 iPhone 5。但是在应用程序/全屏模式下，它什么都不做（不会像在 Safari 中那样请求显示弹出窗口的权限，也不会出现弹出窗口），我可以永远等待，什么也没有发生。如果我第二次调用它，它会给出一个错误提示“错误：意外失败”......也许是因为第一次尝试仍在运行？任何帮助/见解表示赞赏。

client.login ("facebook").done(function (results) {
     alert("You are now logged in as: " + results.userId);
}, function (err) {
     alert("Error: " + err);
});

编辑更新，包含更多信息和 2 个潜在想法*

我进行了更多研究，发现一个网站使用的方法克服了这个问题，还解决了当前 Azure 移动身份验证方法的另外两个副作用。我认为 Azure 移动团队可能正在寻求做类似的事情，因为代码中有一些其他身份验证选项的提示（尽管难以阅读并确定因为最小化的代码被混淆了）。这可能只是在代码中激活这些的问题......

解决方案”：

转到http://m.bcwars.com/并单击 Facebook 登录。您会看到它在 iPhone Safari 中以“应用程序模式”完美运行，因为它不会弹出窗口，它只是停留在当前浏览器窗口中。

此方法解决了当前 Azure 移动方法的另外两个问题。首先，弹出窗口被大多数浏览器解释为潜在的广告，或者被自动阻止（桌面 Chrome）......并且用户不知道它为什么不起作用......或者给出用户必须批准的警告（ iPhone Safari 处于“浏览器模式”），这很麻烦。而且，如果用户有一个弹出窗口阻止程序，则用户无法使其正常工作变得更加困难，甚至更有可能。bcwars.com 方法没有这个问题。

其次，在 iPhone Safari 中，当弹出窗口自动关闭时，如果 Safari 中打开了其他浏览器窗口，则原始页面不会获得焦点。相反，它处于较小/幻灯片模式，因此他们可以选择显示哪一个。如果发生这种情况，用户必须再经过一个步骤...单击浏览器窗口以激活它并使其获得焦点..再次给他们带来更多的痛苦和更大的可能性，让他们搞砸并且没有正确执行并且需要帮助。m.bcwars.com 没有这个问题。

Azure 选项：

查看 Azure 移动代码，它看起来可能已经有了解决方案。我无法轻松阅读它，因为它已被缩小/混淆，但它似乎有 4 个选项（包括 iFrame 等）用于调用身份验证，并且只有 1 个（弹出窗口的“不太理想的选项”）正在使用。一个简单的解决方案是设置一个属性以允许其中一个备用身份验证工作。但我读得不够好，无法弄清楚。另一种方法是破解代码（暂时直到微软提出修复程序）。

我可以在那里得到一些帮助吗？

4

1 回答 1

0

您可以使用 Facebook 实现不使用弹出窗口的身份验证流程。基本思想是使用“Web Flow”进行登录，一旦窗口从登录返回，使用访问令牌将用户登录到 Azure 移动服务。

执行此操作的 Facebook 文档在这里： https ://developers.facebook.com/docs/facebook-login/login-flow-for-web-no-jssdk/#step2

一些代码示例使您更容易。

你会从这样的事情开始：

（请记住将 YOUR_APP_ID 和 YOUR_URL 替换为与您的网站相关的内容。

function logIn() {
    window.location.replace('https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri=http%3A%2F%2FYOUR_URL&response_type=token')
}

这会将窗口重定向到 Facebook 页面，以便用户登录并授权您的应用程序。用户完成后，Facebook 会将用户重定向回上面给出的 YOUR_URL。

在那里，您可以处理重定向并使用以下方式进行移动服务登录：

function handleLoginResponse() {
    var frag = $.deparam.fragment();
    if (frag.hasOwnProperty("access_token")) {
        client.login("facebook", { access_token: frag.access_token }).then(function () {
            // you're logged in
        }, function (error) {
            alert(error);
        });
    } 
}

在这里，您将获取的访问令牌解析为 URL 片段，并将其作为参数传递给您对 Azure 移动服务进行的登录调用。

此代码依赖于jquery BBQ插件来轻松处理 URL 片段。

希望这能解决您的问题！

于 2013-10-25T13:21:58.933 回答