ReactJS POSTrequest не работает (404), но GETrequest работает - PullRequest
Новая
       4

ReactJS POSTrequest не работает (404), но GETrequest работает

0 голосов
/ 25 февраля 2020

У меня очень странная проблема: когда я отправляю POST в свой файл PHP, он возвращает код состояния 404, а когда я выполняю запрос GET, он получает код состояния 200. Я пробовал свои запросы с помощью XMLHttpRequest, Fetch , Ax ios и jquery, но все дают одинаковый ответ. Что я делаю не так?

Это мои ajax запросы. 

const body = { firstName: 'Fred',lastName: 'Flintstone' };
const handleSubmit = async (e) => {
e.preventDefault()
fetch(`ajaxHandler.php`)
.then(res => 
console.log(res)
)
fetch('ajaxHandler.php', {
method: 'POST',
// mode: 'CORS',
body: JSON.stringify(body),
headers: {
'Content-Type': 'application/json'
}
}).then(res => {
console.log(res);
}).catch(err => console.log(err));
}

POST-запрос от консоли. 

login.js:20 POST http://localhost:3000/ajaxHandler.php 404 (Not Found)
handleSubmit @ login.js:20
onClick @ login.js:65
callCallback @ react-dom.development.js:336
invokeGuardedCallbackDev @ react-dom.development.js:385
invokeGuardedCallback @ react-dom.development.js:440
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:454
executeDispatch @ react-dom.development.js:584
executeDispatchesInOrder @ react-dom.development.js:609
executeDispatchesAndRelease @ react-dom.development.js:713
executeDispatchesAndReleaseTopLevel @ react-dom.development.js:722
forEachAccumulated @ react-dom.development.js:694
runEventsInBatch @ react-dom.development.js:739
runExtractedPluginEventsInBatch @ react-dom.development.js:880
handleTopLevel @ react-dom.development.js:5803
batchedEventUpdates$1 @ react-dom.development.js:24401
batchedEventUpdates @ react-dom.development.js:1415
dispatchEventForPluginEventSystem @ react-dom.development.js:5894
attemptToDispatchEvent @ react-dom.development.js:6010
dispatchEvent @ react-dom.development.js:5914
unstable_runWithPriority @ scheduler.development.js:697
runWithPriority$2 @ react-dom.development.js:12149
discreteUpdates$1 @ react-dom.development.js:24417
discreteUpdates @ react-dom.development.js:1438
dispatchDiscreteEvent @ react-dom.development.js:5881
login.js:28 Response {type: "basic", url: "http://localhost:3000/ajaxHandler.php", redirected: false, status: 404, ok: false, …}

GET-ответ от консоли 

login.js:16 Response {type: "basic", url: "http://localhost:3000/ajaxHandler.php", redirected: false, status: 200, ok: true, …}

ajaxHandler (PHP) код 

<?php
session_start();

header('Access-control-Allow-Methods: POST,GET,DELETE,OPTIONS');
header('Accept: application/json');

$response = array("success" => true, "message" => "yeahhh");

echo json_encode($response);

1 Ответ

0 голосов
/ 26 февраля 2020

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

Один вопрос, который мне нужно задать, это: ReactJS сервер и сервер PHP в одном веб-домене? IE, пользователи видят ваш ReactJS код на example.com, но ваш PHP сервер находится на example2.com?

Если серверы одинаковые, то в вашем ReactJS попробуйте определить переменная credentials ... 

const fetchargs = {
    'method': method,
    'credentials': 'same-origin',
};

fetch('ajaxHandler.php', fetchargs...);

А если серверы разные, то измените 'credentials' на include. Проверьте API fetch () в Fetch () Документах MDN .

На вашей стороне PHP я вижу, что вы опускаете заголовок Access-Control-Allow-Origin. Опять же, если вы используете один и тот же домен для обоих интерфейсов / бэкэнда (ReactJS / PHP), тогда вы захотите установить для этого имени домена (как в документах). Если домены различаются, вам нужно установить *, как указано в Документах CORS MDN . 

<?php

     header('Access-Control-Allow-Origin: https://mozilla.org');

?>

Надеюсь, это поможет! 404 могут быть загадочными, но я подозреваю, что именно так настроен ваш сервер для ответа при отправке запрещенного POST.

...