JQuery cross domain POST shenanigans

Я пытаюсь выполнить аутентификацию API, который позволяет аутентифицироваться с помощью POST с JSON в виде данных формы в формате { "username": "myusername", "password": "mypassword" }.

Я пытаюсь в течение двух дней, чтобы это работало с jQuery, но я столкнулся с проблемами, потому что это перекрестный домен. Как я могу это сделать?

Сообщение об ошибке:

Request Method:OPTIONS
Status Code:405 METHOD NOT ALLOWED

Код до сих пор:

var username = "myusername";
var password = "mypass"
var authurl = "https://myurl";

$.ajax
({
    type: "POST",
    url: authurl,
    dataType: 'json',
    contentType: "application/json; charset=utf-8",
    async: false,
    data: {'json':'{"username":"' + username + '", "password":"' + password + '"}'},
    success: function (result) {
        $('#json').html(result);
    }
})

Подводя итог:

  • API принимает только POST для авторизации
  • API требует json как данные формы, например: { "username": "myusername", "password": "mypassword" }
  • js запускается из другого домена, вызывая ошибки перекрестных доменов

Ваша помощь очень ценится:)

Ответы

Ответ 1

Вы должны следовать другому шаблону. Ваш локальный JS сделает сообщение ajax локальному URL-адресу, который будет принимать метод POST с вашими json-данными.

В этот момент ваш код сервера сделает HTTP POST с соответствующими данными на удаленном сервере, получит ответ и отправит его обратно вызывающему js.

Ответ 2

Проблема в том, что домен, который вы пытаетесь выполнить POST, не отвечает на запрос OPTIONS, который отправляется перед каждым междоменным запросом. С запросом OPTIONS браузер получает информацию о правилах перекрестных доменов и т.д. Чтобы включить запрос кросс-домена, сервер должен установить Access-Control-Allow-Origin:* (или домен script, фактически, но * охватывает все) и, возможно, Access-Control-Allow-Methods: GET, POST, OPTIONS.

Ответ 3

У меня есть хостинг на GoDaddy. Мне тоже нужен был ответ на этот вопрос, и после обыска я обнаружил, что это возможно.

Я написал файл .htaccess, поместив его в ту же папку, что и моя страница действий. Вот содержимое файла .htaccess:

Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

Вот мой вызов ajax:

    $.ajax({
        url: 'http://www.mydomain.com/myactionpagefolder/gbactionpage.php',  //server script to process data
        type: 'POST',
        xhr: function() {  // custom xhr
            myXhr = $.ajaxSettings.xhr();
            if(myXhr.upload){ // check if upload property exists
                myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // for handling the progress of the upload
            }
            return myXhr;
        },
        //Ajax events
        beforeSend: beforeSendHandler,
        success: completeHandler,
        error: errorHandler,
        // Form data
        data: formData,
        //Options to tell JQuery not to process data or worry about content-type
        cache: false,
        contentType: false,
        processData: false
    });

См. эту статью для справки:

Набор заголовков Access-Control-Allow-Origin в .htaccess не работает