How to Consume Secured Web Api from C# MVC and AngularJS - angularjs

How to Consume Secured Web Api from other application C# MVC and AngularJS .
[Authorize(Users = "Steve,Mike")]
public class EmployeeController : ApiController
{
MyDB db = new MyDB();
public IEnumerable<EmployeeViewModel> GetAllEmployee()
{
return db.Employee.Select(item => new EmployeeViewModel { EmpID = item.EmpID, Name = item.Name, Region = item.Region }).ToList();
}
}
The following code I can get without Secure WebApi from AngularJS
var ft = searchText.toLowerCase();
$http.get('/api/Employee/GetAllEmployee').success(function (largeLoad) {
data = largeLoad.filter(function (item) {
return JSON.stringify(item).toLowerCase().indexOf(ft) != -1;
});
$scope.setPagingData(data, page, pageSize);
});
Your help is highly appreciated...

what kind of Secured Web Api do you want to consume?
you may think about oAuth

Related

AspNet.Core Identity Authentification from WPF client

I've implemented asp.net core Identity authentifaiction and it's working fine with my web application. In the startup.cs file, I have the following:
services.ConfigureApplicationCookie(options =>
{
// Cookie settings
options.Cookie.HttpOnly = true;
options.ExpireTimeSpan = TimeSpan.FromMinutes(30);
options.LoginPath = "/Identity/Account/Login";
options.AccessDeniedPath = "/Identity/Account/AccessDenied";
options.SlidingExpiration = true;
});
And in the Login.chtml.cs, I've the the login method:
public async Task<IActionResult> OnPostAsync(string returnUrl = null)
{
if (ModelState.IsValid)
{
var result = await _signInManager.PasswordSignInAsync(Input.Email, Input.Password, Input.RememberMe, lockoutOnFailure: true);
if (result.Succeeded)
{
//...
}
else
{
//....
}
}
return Page();
}
Now I'm putting in place a WPF client in which I want to authenticate my users using the AspNetCore.Identity login procedure. Any suggestion about how to proceed will be highly appreciated.
Finally, I decided to go with IdentityServer4 in order to have a centralized login and workflow for the WPF client and other clients that I may need later.

IdentityServer4 - Redirect to MVC client after Logout

I am using IdenetityServer4 and Redirecting to MVC client after Logout is not working. Following is my MVC client controller Logout action:
public async Task Logout()
{
await HttpContext.Authentication.SignOutAsync("Cookies");
await HttpContext.Authentication.SignOutAsync("oidc");
}
Following is identity server 4 Host config file.
public static IEnumerable<Client> GetClients()
{
return new List<Client>
{
// other clients omitted...
// OpenID Connect implicit flow client (MVC)
new Client
{
ClientId = "mvc",
ClientName = "MVC Client",
AllowedGrantTypes = GrantTypes.Implicit,
// where to redirect to after login
RedirectUris = { "http://localhost:58422/signin-oidc" },
// where to redirect to after logout
PostLogoutRedirectUris = { "http://localhost:58422/signout-callback-oidc" },
AllowedScopes = new List<string>
{
IdentityServerConstants.StandardScopes.OpenId,
IdentityServerConstants.StandardScopes.Profile
}
}
};
}
I want user to be redirect back to MVC client after getting Logged out from IdentityServer. Right now user has to click link show in below image to redirected back to MVC site but i think user should be automatically redirected back to MVC client.
There is no problem in your Config.cs or in the MVC controller.
Go to your IdentityServer4 Application then inside AccountController's Logout [HttpPost] method, do the following changes:
public async Task<IActionResult> Logout(LogoutViewModel model)
{
...
//return View("LoggedOut", vm);
return Redirect(vm.PostLogoutRedirectUri);
}
This will redirect the user back to MVC application (in your case).
There is a better way to do this:
You can set these options from AccountOptions.cs as follows:
public static bool ShowLogoutPrompt = false;
public static bool AutomaticRedirectAfterSignOut = true;
If anyone is using the Scaffolding (they use the Razor Page files), here is how to fix it according to the answer of Akhilesh:
In Areas\Identity\Pages\Account\Logout.cshtml:
First, add IIdentityServerInteractionService service:
IIdentityServerInteractionService _interaction;
public LogoutModel(SignInManager<IdentityUser> signInManager, ILogger<LogoutModel> logger, IIdentityServerInteractionService _interaction)
{
_signInManager = signInManager;
_logger = logger;
this._interaction = _interaction;
}
You may need to add support for OnGet(), logic maybe different depends on your case, in my case, Get or Post does not matter:
public async Task<IActionResult> OnGet(string returnUrl = null)
{
return await this.OnPost(returnUrl);
}
Add the LogoutId logic in OnPost:
public async Task<IActionResult> OnPost(string returnUrl = null)
{
await _signInManager.SignOutAsync();
_logger.LogInformation("User logged out.");
var logoutId = this.Request.Query["logoutId"].ToString();
if (returnUrl != null)
{
return LocalRedirect(returnUrl);
}
else if (!string.IsNullOrEmpty(logoutId))
{
var logoutContext = await this._interaction.GetLogoutContextAsync(logoutId);
returnUrl = logoutContext.PostLogoutRedirectUri;
if (!string.IsNullOrEmpty(returnUrl))
{
return this.Redirect(returnUrl);
}
else
{
return Page();
}
}
else
{
return Page();
}
}
No extra code is needed. You should ensure if Model.AutomaticRedirectAfterSignOut=true and signout-redirect.js exists in wwwroot/js and in LoggedOut.cshtml
#if (Model.AutomaticRedirectAfterSignOut)
{
<script src="~/js/signout-redirect.js"></script>
}
makes all work (see code below)
window.addEventListener("load", function () {
var a = document.querySelector("a.PostLogoutRedirectUri");
if (a) {
window.location = a.href;
}
});
thus user is redirected to mvc from LoggedOut.cshtml

