Как аутентифицировать запрос API Get (html) - PullRequest
Новая
       148

Как аутентифицировать запрос API Get (html)

0 голосов
/ 12 июля 2020

Я пытаюсь понять, как получить данные из API, защищенного пользователем и паролем для аутентификации. Я получил следующий код, но получаю сообщение об ошибке, не позволяющее мне достичь своей цели

Код для HTML: 

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="js/jquery-3.5.1.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var content = $('#content');

            $('#btn').click(function () {
                var username = $('#txtUsername').val();
                var password = $('#txtPassword').val();

                $.ajax({
                    type: 'GET',
                    url: '(the api url)',
                    dataType: 'jsonp',
                    headers: {
                        'Authorization': 'Basic ' + btoa(username + ':' + password)
                    },
                    
                    success: function (data) {
                        
                        $.each(data, function (index, val) {
                            var cdrVal = val.cdr_root[0].cdr;
                            content.append('<li>' + cdrVal + '</li>')
                        });
                    },
                    complete: function (jqXHR) {
                        if (jqXHR.status == '401') {
                            content.empty();
                            content.append('<li style="color:red">'
                                + jqXHR.status + ' : ' + jqXHR.statusText + '</li>')
                        }
                    }
                });
            });

            $('#btnClear').click(function () {
                $("content").empty();
            });
        });
    </script>
</head>
<body>
    Username : <input type="text" id="txtUsername" />
    Password : <input type="password" id="txtPassword" />
    <br /><br />
    <input id="btn" type="button" value="Authenticate" />
    <input id="btnClear" type="button" value="Clear" />
    <ul id="content"></ul>
</body>
</html>

Сообщение об ошибке: 

jquery-3.5.1.min.js:2 GET (URL)&callback=jQuery3510613249910788189_1594517328830&_=1594517328834 net::ERR_ABORTED 400 (Bad Request)

Что могло быть причиной этого? Я пробовал несколько вещей в Интернете, но ничего не помогло. Я сомневаюсь, что это сам URL, так как я все еще могу получить к нему доступ через веб-браузер.

1 Ответ

0 голосов
/ 12 июля 2020

beforeSend может быть путем к go. Из документации jQuery по $. ajax () :

Используйте это для установки пользовательских заголовков, et c.

Этот вопрос может быть дубликатом этого вопроса: Использовать базовую c аутентификацию с jQuery и Ajax

...