[JQUERY] jQuery를하고 Ajax를 기본 인증을 사용하여

jQuery를하고 Ajax를 기본 인증을 사용하여

해결법

1. ---

   1.사용 jQuery의 beforeSend 콜백 인증 정보와 함께 HTTP 헤더를 추가합니다 :

   사용 jQuery의 beforeSend 콜백 인증 정보와 함께 HTTP 헤더를 추가합니다 :

   beforeSend: function (xhr) {
       xhr.setRequestHeader ("Authorization", "Basic " + btoa(username + ":" + password));
   },
   

2. ---

   2.어떻게 일을 1 년으로 변경합니다. xhr.setRequestHeader 대신 헤더 특성뿐만 아니라, 현재 jQuery를 (1.7.2+)는 $ 아약스 호출로 사용자 이름과 암호 속성이 포함되어 있습니다.

   어떻게 일을 1 년으로 변경합니다. xhr.setRequestHeader 대신 헤더 특성뿐만 아니라, 현재 jQuery를 (1.7.2+)는 $ 아약스 호출로 사용자 이름과 암호 속성이 포함되어 있습니다.

   $.ajax
   ({
     type: "GET",
     url: "index1.php",
     dataType: 'json',
     username: username,
     password: password,
     data: '{ "comment" }',
     success: function (){
       alert('Thanks for your comment!'); 
     }
   });
   

   의견과 다른 답변에서 편집 : 명확하게하려면 - 선제 적으로 전송 인증하기 위해 401 권한이 응답하지 않고, 대신 setRequestHeader를 사용하는 '헤더'(-1.7 사전)

   $.ajax
   ({
     type: "GET",
     url: "index1.php",
     dataType: 'json',
     headers: {
       "Authorization": "Basic " + btoa(USERNAME + ":" + PASSWORD)
     },
     data: '{ "comment" }',
     success: function (){
       alert('Thanks for your comment!'); 
     }
   });
   

3. ---

   3.그래서 같은 인증 정보와 HTTP 헤더를 추가 할 beforeSend 콜백을 사용합니다 :

   그래서 같은 인증 정보와 HTTP 헤더를 추가 할 beforeSend 콜백을 사용합니다 :

   var username = $("input#username").val();
   var password = $("input#password").val();  
   
   function make_base_auth(user, password) {
     var tok = user + ':' + password;
     var hash = btoa(tok);
     return "Basic " + hash;
   }
   $.ajax
     ({
       type: "GET",
       url: "index1.php",
       dataType: 'json',
       async: false,
       data: '{}',
       beforeSend: function (xhr){ 
           xhr.setRequestHeader('Authorization', make_base_auth(username, password)); 
       },
       success: function (){
           alert('Thanks for your comment!'); 
       }
   });
   

4. ---

   4.또는 단순히 속성은 1.5에서 소개 된 헤더를 사용 :

   또는 단순히 속성은 1.5에서 소개 된 헤더를 사용 :

   headers: {"Authorization": "Basic xxxx"}
   

   참조 : jQuery를 아약스 API

5. ---

   5.위의 예는 약간 혼란, 그리고 이것은 아마도 가장 좋은 방법입니다 :

   위의 예는 약간 혼란, 그리고 이것은 아마도 가장 좋은 방법입니다 :

   $.ajaxSetup({
     headers: {
       'Authorization': "Basic " + btoa(USERNAME + ":" + PASSWORD)
     }
   });
   

   나는 리코와 요시의 대답의 조합에서 위를했다.

   btoa 기능 Base64로 문자열을 암호화한다.

6. ---

   6.다른 제안으로, 당신은 직접 Ajax 호출에 사용자 이름과 암호를 설정할 수 있습니다 :

   다른 제안으로, 당신은 직접 Ajax 호출에 사용자 이름과 암호를 설정할 수 있습니다 :

   $.ajax({
     username: username,
     password: password,
     // ... other parameters.
   });
   

   오히려 일반 텍스트 자격 증명을 저장하지 않을 경우 또는 헤더 속성을 사용합니다 :

   $.ajax({
     headers: {"Authorization": "Basic xxxx"},
     // ... other parameters.
   });
   

   당신이 그것을 보낼 어느 방법으로, 서버는 매우 공손해야한다. 아파치를 들어, htaccess로 파일은 다음과 같이 보일 것이다 :

   <LimitExcept OPTIONS>
       AuthUserFile /path/to/.htpasswd
       AuthType Basic
       AuthName "Whatever"
       Require valid-user
   </LimitExcept>
   
   Header always set Access-Control-Allow-Headers Authorization
   Header always set Access-Control-Allow-Credentials true
   
   SetEnvIf Origin "^(.*?)$" origin_is=$0
   Header always set Access-Control-Allow-Origin %{origin_is}e env=origin_is
   

   일부 크로스 도메인 요청의 경우, 브라우저는 인증 헤더가 누락 프리 플라이트 옵션 요청을 보냅니다. 프리 플라이트에 제대로 응답 할 LimitExcept 태그 내부 사용자의 인증 지침을 감싸.

   그런 다음 크로스 사이트 요청에 대한 권한을 부여하기 위해이 인증이 허용되는 브라우저 및 액세스 제어 - 허용 - 원산지를 알려줄 수있는 몇 가지 헤더를 보냅니다.

   어떤 경우에는 * 와일드 카드는 Access-Control-Allow-Origin의 값으로하지 작업을 수행합니다 : 당신은 수신자의 정확한 도메인을 반환해야합니다. 사용한다 SetEnvIf이 값을 촬영합니다.

