Basic authentication for website to secure site login and API access

Question

I'm looking at the security model of a website that's being developed. After researching the web i have found that there are several security models to secure websites i.e. Basic Auth, JWT ...

At the moment, SSL is not enabled as still in dev. Website has a login page and communicates via API's (including login and logout). On the login page, as a test, I have attempted to log in with false details, and then I have looked at the developer tools to identify the security mechanism and found the following screenshots. I think the site is using basic authentication, though I noted that the email / password is not encoded and is using a custom login form. Could someone confirm if it is basic authentication being utilised?

Developer Tools Images

[Request Header Image][2]

UPDATE: I discovered that once the user is authenticated by email/password, I should have posted the screenshots as this is where keys are returned. In the below screenshot a bidder token and bidder secret is sent back to client. I think these are generated through crypto on backend. So I don't think its JWT, but is this a suitable way in creating keys and not sending in header but in response body?

Network tab after user logged in

Login Form Code :

 {

        /* prepare ui */
        progress.classList.remove('hide');
        login_btn.innerText = 'Logging In';
        login_btn.setAttribute('disabled', true);

        /* make http request */
        var http = new XMLHttpRequest();
        var url = SERVER + '/api/bidder/login';
        var body = {
            email: email.value,
            password: password.value
        };

        http.open('POST', url, true);
        http.setRequestHeader('Content-type', 'application/JSON');

        http.onreadystatechange = function () { //Call a function when the state changes.
            if (http.readyState == 4 && http.status == 200) {
                var res = JSON.parse(http.responseText);

                if (res.status) {

                    localStorage.setItem("bidData", JSON.stringify(res.data));
                    window.location.href = window.location.href.replace('login.html','');

                } else {
                    Toast.show('Danger', res.message);
                }

                /* reset ui */
                progress.classList.add('hide');
                login_btn.innerText = 'Log In';
                login_btn.removeAttribute('disabled');

            }
        }
        http.send(JSON.stringify(body));

    }

Answer 1

When you use basic access authentication, credentials wouldn't be loaded in a request payload. They reside in an authorization header like "Authorization: Basic ~some credential here~".

So if you neither see this authorization header in your request nor a popup like below on the website, basic access authentication is not enabled.

Answer 2

Spring security is the most basic authentication in the Spring project If you want to enable Spring security, the first thing you must add is the spring security library to your project. After adding it, you create a class to configure Spring security.

A function in the class config for Spring security.

@Override
protected void configure(HttpSecurity http) throws Exception {
    http
            .cors()
                .and()
            .csrf()
                .disable()
            .exceptionHandling()
                .authenticationEntryPoint(unauthorizedHandler)
                .and()
            .sessionManagement()
                .sessionCreationPolicy(SessionCreationPolicy.STATELESS)
                .and()
            .authorizeRequests()
                .antMatchers("/",
                    "/api/statistical/**",
                    "/static/**",
                    "/webjars/**",
                    "/img/**",
                    "/css/**",
                    "/js/**",
                    "/api/diary/**")
                    .permitAll()
                .antMatchers("/api/auth/**")
                    .permitAll()
                .antMatchers("/api/user/checkUsernameAvailability", "/api/user/checkEmailAvailability")
                    .permitAll()
                .antMatchers(HttpMethod.GET, "/api/users/**") //, "/api/polls/**"
                    .permitAll()
                .anyRequest()
                    .authenticated();