dotnetopenauth AJAX пост учебник

Question

Я смотрел на обед кретина 2.0 и вижу, что для их openid им нравится запрос ajax.Я знаю, что вы не можете использовать полный стиль AJAX (т.е. я не могу вставить веб-страницу в диалоге пользовательского интерфейса jquery), но вы можете открыть другое окно.

Через некоторое время, глядя на код ужина для ботаников, я могу 'Кажется, я не понимаю, как они это делают.Мне интересно, есть ли у кого-нибудь пошаговое руководство о том, как сделать этот openj в стиле ajax?

Спасибо

Answer 1

Я не знаю, как это делается в NerdDinner, но вот пошаговое руководство, которое я написал, чтобы проиллюстрировать, как этого можно добиться, используя jQuery и ASP.NET MVC 3 (механизм просмотра Razor):

1. Создание нового проекта ASP.NET MVC 3 с использованием пустого шаблона.
2. Использование NuGet Добавить пакет библиотеки Ссылка на модуль DotNetOpenAuth (это будет ссылаться на соответствующую сборку из Интернета и добавлять необходимые разделы конфигурациина ваш web.config).

3. Добавьте HomeController:

   public class HomeController : Controller
   {
       public ActionResult Index()
       {
           return View();
       }
   }
   

4. и соответствующий ~/Views/Home/Index.cshtml просмотр:

   @{
       ViewBag.Title = "Index";
       Layout = "~/Views/Shared/_Layout.cshtml";
   }
   <script type="text/javascript">
       $(function () {
           $('a#btnlogin').click(function () {
               // Ajaxify the btnlogin action link so that
               // we popup the login form
               // In this example it is a simple HTML injection
               // but here you could get fancy with 
               // animations, CSS, jquery dialogs, 
               // whatever comes a designer's mind
               $('#login').load(this.href);
               return false;
           });
       });
   </script>
   
   <div>
       @TempData["message"]
   </div>
   
   @if (User.Identity.IsAuthenticated)
   {
       <div>
           Welcome @User.Identity.Name. 
           @using (Html.BeginForm("signout", "login", FormMethod.Post))
           {
               <input type="submit" value="SignOut" />
           }
       </div>
   }
   else
   {
       <div>
           You are not authenticated.
           @Html.ActionLink("Signin using OpenId", "index", "login", null, new { id = "btnlogin" })
       </div>
       <div id="login"></div>    
   }
   

5. Далее следует важная часть LoginController, которая будет обрабатывать аутентификацию:

   using System.Net;
   using System.Web.Mvc;
   using System.Web.Security;
   using DotNetOpenAuth.Messaging;
   using DotNetOpenAuth.OpenId;
   using DotNetOpenAuth.OpenId.Extensions.SimpleRegistration;
   using DotNetOpenAuth.OpenId.RelyingParty;
   
   public class LoginController : Controller
   {
       public ActionResult Index()
       {
           using (var openid = new OpenIdRelyingParty())
           {
               var response = openid.GetResponse();
               if (response != null)
               {
                   switch (response.Status)
                   {
                       case AuthenticationStatus.Authenticated:
                       {
                           var claimsResponse = response.GetExtension<ClaimsResponse>();
                           var username = response.ClaimedIdentifier;
                           if (claimsResponse != null && !string.IsNullOrEmpty(claimsResponse.Email))
                           {
                               username = claimsResponse.Email;
                           }
                           var cookie = FormsAuthentication.GetAuthCookie(username, false);
                           Response.AppendCookie(cookie);
                           break;
                       }
                       case AuthenticationStatus.Canceled:
                       {
                           TempData["message"] = "Login was cancelled at the provider";
                           break;
                       }
                       case AuthenticationStatus.Failed:
                       {
                           TempData["message"] = "Login failed using the provided OpenID identifier";
                           break;
                       }
                   }
                   return RedirectToAction("index", "home");
               }
               return View();
           }
       }
   
       [HttpPost]
       public ActionResult Index(string loginIdentifier)
       {
           if (string.IsNullOrEmpty(loginIdentifier) || !Identifier.IsValid(loginIdentifier))
           {
               ModelState.AddModelError(
                   "loginIdentifier",
                   "The specified login identifier is invalid"
               );
               // The login identifier entered by the user was incorrect
               // redisplay the partial view with error messages so that 
               // the suer can fix them:
               return View();
           }
           else
           {
               using (var openid = new OpenIdRelyingParty())
               {
                   var request = openid.CreateRequest(
                       Identifier.Parse(loginIdentifier)
                   );
                   request.AddExtension(new ClaimsRequest
                   {
                       Email = DemandLevel.Require
                   });
                   var response = request.RedirectingResponse;
                   if (response.Status == HttpStatusCode.Redirect)
                   {
                       // We need to redirect to the OpenId provider for authentication
                       // but because this action was invoked using AJAX we need
                       // to return JSON here:
                       return Json(new { redirectUrl = response.Headers[HttpResponseHeader.Location] });
                   }
                   return request.RedirectingResponse.AsActionResult();
               }
           }
       }
   
       [Authorize]        
       [HttpPost]
       public ActionResult SignOut()
       {
           FormsAuthentication.SignOut();
           return RedirectToAction("index", "home");
       }
   }
   

6. И соответствующий ~/Views/Login/Index.cshtml частичный вид:

   @{
       Layout = null;
   }
   <!-- Using the jquery form plugin to Ajaxify my form -->
   <!-- Get from here: http://jquery.malsup.com/form/ -->
   <script src="@Url.Content("~/Scripts/jquery.form.js")" type="text/javascript"></script>
   <script type="text/javascript">
       $(function () {
           $('form').ajaxForm({
               success: function (result) {
                   if (result.redirectUrl) {
                       // if the open id provider was found redirect 
                       // to it so that the user can authenticate
                       window.location.replace(result.redirectUrl);
                   } else {
                       // there was an error => redisplay form
                       $('#login').html(result);
                   }
               }
           });
       });
   </script>
   @using (Html.BeginForm())
   {
       @Html.Label("loginIdentifier", "OpenId: ")
       @Html.TextBox("loginIdentifier", "https://www.google.com/accounts/o8/id")
       @Html.ValidationMessage("loginIdentifier")
       <input type="submit" value="Login" />
   }
   

Пример может быть легко адаптирован для движка просмотра веб-форм, если вы используете это.Я также намеренно оставил модные анимации и CSS, чтобы показать основы.