POST-запрос с использованием Angular HttpClient не работает

Question

POST-запрос с использованием Angular HttpClient не работает

Я пытаюсь опубликовать пользовательские данные в PHP RESTful API из моего ионного приложения. Я пытался найти решение, но не помогло. Я создал провайдера, содержащего функцию, а именно «onSignup (signupForm)», которая вызывается при нажатии кнопки.

Код выглядит следующим образом:

signup(username: string,email: string,password: string): void {

let headers = new HttpHeaders();
headers = headers.set("Content-Type","application/json; charset=UTF-8");
let body= {
name:username, email:email, password:password
};

this.http.post('http://www.something.com/register', JSON.stringify(body),
{headers: headers})
.subscribe(data => {
console.log(data);
});
this.storage.set(this.HAS_LOGGED_IN, true);
this.setUsername(username);
this.events.publish('user:signup');
};

Код для API выглядит так:

<?php
header("Access-Control-Allow-Origin:*");
header("Content-Type: application/json; charset=UTF-8");
require_once '../include/DbHandler.php';
require_once '../include/PassHash.php';
require '.././libs/Slim/Slim.php';

\Slim\Slim::registerAutoloader();

$app = new \Slim\Slim();

/**
* ----------- METHODS WITHOUT AUTHENTICATION -------------------------------
--
*/
/**
* User Registration
* url - /register
* method - POST
* params - name, email, password
*/
$app->post('/register', function() use ($app) {
file_put_contents("logs.txt","/register Route has been visited");

// check for required params
verifyRequiredParams(array('name', 'email', 'password'));

$response = array();


// reading post params
$name = $app->request->post('name');
$email = $app->request->post('email');
$password = $app->request->post('password');

// validating email address
validateEmail($email);

$db = new DbHandler();
$res = $db->createUser($name, $email, $password);

if ($res == USER_CREATED_SUCCESSFULLY) {
$response["error"] = false;
$response["message"] = "You are successfully registered";
} else if ($res == USER_CREATE_FAILED) {
$response["error"] = true;
$response["message"] = "Oops! An error occurred while registereing";
} else if ($res == USER_ALREADY_EXISTED) {
$response["error"] = true;
$response["message"] = "Sorry, this email already existed";
}
// echo json response
echoRespnse(201, $response);
});

Я получаю ошибку

Не удалось загрузить ресурс: сервер ответил со статусом 404 (не найдено).
Ошибка загрузки http://www.something.com/register: Ответ на предпечатную проверку имеет недопустимый код состояния HTTP 404

Этот API отлично работает в Postman, но сталкивается с проблемой, когда я запускаю приложение в Chrome.

Что-то мне не хватает в API или во время POST-вызова?

Пожалуйста помоги. Заранее спасибо.

Редактировать:

Я добавил скриншот вкладки сети. Это то, что я получаю в своих заголовках запросов и ответов. Я думаю, что может быть несовпадение в двух заголовках, и определенно это не может быть проблемой с CORS, потому что я могу делать вызовы GET без каких-либо проблем с CORS.

Добавлен скриншот вкладки консоли с ошибками:

0

angular-httpclient http-post ionic-framework php rest

Решение

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

попробуй это

header('Access-Control-Allow-Origin: *');
$dados = file_get_contents('php://input');

вы получите JSON из вашего углового запроса …

0

Источник

Accepted Answer

Так как это работает от Почтальона, но не от вашего приложения, я бы внимательно посмотрел на CORS. Вам нужно установить заголовки при поступлении запроса, для почтовых запросов Angular HttpClient отправит запрос OPTIONS.

Я не часто использую PHP, но, возможно, что-то вроде этого будет работать

if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');
header('Content-Length: 0');
header('Content-Type: application/json');
die();
}

Изменить: так как вы используете Slim Framework, я предполагаю, что на ваш код. Вы можете обращаться с запросами OPTIONS, как описано в документации Slim Framework v2 (не уверен, какую версию вы используете).

$app->options('/register', function ($app) {
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');
header('Content-Length: 0');
header('Content-Type: application/json');
die();
});

Или вы можете установить заголовки так, как описано
https://www.slimframework.com/docs/v2/response/headers.html

$app->response->headers->set('Access-Control-Allow-Origin', '*');
$app->response->headers->set('Access-Control-Allow-Methods', 'POST, OPTIONS');
$app->response->headers->set('Access-Control-Allow-Headers', 'Content-Type');
$app->response->headers->set('Content-Type', 'application/json');

1