I have a website with a HTML form that, when submitted, successfully sends a POST request to a .php file on the server (Apache 2.4.48).
However, when I let Javascript handle the submitting through a JS fetch(), the server responds with a 405 error.
So I analysed the request and response headers for the two POST and they are almost identical, so I am confused on why the first method works and the other gets refused.
The following is the request/response when sending through the HTML form (the exclamation points are where the POST requests differ):
GENERAL
Request URL: https://example.com/php/script.php
Request Method: POST
Status Code: 302
Remote Address: 160.153.133.187:443
Referrer Policy: origin-when-cross-origin
RESPONSE HEADERS
cache-control: max-age=0 !
content-length: 0
content-type: text/html; charset=UTF-8
date: Sat, 14 Aug 2021 23:21:34 GMT
expires: Sat, 14 Aug 2021 23:21:34 GMT
location: https://example.com/pages/form-submitted.html#submitted
server: Apache
vary: User-Agent
x-powered-by: PHP/8.0.8
REQUEST HEADERS
:authority: example.com
:method: POST
:path: /php/script.php
:scheme: https
accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9 !
accept-encoding: gzip, deflate, br
accept-language: en-GB,en;q=0.9,es-ES;q=0.8,es;q=0.7,it-IT;q=0.6,it;q=0.5
cache-control: no-cache
content-length: 96
content-type: application/x-www-form-urlencoded !
dnt: 1
origin: https://example.com
pragma: no-cache
referer: https://example.com/contact
sec-ch-ua: "Chromium";v="92", " Not A;Brand";v="99", "Google Chrome";v="92"
sec-ch-ua-mobile: ?0
sec-fetch-dest: document !
sec-fetch-mode: navigate !
sec-fetch-site: same-origin
sec-fetch-user: ?1
upgrade-insecure-requests: 1
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36
FORM DATA
name: Tai Zen
email: taizen@example.com
phone-number: 12345678910
privacy-consent: on
submit:
Below, instead, it's the request/response when sending a POST using fetch():
GENERAL
Request URL: https://example.com/php/script.php
Request Method: POST
Status Code: 302
Remote Address: 160.153.133.187:443
Referrer Policy: same-origin
RESPONSE HEADERS
cache-control: max-age=2741
content-length: 0
content-type: text/html; charset=UTF-8
date: Sat, 14 Aug 2021 23:31:44 GMT
expires: Sun, 15 Aug 2021 00:17:26 GMT
location: https://example.com/405
server: Apache
vary: User-Agent
x-powered-by: PHP/8.0.8
REQUEST HEADERS
:authority: example.com
:method: POST
:path: /php/script.php
:scheme: https
accept: */*
accept-encoding: gzip, deflate, br
accept-language: en-GB,en;q=0.9,es-ES;q=0.8,es;q=0.7,it-IT;q=0.6,it;q=0.5
cache-control: no-cache
content-length: 471
content-type: multipart/form-data; boundary=----WebKitFormBoundary28YayN0mmqwdpQh0
dnt: 1
origin: https://example.com
pragma: no-cache
referer: https://example.com/contact
sec-ch-ua: "Chromium";v="92", " Not A;Brand";v="99", "Google Chrome";v="92"
sec-ch-ua-mobile: ?0
sec-fetch-dest: empty
sec-fetch-mode: same-origin
sec-fetch-site: same-origin
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.131 Safari/537.36
FORM DATA
name: Tai Zen
email: taizen@example.com
phone-number: 12345678910
privacy-consent: on
submit:
Should I change something server side to allow POST requests to that specific file?
However, I would like it to receive POST requests only from the JS I wrote and not external entities, but I don't know exactly how to do it. I tried what has been suggested on this answer, but it did not work, the server gave a 500 error. I suppose that it may be because I am on a shared hosting plan and I do not full access to my Apache settings, but I am not confident this is the reason.