ServiceStack cant handle cookie from subdomain angular client

I have a problem on servicestack catch client cookie.
My Service domain : service.domain.com
Website (Angular) : www.domain.com
Each one on dedicated server.
I developing on Self-Host method in Servicestack 4.
Here is my Request Filter looks cookies than if noting than set thread culture.
this.PreRequestFilters.Add((httpReq, httpResp) =>
{
var lang = httpReq.GetCookieValue("Lang");
if (!string.IsNullOrEmpty(lang))
{
Thread.CurrentThread.CurrentUICulture = new CultureInfo(lang);
}
else
{
Thread.CurrentThread.CurrentUICulture = new CultureInfo("en");
httpResp.SetCookie("Lang","en",TimeSpan.FromDays(100));
}
});
and this is my Language service taking "Lang" parameter.
public class LanguageService : ServiceStack.Service
{
public Language Any(LanguageRequest request)
{
this.Response.SetCookie("Lang", request.Lang, TimeSpan.FromDays(100));
return new Language() { };
}
}
Unfortunalety prerequestfilter catch noting after languageservice.
Thanks for your suggestions.
By default Cookies in different sub domains are treated as separate domains.
You can try specifying the domain on each Cookie with:
SetConfig(new HostConfig {
RestrictAllCookiesToDomain = "domain.com",
});

Web API 405 Error with $http.post

