I am trying to make an Ajax request to run a php file on a local http server. I am getting an Error 405: method not allowed
in my browser console.
I have tried the answers of some similar questions to no avail. I am using npm http-server to host this. I have tried enabling CORS on the http-server, which does not solve the problem.
I can narrow down my problem to the following code (using the answer given here).
/test.html:
<html>
<head>
<title>Button</title>
<meta charset="utf-8">
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
<button type="button">Click Me</button>
<p></p>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$.ajax({
method: 'POST',
url: 'echo.php',
success: function(data) {
alert(data);
$("p").text(data);
}
});
});
});
</script>
</body>
</html>
/echo.php:
<?php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type, Accept');
echo "HELLO WORLD";
?>
I start a server using http-server
from npm
. When I attempt to make POST requests (i.e., click the button), I get the following error in the server log:
[...] "POST /echo.php" Error (404): "Not found"
The echo.php
file is definitely there -- I can make GET
requests to the same url. I also see the following error in my browser console:
POST http://127.0.0.1:8080/echo.php 405 (Method Not Allowed)
send @ jquery.min.js:4
ajax @ jquery.min.js:4
(anonymous function) @ test.html:15
dispatch @ jquery.min.js:3
q.handle @ jquery.min.js:3
When I make a GET
request, no errors appear, and the code of echo.php is placed inside the <p>
, as I would expect.
Is this a problem with my server configuration or just a code problem?
There isn't too much information I can get out of http-server. Here is the full log including the execution command:
$ http-server --cors -p 8080
Starting up http-server, serving ./
Available on:
http://127.0.0.1:8080
Hit CTRL-C to stop the server
[Sat Sep 24 2016 16:47:14 GMT-0400 (EDT)] "GET /test.html" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.101 Safari/537.36"
[Sat Sep 24 2016 16:47:19 GMT-0400 (EDT)] "POST /echo.php" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.101 Safari/537.36"
[Sat Sep 24 2016 16:47:19 GMT-0400 (EDT)] "POST /echo.php" Error (404): "Not found"
http-server
does not support POST
requests after all. See below for answer...
The HyperText Transfer Protocol (HTTP) 405 Method Not Allowed response status code indicates that the server knows the request method, but the target resource doesn't support this method. The server must generate an Allow header field in a 405 status code response.
If you are certain you need a POST request, chances are, you're just using the wrong endpoint on the server. Again, this can only be solved if you have proper documentation to show what methods are supported for each endpoint.
I figured it out! Kind of stupid, but hopefully this is helpful for other people who experience this issue. I was looking through the http-server
repo and encountered the following GitHub issue.
npm
http-server
does not support POST
requests. It is a read-only server, so has no code to facilitate this type of request.
I am now looking into JSON-server, which does support POST
requests.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With