在 Angular 中使用 http$ 进行基本身份验证 - 传递用户名/密码和grant_type

Question

我正在尝试使用 Angular 对我知道使用 Postman 工作的授权端点进行身份验证。

<script type="text/javascript">
    var tokenGeneratorApp = angular.module('myApp', []);
    myApp.controller('AuthenticationController', function ($scope, $http) {
        var ac = this;
        ac.authorizationToken = null;
        ac.getAuthorizationToken = function () {
            $http({
                method : 'POST',
                url: 'https://api.myserver.net/oauth/token',
                data: {
                    grant_type: 'password',
                    username: 'theUserName', 
                    password: 'thePassword'
                },
                headers: {
                    'Content-Type': 'application/json'
                }
            }).then(_authenticationSuccess, _authenticationError);
        };
        // Private methods to handle promise results
        function _authenticationSuccess(response) {
            ac.authorizationToken = response.data;
            ac.resultsDisplay = ac.authorizationToken;
        };
        function _authenticationError(response) {
            ac.resultsDisplay = 'An error occured: ' + response.data;
        };
    });
</script>

当我打电话给getAuthorizationToken()时，我得到一个Http 400的回复。当我查看response.data对象时，出现一个错误，说error:"unsupported_grant_type".这让我感到困惑，因为在 Postman 客户端中，我指定grant_type password并且所有工作都按预期工作。

我一定在 Angular 代码中做错了什么。

Answer 1

最近遇到了非常类似的问题。尝试删除">标头"并插入">数据类型"，如下所示：

        $http({
            method : 'POST',
            url: 'https://api.myserver.net/oauth/token',
            dataType: "json",
            data: {
                grant_type: 'password',
                username: 'theUserName', 
                password: 'thePassword'
            }

编辑

        $http({
            method : 'POST',
            url: 'https://api.myserver.net/oauth/token',
            data: {
                "username=" + theUserName + "&password=" +   
                thePassword + "&grant_type=thePassword"
            },
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }

Answer 2

//resolve => error："unsupported_grant_type">

vm.BtnLogin = function (( {

    $scope.txtUsernamee;
    $scope.txtPasswordd;
    var client_credentials =  $scope.txtUsernamee +   $scope.txtPasswordd;
    var auth = 'username=' + $scope.txtUsernamee + '&' + 'password=' + $scope.txtPasswordd + '&grant_type=password';
    $http({
        method: "POST",
        url: '/token',
        contentType: 'application/json',
        data: auth
    }).then(function success(response) {
        //$('#successModal').modal('show');
        console.log("ok")
        },
        function error(e) {
            console.log(e)
        }
    );
};