Explaining Basic VS Bearer HTTP Authentication

The aim of this page📝 is explain the two types of HTTP authentication: Basic VS Bearer. One of the components we’re using at work is still on a basic auth and I’ve been working on an issue where the expected sign-in pop-up did not show.

Pavol Kutaj

·

Follow

2 min read

·

Jun 6, 2023

--

Listen

Share

• The type of web authentication that creates a pop-up with a username and password is called Basic Authentication.
• Basic Authentication transmits credentials as user ID/password pairs, encoded using base64.
• The user ID and password are passed over the network as clear text, so the basic authentication scheme is not secure unless used in conjunction with a secure transport layer, such as HTTPS.
• Some common types of HTTP authentication include Basic, Bearer, Digest, and Form-Based.
• Another common method is Token-based authentication
• Additionally, there are also methods such as Third-party access, OpenID, and SAML.
• Here is an example of how you can implement Basic Authentication using JavaScript:

function authenticateUser(user, password) {
    var token = user + ":" + password;
    var hash = btoa(token);
    return "Basic " + hash;
}

var request = new XMLHttpRequest();
request.open("GET", "https://example.com/api/endpoint", true);
request.setRequestHeader("Authorization", authenticateUser(username, password));
request.send();

• Basic Authentication uses a username and password pair to authenticate a user.
• Another point is that since this is basic auth, you are able to log in with the following URL

<!-- SYNTAX -->
https://<username>:<password>@<domain>/
<!-- EXAMPLE -->
https://foo:password@example.com

• Bearer Authentication (also called token authentication) involves security tokens called bearer tokens.
• The bearer token is a cryptic string, usually generated by the server in response to a login request
• The client must send this token in the Authorization header when making requests to protected resources: Authorization: Bearer <token>