I'm receiving a 405 error with a POST request using $http.post. What's weird is that I'm using $http.post in another area of my application and it works just fine.
I'm using AngularJS for client side, and Web API for server side. I've posted all relevant information (apart from my web.config) that I can think of. Is there something very obvious I'm missing here?
code below does not work (throws 405)
Here's the api controller method that I'm trying to hit:
public async Task<IHttpActionResult> LinkLogin(string provider)
{
Account user = await _repo.FindByNameAsync(User.Identity.Name);
if (user == null)
{
return BadRequest("User does not exist!");
}
return new ChallengeResult(provider, null, "auth/Manage/LinkLoginCallback", user.Id);
}
Here's how I'm trying to hit it on the client side:
var _linkLogin = function (provider) {
$http.post(serviceBase + 'auth/Manage/LinkLogin', provider).then(function (response) {
return response;
});
};
CODE BELOW IS CODE THAT WORKS
Api controller function that works:
// POST auth/Authorization/Register
[AllowAnonymous]
[Route("Register")]
public async Task<IHttpActionResult> Register(UserModel userModel)
{
if (!ModelState.IsValid)
{
return BadRequest(ModelState);
}
IdentityResult result = await _repo.RegisterUser(userModel);
IHttpActionResult errorResult = GetErrorResult(result);
if (errorResult != null)
{
return errorResult;
}
return Ok();
}
Calling it from the client side:
var _saveRegistration = function (registration) {
_logOut();
return $http.post(serviceBase + 'auth/Authorization/register', registration).then(function (response) {
return response;
});
};
Here is my web api configuration:
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
// Web API routes
config.MapHttpAttributeRoutes();
config.Routes.MapHttpRoute(
name: "AuthenticationApi",
routeTemplate: "auth/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
config.Routes.MapODataServiceRoute("ODataRoute", "api", GenerateEdmModel());
var jsonFormatter = config.Formatters.OfType<JsonMediaTypeFormatter>().First();
jsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver();
}
private static IEdmModel GenerateEdmModel()
{
ODataConventionModelBuilder builder = new ODataConventionModelBuilder();
return builder.GetEdmModel();
}
}
Now I have tried a number of different solutions posted on the web to no avail, the following are links to things I have tried:
Web api not supporting POST method
Web API Put Request generates an Http 405 Method Not Allowed error
http://blog.dontpaniclabs.com/post/2013/01/23/That-Pesky-Requested-Resource-Does-Not-Support-HTTP-Method-POST-Error-When-Using-MVC-Web-API
I hate answering my own question. If anyone else runs into this issue it's because you're trying to send a simple string value to a web api controller.
I used this solution with success: http://jasonwatmore.com/post/2014/04/18/Post-a-simple-string-value-from-AngularJS-to-NET-Web-API.aspx
If the link is dead, you simple wrap the string value in double quotes in your POST request like so:
$http.post(Config.apiUrl + '/processfile', '"' + fileName + '"');

WPF and MVC4 Web API Internal Server Error 500 on POST

So I'm attempting to attach to a web api method via a WPF service, but get only a 500 error on anything other than a GET.
WPF call:
using (var client = new HttpClient())
{
var user = new MyUser
{
EntityID = Guid.NewGuid(),
FirstName = "WPF",
LastName = "test"
};
var formatter = new JsonMediaTypeFormatter();
HttpContent content = new ObjectContent<MyUser>(user, formatter);
client.BaseAddress = new Uri("http://localhost:19527/api/");
var response = await client.PostAsJsonAsync("MyUser", content);
//.ContinueWith((postTask) => result = (postTask.Result.Content == null) ? "Could not create user" : "User created successully!");
var r = response.StatusCode;
}'
...and the receiving controller:
public HttpResponseMessage Get(string badgeId)
{
return Request.CreateResponse<bool>(HttpStatusCode.OK, (service.UserByBadge(badgeId) != null));
}
public HttpResponseMessage Put(MyUser user)
{
return Request.CreateResponse<bool>(HttpStatusCode.OK, service.UpsertUser(user));
}
public HttpResponseMessage Post(MyUser user)
{
if (service.UpsertUser(user)) return Request.CreateResponse<MyUser>(HttpStatusCode.OK, service.Get<MyUser>(u => u.BadgeID == user.BadgeID));
return Request.CreateResponse<MyUser>(HttpStatusCode.NoContent, null);
}'
The service on the WebApi controller is a GenericRepository, which is working fine, since the Get method returns as expected. It's only when I use Post that I get the error. Debugging the methods throws the break point in the Get, but not in the Post, so I don't think it's ever being called.
Here's the route config:
routes.MapRoute(
name: "Default",
url: "api/{controller}/{action}/{id}",
defaults: new { controller = "{controller}", action = "{action}", id = UrlParameter.Optional }
);
I've tried different examples from other SO posts, but none appear to address this issue specifically. I'm guessing there's something wrong with how I've constructed the Post() method?
================================================================
RESOLUTION: Model being passed was failing property validations. Why this was causing a 500, not certain. But once I solved for this, API method began working.
If anybody has a "why" explanation, would love to know for future reference.

Resources