Es gibt ein paar Dinge, die Sie tun müssen. Erstellen Sie einen OAuth-Client, der Token-Anforderungen stellt, und verwenden Sie diese, um Zugriffstoken vom Identitätsserver zu erhalten, mit denen Sie auf Ihre Web-API-Endpunkte zugreifen können. Dazu muss Ihr OAuth-Client den impliziten Fluss aktiviert haben. Anschließend melden Sie sich beim Identity Server an, normalerweise über ein Popup-Fenster, in dem sich Ihr OAuth-Client anmelden kann. Sie müssen Ihre OAuth-Client-Details in der Abfragezeichenfolge der Login-Anfrage an Idsrv, eine OAuth-Client-Konfiguration, übergeben wäre das, was Sie für den OAuth-Client in Ihrem Panel Admin Idsrv definiert, würde parametrieren Sie, dass es auf die oauth2/authorzie uRL anhängen:
getIdpOauthEndpointUrl: function() {
return "https://192.168.1.9/issue/oauth2/authorize";
},
getOAuthConfig: function() {
return {
client_id: "Your Oauth CLient ID that you specifie din Identity Server",
scope: "The scope of your RP",
response_type: "token",
redirect_uri: "https://..YourAngularAppUrl/AuthCallback.html"
};
}
Sie dann das Login-Fenster öffnen:
var url = authService.getIdpOauthEndpointUrl() + "?" + $.param(authService.getOAuthConfig());
window.open(url, "Login", "height=500,width=350");
In Ihrem OAuth-Client inIdsrv müssen Sie eine Weiterleitungs-URL angeben, in unserem Fall:
https://YourAngularAppUrl/AuthCallback.html
Dies ist, was Sie in die Anmeldungsanfrage zum Identitätsserver zusammen mit Ihnen OAuth-Client-Details übergeben. Die Seite AuthCallback.html extrahiert lediglich das von idsrv an diese Seite in einer Abfragezeichenfolge zurückgegebene Zugriffstoken und übergibt es an Ihre eckige App. Wie Sie dies tun, hängt davon ab, aber dieses Zugriffstoken muss in Ihre Kopfzeilen $http eingegeben werden .
Das Zugriffstoken kann in Ihrer AuthCallback.html Seite wie folgt extrahiert werden:
<script src="/Scripts/jquery-2.0.3.js"></script>
<script src="/Scripts/jquery.ba-bbq.min.js"></script>
<script type="text/javascript">
var params = $.deparam.fragment(location.hash.substring(1));
window.opener.oAuthCallback(params);
window.close();
</script>
die OAuthCallback Funktion in meiner Schale Seite definiert ist, ist meine index.html und verantwortlich für die Token-Passing es in gegeben hat meine eckige App und setze es in die $http Header.
function oAuthCallback(OAUTHTOKEN) {
angular.element(window.document).scope().setHttpAuthHeaderAndAuthenticate(OAUTHTOKEN);
}
Die setHttpAuthHeaderAndAuthenticate() Funktion auf meine $rootScope definiert ist, und es setzt das Token in den $http authorizaiton Header:
$http.defaults.headers.common.Authorization = 'Bearer ' + OAUTHTOKEN["access_token"];
einen Blick auf this post von Christian Weyer hat es tut genau das, was wir re tun, aber es ist eine Knockout/Web-API-App, das gleiche Konzept immer noch.
Der nächste Schritt ist, Ihre Web-API zu sagen, dass sie das Zugriffstoken von idsrv akzeptiert, das ist einfach;
public static void Configure(HttpConfiguration config)
{
var authConfig = new AuthenticationConfiguration();
authConfig.AddJsonWebToken(
YourIdsrvSiteId, YourRpsScope/Relam,YourRpsSymmetricSigningKey
);
config.MessageHandlers.Add(new AuthenticationHandler(authNConfig));
}
Sie könnten auch einen ClaimsAuthenticationManager und ClaimsAuthorizationManager hier definieren, damit Sie Ansprüche zu transformieren und Grant/Deny Zugang sto die Web-api Ressourcen. Auch das ist alles in Christian Weyers Post. Hoffe das hilft.
Ja, das funktioniert auch, die Lösung, die ich gab, ist jedoch besser geeignet, wenn Sie SSO wollen. –
Vielen Dank für die Veröffentlichung Ihrer Lösung. Das hat mir geholfen zu verteilen !! Es ist auch schön, sich über einen Proxy anzumelden, anstatt zu Idsrv umzuleiten. Nochmals vielen Dank. – StefanHa
Froh, Ihnen zu helfen! – cdiazal