Jak uniemożliwić przeglądarce wywoływanie podstawowego wyskakującego okienka autoryzacji i obsługę błędu 401 za pomocą JQuery?

Muszę wysłać żądanie autoryzacji przy użyciu podstawowego uwierzytelniania. Z powodzeniem zaimplementowałem to przy użyciu jquery. Jednak gdy otrzymuję błąd 401, otwiera się wyskakujące okienko przeglądarki uwierzytelniania podstawowego i nie jest wywoływane wywołanie zwrotne błędu jquery ajax.

Ostatnio też miałem do czynienia z tym problemem. Ponieważ nie możesz zmienić domyślnego zachowania przeglądarki, polegającego na wyświetlaniu wyskakującego okienka w przypadku uwierzytelnienia 401( podstawowego lub uproszczonego ), istnieją dwa sposoby, aby to naprawić:

• Zmień odpowiedź serwera, aby nie zwracał pliku 401. 200Zamiast tego zwróć kod i obsłuż go w swoim kliencie jQuery.

• Zmień metodę, której używasz do autoryzacji, na niestandardową wartość w nagłówku. Przeglądarki wyświetlą wyskakujące okienko Basic i Digest . Musisz to zmienić zarówno na kliencie, jak i na serwerze.

  headers : {
    "Authorization" : "BasicCustom"
  }
  

Proszę również spojrzeć na to, aby zobaczyć przykład użycia jQuery z podstawowym uwierzytelnianiem.

Zwróć ogólny kod stanu 400, a następnie przetwórz ten kod po stronie klienta.

Możesz też zachować 401 i nie zwracać nagłówka WWW-Authenticate, na który tak naprawdę odpowiada przeglądarka, wyświetlając wyskakujące okienko uwierzytelniania. Jeśli brakuje nagłówka WWW-Authenticate, przeglądarka nie monituje o poświadczenia.

Możesz ukryć wyskakujące okienko autoryzacji z adresem URL żądania wyglądającym tak:

https://username:[email protected]/admin/...

Jeśli pojawi się błąd 401 (zła nazwa użytkownika lub hasło), zostanie to poprawnie obsłużone przez wywołanie zwrotne błędu jQuery. Może powodować pewne problemy z bezpieczeństwem (w przypadku protokołu http zamiast https), ale działa.

UPD: ta obsługa rozwiązania zostanie usunięta w Chrome 59

Jak zauważyli inni, jedynym sposobem zmiany zachowania przeglądarki jest upewnienie się, że odpowiedź albo nie zawiera kodu stanu 401, albo jeśli zawiera, nie zawiera WWW-Authenticate: Basicnagłówka. Ponieważ zmiana kodu statusu nie jest zbyt semantyczna i niepożądana, dobrym podejściem jest usunięcie WWW-Authenticatenagłówka. Jeśli nie możesz lub nie chcesz modyfikować aplikacji serwera WWW, zawsze możesz ją obsługiwać lub proxy przez Apache (jeśli nie używasz jeszcze Apache).

Oto konfiguracja dla Apache do przepisania odpowiedzi w celu usunięcia nagłówka IFF WWW-Authenticate, które żądanie zawiera nagłówek X-Requested-With: XMLHttpRequest(który jest domyślnie ustawiany przez główne struktury Javascript, takie jak JQuery / AngularJS itp ...) ORAZ odpowiedź zawiera nagłówek WWW-Authenticate: Basic.

Testowane na Apache 2.4 (nie jestem pewien, czy działa z 2.2). Zależy to od mod_headersinstalowanego modułu. (Na Debianie / Ubuntu sudo a2enmod headersi zrestartuj Apache)

    <Location />
            # Make sure that if it is an XHR request,
            # we don't send back basic authentication header.
            # This is to prevent the browser from displaying a basic auth login dialog.
            Header unset WWW-Authenticate "expr=req('X-Requested-With') == 'XMLHttpRequest' && resp('WWW-Authenticate') =~ /^Basic/"
    </Location>   

Użyj X-Requested-With: XMLHttpRequest z nagłówkiem żądania. Więc nagłówek odpowiedzi nie będzie zawierał WWW-Authenticate: Basic.

beforeSend: function (xhr) {
                    xhr.setRequestHeader('Authorization', ("Basic "
                        .concat(btoa(key))));
                    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
                },

Jeśli używasz serwera IIS, możesz skonfigurować przepisywanie adresów URL usług IIS (v2), aby przepisać WWW-Authenticationnagłówek Nonena żądany adres URL.

Przewodnik tutaj .

Wartość, którą chcesz zmienić, to response_www_authenticate.

Jeśli potrzebujesz więcej informacji, dodaj komentarz, a ja opublikuję plik web.config.

Jeśli nagłówek WWW-Authenticate zostanie usunięty, nie otrzymasz buforowania poświadczeń i nie odzyskasz nagłówka Authorization w żądaniu. Oznacza to, że teraz będziesz musiał wprowadzić poświadczenia dla każdego nowego żądania, które wygenerujesz.

Alternatywnie, jeśli możesz dostosować odpowiedź serwera, możesz zwrócić 403 Forbidden.

Przeglądarka nie otworzy wyskakującego okienka uwierzytelniania i zostanie wywołane wywołanie zwrotne jquery.

W Safari możesz używać żądań synchronicznych, aby przeglądarka nie wyświetlała wyskakującego okienka. Oczywiście, żądania synchroniczne powinny być używane tylko w tym przypadku do sprawdzania danych uwierzytelniających użytkownika ... Możesz użyć takiego żądania przed wysłaniem rzeczywistego żądania, co może spowodować złe wrażenia użytkownika, jeśli zawartość (wysłana lub odebrana) jest dość ciężka.

    var xmlhttp=new XMLHttpRequest;
    xmlhttp.withCredentials=true;
    xmlhttp.open("POST",<YOUR UR>,false,username,password);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');

Utwórz adres URL logowania /, a następnie zaakceptuj parametry „użytkownik” i „hasło” przez GET i nie wymagaj podstawowej autoryzacji. Tutaj użyj php, node, java, cokolwiek i przeanalizuj swój plik z hasłami i dopasuj do niego parametry (użytkownik / przepustka). Jeśli jest dopasowanie, przekieruj na http: // użytkownik: hasł[email protected]/ (spowoduje to ustawienie poświadczeń w przeglądarce), jeśli nie, wyślij odpowiedź 401 (bez nagłówka WWW-Authenticate).

Od tyłu ze Spring Boot użyłem niestandardowego BasicAuthenticationEntryPoint:

@Override
protected void configure(HttpSecurity http) throws Exception {
    http.cors().and().authorizeRequests()
            ...
            .antMatchers(PUBLIC_AUTH).permitAll()
            .and().httpBasic()
//    https://www.baeldung.com/spring-security-basic-authentication
            .authenticationEntryPoint(authBasicAuthenticationEntryPoint())
            ...

@Bean
public BasicAuthenticationEntryPoint authBasicAuthenticationEntryPoint() {
    return new BasicAuthenticationEntryPoint() {
        {
            setRealmName("pirsApp");
        }

        @Override
        public void commence
                (HttpServletRequest request, HttpServletResponse response, AuthenticationException authEx)
                throws IOException, ServletException {
            if (request.getRequestURI().equals(PUBLIC_AUTH)) {
                response.sendError(HttpStatus.PRECONDITION_FAILED.value(), "Wrong credentials");
            } else {
                super.commence(request, response, authEx);
            }
        }
    };
}