[英]Authentication via IdentityServer3 in angular2 and access to webapi from asp.net mvc4
I try to setup all this frameworks (from title) together. 我尝试一起设置所有这些框架(从标题开始)。 So far I setup IdentitySever3 and managed to get login screen on login button in my angular 2 app.
到目前为止,我已经安装了IdentitySever3,并设法在我的angular 2应用程序中的登录按钮上获得了登录屏幕。
After successful login I receive token from authentication server and now I want to ask for some data from ASP.Net WebApi (.Net 4.6.2). 成功登录后,我从身份验证服务器收到令牌,现在我想从ASP.Net WebApi(.Net 4.6.2)询问一些数据。
And there I have a problem. 而且我有一个问题。 How I should configure this server app, that it be able to understand data from sent token from angular app.
我应该如何配置此服务器应用程序,使其能够理解来自角度应用程序的已发送令牌中的数据。 Most of tutorials describes .Net core.
大多数教程都介绍.Net核心。 Any one can show me some example, or say what I missing.
任何人都可以给我展示一些例子,或者说出我所缺少的。
You are asking a very general question, however maybe the following pointers will help: 您在问一个非常笼统的问题,但是以下指针可能会有所帮助:
Have a look at the https://github.com/IdentityServer/IdentityServer3.Samples You should write normal .Net WebApi and you need basiclly two changes: 1. Implement "Startup" class on the server like one of the examples ( https://github.com/IdentityServer/IdentityServer3.Samples/blob/master/source/WebHost%20(Windows%20Auth)/WebHost/Startup.cs ). 看看https://github.com/IdentityServer/IdentityServer3.Samples。您应该编写普通的.Net WebApi,并且基本上需要进行两个更改:1.像示例之一一样,在服务器上实现“启动”类( https: //github.com/IdentityServer/IdentityServer3.Samples/blob/master/source/WebHost%20(Windows%20Auth)/WebHost/Startup.cs )。 2. Add [Authentication] attribute added on each controller/web method that you want.
2.添加要添加到每个控制器/ Web方法上的[身份验证]属性。
And on the angular app (the examples are from angular1, but should be clear), you'll need to send the token int the Authorization header on each request: 并且在angular应用程序上(示例来自angular1,但应该清楚),您需要在每个请求中将令牌发送给int Authorization标头:
This code you put after the module declaration 您在模块声明后放置的这段代码
.config(($httpProvider: ng.IHttpProvider) => {
$httpProvider.interceptors.push("authInterceptorService");
})
and you make the function 然后你做的功能
export function authInterceptorService($q, $rootScope, $location) {
return {
request,
responseError
};
function request(config) {
config.headers = config.headers || {};
if (!_.startsWith(config.url, **URLtoYourApi**)) {
return config;
}
config.headers.authorization = "Bearer " + **access token**;
return config;
}
function responseError(rejection) {
if (rejection.status === 401) {
// do some rejection logic
$location.path("/");
}
return $q.reject(rejection);
}
}
In this way on each request you'll send the token => access token (which can be store in in local storage). 这样,您将在每个请求上发送令牌=> 访问令牌 (可以存储在本地存储中)。 Obviously the markers ..... means you need to replace with something :)
显然标记...意味着您需要用一些东西来代替:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.