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=".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?
Update 1:
There isn't too much information I can get out of http-server. Here is the full log including the execution mand:
$ 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"
Update 2
http-server does not support POST requests after all. See below for answer...
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./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?
Update 1:
There isn't too much information I can get out of http-server. Here is the full log including the execution mand:
$ 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"
Update 2
http-server does not support POST requests after all. See below for answer...
- 1 what happens when you try Access-Control-Allow-Methods:* ? – Benjamin Commented Sep 24, 2016 at 20:39
- Should I print out some log of http-server? I have a feeling that it is a server config problem. – Miles Commented Sep 24, 2016 at 20:40
- 1 Yes i think that would be helpfull – Benjamin Commented Sep 24, 2016 at 20:42
- I see the identical issue when I set it to wildcard. – Miles Commented Sep 24, 2016 at 20:43
- @HansGerber - I can't get much out of the http-server in terms of logs. This page outlines the default settings. I hope that provides more info. – Miles Commented Sep 24, 2016 at 20:53
1 Answer
Reset to default 16I 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.