7. ---

   7.JQuery와 ajaxSetup 기능을 사용하여, 그 모든 Ajax 요청에 대한 기본 값을 설정할 수 있습니다.

   JQuery와 ajaxSetup 기능을 사용하여, 그 모든 Ajax 요청에 대한 기본 값을 설정할 수 있습니다.

   $.ajaxSetup({
     headers: {
       'Authorization': "Basic XXXXX"
     }
   });
   

8. ---

   8.JSONP는 기본 인증이 작동하지 않습니다 그래서 jQuery를 beforeSend 콜백 JSONP / 스크립트를 사용하지 작동합니다.

   JSONP는 기본 인증이 작동하지 않습니다 그래서 jQuery를 beforeSend 콜백 JSONP / 스크립트를 사용하지 작동합니다.

   I 요청 (: pw@domain.tld 예컨대 사용자)를 사용자와 패스워드를 추가함으로써이 문제를 해결 관리. 이 URL을 통해 인증 (전화가 단순히 실행되지 않습니다)는 지원되지 않습니다 인터넷 익스플로러를 제외한 거의 모든 브라우저에서 작동합니다.

   http://support.microsoft.com/kb/834489를 참조하십시오.

9. ---

   9.아래와 같이이를 달성하기 위해 3 가지 방법이 있습니다

   아래와 같이이를 달성하기 위해 3 가지 방법이 있습니다

   방법 1 :

   var uName="abc";
   var passwrd="pqr";
   
   $.ajax({
       type: '{GET/POST}',
       url: '{urlpath}',
       headers: {
           "Authorization": "Basic " + btoa(uName+":"+passwrd);
       },
       success : function(data) {
         //Success block  
       },
      error: function (xhr,ajaxOptions,throwError){
       //Error block 
     },
   });
   

   방법 2 :

   var uName="abc";
   var passwrd="pqr";
   
   $.ajax({
       type: '{GET/POST}',
       url: '{urlpath}',
        beforeSend: function (xhr){ 
           xhr.setRequestHeader('Authorization', "Basic " + btoa(uName+":"+passwrd)); 
       },
       success : function(data) {
         //Success block 
      },
      error: function (xhr,ajaxOptions,throwError){
       //Error block 
     },
   });
   

   방법 3 :

   var uName="abc";
   var passwrd="pqr";
   
   $.ajax({
       type: '{GET/POST}',
       url: '{urlpath}',
       username:uName,
       password:passwrd, 
       success : function(data) {
       //Success block  
      },
       error: function (xhr,ajaxOptions,throwError){
       //Error block 
     },
   });
   

10. ---

    10.SharkAlley 응답에 따르면 그것의 nginx도 작동합니다.

    SharkAlley 응답에 따르면 그것의 nginx도 작동합니다.

    나는 nginx를 뒤에 서버에서 jQuery를하여 데이터를 얻을 수있는 솔루션을 검색하고 기본 인증에 의해 제한했다. 이것은 나를 위해 작동합니다 :

    server {
        server_name example.com;
    
        location / {
            if ($request_method = OPTIONS ) {
                add_header Access-Control-Allow-Origin "*";
                add_header Access-Control-Allow-Methods "GET, OPTIONS";
                add_header Access-Control-Allow-Headers "Authorization";
    
                # Not necessary
                #            add_header Access-Control-Allow-Credentials "true";
                #            add_header Content-Length 0;
                #            add_header Content-Type text/plain;
    
                return 200;
            }
    
            auth_basic "Restricted";
            auth_basic_user_file /var/.htpasswd;
    
            proxy_pass http://127.0.0.1:8100;
        }
    }
    

    그리고 자바 스크립트 코드는 다음과 같습니다

    var auth = btoa('username:password');
    $.ajax({
        type: 'GET',
        url: 'http://example.com',
        headers: {
            "Authorization": "Basic " + auth
        },
        success : function(data) {
        },
    });
    

    내가 유용하다고 생각하는 조 :

from https://stackoverflow.com/questions/5507234/use-basic-authentication-with-jquery-and-ajax by cc-by-sa and MIT license