Отправить ajax POST запрос к restfull api

Я создаю API на основе php slim framework с помощью учебника, и теперь я могу зарегистрироваться, войти в систему с помощью аутентификации:

URL     /register
Method  POST
Params  name, email, password

/ регистрация вызова не требует аутентификации, поэтому я пишу ajax для тестирования API:

<button id="createPin"></button>
<script>
$(function() {
$('#createPin').click(function(e) {
e.preventDefault();var dataTest = { "name": "test", "email": "pepe@peperoni.com", "password": "sarasa" }
var urlAjax = "http://www.agroagro.com/test/v1/register";

$.ajax({
type: "POST",
url: urlAjax,
contentType: "application/json",
data: dataTest ,
success: function(data) { alert("ajax worked"); },
error: function(data) {console.log(data); },
dataType: 'json',
beforeSend: function (xhr) {
xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
},
headers: {
'Access-Control-Allow-Origin': '*'
}
});});
});
</script>

Я пытаюсь запустить этот вызов ajax с localhost на agroagro.com/test/v1/register, но получаю:

XMLHttpRequest cannot load http://www.agroagro.com/test/v1/register. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 404.

Есть ли какое-либо решение для междоменного запроса ajax, потому что у меня есть план использовать этот код в качестве внешнего интерфейса мобильного приложения, поэтому мне нужно делать запросы через междоменный домен ajax …

(restApi был создан с помощью этого урока:http://www.androidhive.info/2014/01/how-to-create-rest-api-for-android-app-using-php-slim-and-mysql-day-23/)

0

Решение

Вам необходимо установить правильные заголовки ответов.

В моем случае у меня есть набор заголовков по умолчанию, которые я всегда устанавливаю при получении вызова от моего контроллера API. Это установлено в моей _construct

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
header("Access-Control-Allow-Headers: Origin, Content-Type, Accept, Authorization");

Есть несколько действительно полезных руководств, которые помогут вам понять, как работает CORS и зачем он вам нужен.

Совместное использование ресурсов

Междоменный Ajax с распределением ресурсов между источниками

РЕДАКТИРОВАТЬ:

Сначала вам нужно разрешить доступ ко всем источникам с помощью Access-Control-Allow-Origin: *, вы делаете это сейчас, так что вы увидите ошибку, отличную от опубликованной оригинальной. У меня была похожая проблема при использовании phoneGap и Ionic, и она была решена путем добавления заголовка content-type к моему вызову ajax. Этот пост помог мне XMLHttpRequest не может загрузить.

Я использую Codeigniter для своего API, поэтому я не знаю, насколько это поможет, но оно очень общее, поэтому должно указывать правильное направление.

У меня есть контроллер под названием API, который используется для получения данных из базы данных и возврата JSON.

class Api extends CI_Controller {
....
....
}

В этом классе у меня есть функция __construct. __Construct всегда запускается, когда вызывается класс, поэтому вам не нужно вызывать его самостоятельно. В __construct задайте заголовки CORS заголовки.

public function __construct()
{
parent::__construct();

// Set access header
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
header("Access-Control-Allow-Headers: Origin, HTTP_X_REQUESTED_WITH, Content-Type, Accept, Authorization");

....
....
}

надеюсь, это поможет

1

Другие решения

Других решений пока нет …