Connexion à TFS Api dans Angular, 401 non autorisé

Question

J'ai rencontré un problème avec l'API get request dans ma première application Angular. J'essaie d'obtenir tous les projets d'un serveur, j'ai l'url correcte (cela fonctionne dans le facteur, même dans mon navigateur), j'ai également généré un jeton de mon compte sur TFS, cependant, je reçois toujours un 401 non autorisé dans la console lorsque je lance l'application. Toute aide serait appréciée. Ai-je besoin de fournir l'authentification Windows? Est-il même possible sur Angular?

Voici la méthode que j'essaie de lancer. Toutes les importations sont là et la méthode est appelée depuis OnInit.

getProjects(): void { 
    const authHeader = new HttpHeaders(); 
    authHeader.append('Authorization', 'Bearer ' + 
    `perfectly valid token here`); 
    this.http.get('perfectly valid server url here/_apis/projects?api- 
    version=1.0', {headers: authHeader}).subscribe(data => { 
     this.results = data['results']; 
    }); 
    } 

Answer 1

Je l'ai obtenu en utilisant une authentification de base.

getProjects(): void { 
    const authHeader = new HttpHeaders(); 
    authHeader.append('Authorization', 'Basic ' + 
    base64('Username:Password')); 
    this.http.get('perfectly valid server url here/_apis/projects?api- 
    version=1.0', {headers: authHeader}).subscribe(data => { 
     this.results = data['results']; 
    }); 
    } 

Answer 2

Vous pouvez essayer de fournir l'authentification Windows, il est disponible sur Angular. Et activer CORS dans le projet.

Vérifiez ensuite Cross-origin resource sharing (CORS) exemple ci-dessous pour ajouter l'autorisation dans votre code:

$(document).ready(function() { 
    $.ajax({ 
     url: 'https://fabrikam.visualstudio.com/defaultcollection/_apis/projects?api-version=1.0', 
     dataType: 'json', 
     headers: { 
      'Authorization': 'Basic ' + btoa("" + ":" + myPatToken) 
     } 
    }).done(function(results) { 
     console.log(results.value[0].id + " " + results.value[0].name); 
    }); 
}); 

Vous pouvez référencer ces articles pour un dépannage plus approfondi:

• AngularJS & Web API Active Directory Security
• HOW TO IMPLEMENT WINDOWS AUTHENTICATION IN AN ANGULARJS APPLICATION WITH A STAND-ALONE WEB API