Question

我一直在努力让OAuth使用我的MVC4移动应用程序。

我基本上

创建了MVC4移动应用程序
创建了一个MVC4 Web应用程序
将AccountController，AccountModel，InitializeSimpleMembershipAttribute和所有帐户视图复制到我的MVC4移动应用程序中
启用Google和Facebook OAuth提供商
我还确保根据simplemembershipprovider-not-working初始化RoleManager，尽管我认为这不重要。（我需要它来测试一些基于角色的安全性）
通过设置data-ajax =“false”禁用ajax（我认为）： using (Html.BeginForm("ExternalLogin", "Account",new RouteValueDictionary { { "ReturnUrl", ViewBag.ReturnUrl } }, FormMethod.Post, new Dictionary<string, object> { { "data-ajax", false } }))（这似乎对页面没有任何影响 - 所以我可能在这里做错了...）

我可以进入LogIn视图/帐户/登录，当我点击google按钮时，调试器会进入public ActionResult ExternalLogin(string provider, string returnUrl)

然而 - public ActionResult ExternalLoginCallback(string returnUrl)永远不会被击中。在视觉上，我得到jquery移动“页面加载”动画 - 然后我得到“错误加载页面”

我有两个问题：

当我试图弄清楚会发生什么时，我如何获得更多信息？
如何让OAuth在我的MVC4移动网站上运行？

BTW：两个网站都以.Net4.0为目标

Answer 1

好的 - 所以我想出了答案 - 杯子确实是jQuery mobile中的ajax。

我修改了我的_layout.cshtml，以便它可以在加载jQuery后呈现自定义脚本，但在加载jQuery mobile之前：

    @Scripts.Render("~/bundles/jquery","~/scripts/RemoveHashFromWindowLocation")
    @RenderSection("beforeJqueryMobile", required: false);
    @Scripts.Render( "~/bundles/jquerymobile")
    @RenderSection("scripts", required: false)

然后我修改了我的Login.cshtml，使其包含以下部分：

@section BeforeJqueryMobile {
    @Scripts.Render("~/scripts/disable-ajax.js")
}

最后，我将以下内容添加到我的脚本文件夹中：

禁用-ajax.js：

$(document).bind("mobileinit", function () {
    $.mobile.ajaxEnabled = false;
});

RemoveHashFromWindowLocation.js :(感谢Facebook Oauth Login With Jquery Mobile #_=_）

if (window.location.hash == "#_=_")
    window.location.hash = "";

Voila - 使用jQuery mobile的OAuth。： - ）

Answer 2

如果您的网站直接加载到登录页面，espenalb的上述答案确实有效，但是如果您说的是主页，然后是指向登录页面的链接（使用相同的布局），您将收到错误单击其中一个社交登录按钮时加载页面。

要修复此添加

<script>

    $('#login-link').live("click", function () {
        $.mobile.ajaxEnabled = false;
    });

</script>

到移动布局页面的底部，这将附加一个事件处理程序，该处理程序将禁用ajax到登录链接。

如何让OAuth在MVC4移动设备上运行

2 个答案: