[英]How to send JSON data from ASP.NET MVC 5 back to client side Angular (i.e. during authentication)
i have to redirect to a different view if authenticated and I need to send JSON data containing the userid and username to be used by AngularJS. 如果经过身份验证,我必须重定向到其他视图,并且我需要发送包含AngularJS使用的用户名和用户名的JSON数据。
The Redirect
works but I am not sure how to send the authenticated user information as JSON data to the client-side. Redirect
有效,但是我不确定如何将经过身份验证的用户信息作为JSON数据发送到客户端。
Can some one help me? 有人能帮我吗?
Here are some code that I have in MVC side... 这是我在MVC方面拥有的一些代码...
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Security;
using TVS.Core.Interfaces;
using TVS.Domain;
using TVS.UI.Models;
namespace TVS.UI.Controllers
{
public class homeController : Controller
{
private readonly IUser _IUser;
public homeController(IUser IUser)
{
_IUser = IUser;
}
public ActionResult RedirectAngular()
{
return View();
}
[HttpGet]
public ActionResult Login()
{
return View();
}
[HttpPost]
public ActionResult Login(UserModel model)
{
if (ModelState.IsValid)
{
if (_IUser.IsValidUser(model.Login,model.Password))
{
FormsAuthentication.SetAuthCookie(model.Login, false);
return RedirectToAction("RedirectAngular", "home");
}
else
{
// ModelState.AddModelError("", "The user name or password provided is incorrect.");
}
//}
}
return View();
}
public ActionResult LogOff()
{
FormsAuthentication.SignOut();
return RedirectToAction("Login", "home");
}
}
}
You could just put it in a model or ViewBag and render the view if the logon form is actually a page and whatever page you redirect to when authenticated is another. 如果登录表单实际上是页面,而您在身份验证后重定向到的任何页面都是另一个页面,则可以将其放在模型或ViewBag中并呈现视图。 Then just use the model / ViewBag to populate a page / app Setting javascript global or push them into angular value or constant like so:
然后,只需使用模型/ ViewBag来填充页面/应用设置javascript全局或将它们按如下所示推入角度值或常数即可:
//Controller Action
public ActionResult Logon(string username, string password) {
//authentication successful...
//using ViewBag, but model will do as well..
ViewBag.UserId = 12; //for example...
ViewBag.UserName = "John Doe";
return View();
}
@* View
somewhere near end of <body> tag...
*@
<script src=".../angular.js">
<script>
//or load this from a file...
angular.module('moduleName', []);
</script>
<script>
//this need to be in page!!
angular.moduel('moduleName')
.value('appSettings', {
userId : @ViewBag.UserId,
userName: '@ViewBag.UserName'
});
</script>
<script>
//this can be loaded from file...
angular.controller('controllerName', ctrlFn);
ctrlFn.$inject = ['$log', 'appSettings'];
function ctrlFn($log, appSettings) {
//do something with appSetting here...
$log.info(appSettings.userId, appSettings.userName);
}
</script>
If this is not what you meant, and you are pushing the form info as Ajax and your Angular is actually a SPA then you need to use AJAX to marshal data between server and client side... 如果这不是您的意思,并且您将表单信息作为Ajax推送,而Angular实际上是SPA,则需要使用AJAX在服务器和客户端之间封送数据。
Just return a JsonResult like so... 像这样返回JsonResult ...
[HttpPost]
public ActionResult Logon(string username, string password)
{
//authenticate here... assume succesful...
var user = new { userId = 12, userName = "John Doe" }
return Json(user, "application/json", Encoding.UTF8);
}
in your angular, just handle whatever getting returned back like so: 以您的角度,只需处理返回的所有内容,如下所示:
<script>
angular.module('moduleName')
.factory('loginSvc', svcFn);
svcFn.$inject = ['$http'];
function svcFn($http) {
var svc = {
login: login
};
return svc;
function login(username, password) {
return $http.post(
'/api/login',
angular.toJson({username: username, password: password});
}
}
angular.module('moduleName')
.controller('controllerName', ctrlFn);
ctrlFn.$inject = ['$log', 'loginSvc'];
function ctrlFn($log, loginSvc) {
var self = this;
self.username = "";
self.password = "";
self.login = login;
function login() {
loginSvc.login(username, password)
.then(handleLoginSuccess)
.catch(handleLoginFailure);
}
function handleLoginSuccess(userInfo) {
$log.info(userInfo); //this should contain logged in user id and username
}
//some other functions here...
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.