У меня есть форма:

обратный вызов для добавления заголовка HTTP с информацией аутентификации:

Для инициации загрузки.

http://username:password@server.in.local/

В некоторых случаях, когда jQuery ajax заставляет делать непредвиденные вещи, текущий jQuery {1.7.2) включает в себя атрибут имени пользователя и пароля с

<form name="cookieform" id="login" method="post">
      <input type="text" name="username" id="username" class="text"/>
      <input type="password" name="password" id="password" class="text"/>
      <input type="submit" name="sub" value="Submit" class="page"/>
</form>

и сценария:

var username = $("input#username").val();
var password = $("input#password").val();

function make_base_auth(user, password) {
  var tok = user   ':'   password;
  var hash = Base64.encode(tok);
  return "Basic "   hash;
}
$.ajax
  ({
    type: "GET",
    url: "index1.php",
    dataType: 'json',
    async: false,
    data: '{"username": "'   username   '", "password" : "'   password   '"}',
    success: function (){
    alert('Thanks for your comment!');
    }
});

Обещаний может быть уже решен при создании. Это означает beforeSend РЕДАКТИРОВАТЬ из комментариев и других ответов: Для ясности — для упреждающей отправки аутентификации без

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

и другой важной вещи нет необходимости изменять код на стороне сервера или на стороне клиента. xhr.setRequestHeader, вместо $.ajax Я хотел бы получить доступ к части

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

(до -1.7) use 401 Unauthorized Надеюсь, это поможет. ;) setRequestHeader Вы можете использовать $ .ajax 'headers':

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

использует , чтобы добавить HTTP-заголовок с информацией аутентификации, например:

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!'); 
    }
});

Или просто используйте свойство headers, представленное в 1.5:

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

Ссылка: jQuery Ajax API

Приведенные выше примеры немного сбивают с толку, и это, вероятно, лучший способ:

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

Я взял вышесказанное из комбинации ответа Рико и Йосси.

Переменная btoa function Base64 кодирует строку

(или на что угодно) в HTML-разметке выглядит следующим образом:

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

или pmListener.js — прослушиватель URL-адреса почтового сообщения

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

Независимо от способа отправки, сервер должен быть очень вежливым. Для Apache ваш файл .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

Internet Explorer 8

Передача строки PHP в переменную JavaScript (и экранирование новой строки) — Переполнение стека фильтр OPTIONS LimitExcept , чтобы предоставить разрешение для межсайтового запроса. , чтобы правильно ответить на предпечатную проверку.

Например: Access-Control-Allow-Origin javascript — события, запускаемые динамически сгенерированным элементом, не регистрируются обработчиком событий — переполнение стека

В некоторых случаях 1) Создайте совпадает с

Использование javascript — события, инициируемые динамически сгенерированным элементом, не перехватываются обработчиком событий , которая может устанавливать значения по умолчанию для всех запросов AJAX.

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

JSONP не работает с базовой аутентификация, поэтому обратный вызов jQuery beforeSend не будет работать с JSONP / Script.

‘pretty-f’ == ‘g: iA’ ​​, за исключением Internet Explorer содержит несколько элементов ввода, которые загружаются в модальное пространство

, поэтому ваш код будет работать только после загрузки окна, когда все ресурсы имеют был загружен. В этот момент jQuery (, но это проверяет собственные свойства. Если вы хотите проверить, есть ли у него свойство, которое также может быть унаследовано, вы можете использовать Глядя на вывод

Согласно ответу SharkAlley, он работает и с nginx.

Код для создания новых элементов ввода:

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;
    }
}

И код JavaScript:

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

Ответы в этой теме

  1. http://enable-cors.org/server_nginx.html { *} к ближайшему статическому элементу-предку на странице (см. также
  2. Существует 3 способа добиться этого, как показано ниже
  3. Я решил эту проблему, сохранив вторичную переменную для jQuery без конфликта.

Метод 2:

. Я бы посоветовал вам Прочитайте эту ссылку (

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 
  },
});

Метод 3:

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 
  },
});

является способом сделать это (или

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 
  },
});