AJAX POST请求隐藏基本身份验证凭据

Question

我一直在研究向我的API发送AJAX POST请求的方法，并且我正在尝试了解如何正确传递基本身份验证凭据。

          Interface                    API

https://www.example.com/app/ -------＆gt; https://api.example.com/

使用我在StackOverflow上找到的这个例子 - 任何人都无法查看JS的来源，以明文形式查看我的用户名和密码，并且可以访问我的所有API函数吗？

如果是这样，如何在不向世界展示的情况下传递我的用户名和密码？

$.ajax({  
    url: 'yoururl',
    username : username,
    password :password,
    type: 'POST',
    contentType: 'application/x-www-form-urlencoded',
    dataType: "text",
    xhrFields: 
    {
        withCredentials: true
    },
    beforeSend: function (xhr) { 
        xhr.setRequestHeader('Authorization', 'Basic ' + btoa(username + ":" + password));             
    }
});

Answer 1

是的，如果您在JavaScript中对您的用户名和密码进行硬编码，整个世界都可以看到并使用它们。

您不应使用基本身份验证来保护Web API。我在this answer中描述了几种替代方案。我的偏好是OAuth2。从JavaScript客户端使用它，您需要查看隐式流，这是专门针对不受信任的客户端。