One common approach is for the client to initiate a call with the user name and password via HTTPS, receiving a token in return. The question then arises: how should this token be stored? If your application is a Single Page Application (SPA), storing it in a JavaScript variable could be a viable option to bypass Cross Site Request Forgery (XSRF) risks. It's crucial to ensure that sensitive information like user credentials are never saved on the client side, and that the token has a short and finite lifespan.
UPDATE:
In case you can regenerate the token upon each page load (if it's not an SPA), this would further enhance security by keeping the token lifetime minimal. Here is an example code snippet using an Authorization header with the bearer scheme. Alternatively, you may opt for a custom scheme if standardization is not a requirement.
var accessToken = ''; // Fill this variable with the token server-side
$.ajax({
type: 'GET',
url: 'http://whatever',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
headers: { 'Authorization=': ='Bearer ' + accessToken },
success: function (data) {
// Handle successful response
}
});