jQuery $.post method results in 405 (Not Allowed) error - javascript

I have a website served up using Nginx. I've create a very simple web-page with a p tag to display the contents of a file, test.html. I have two buttons, one that does a GET request using $.ajax, and one that does a POST request using $.post.
The GET request works fine, and the contents of the file test.html display in my p tag. When I try to POST to that same file, however, I get an error in the console: "Failed to load resource: the server responded with a status of 405 (Not Allowed)". The POST request is pretty simple, taken right from the example on W3Schools.com - https://www.w3schools.com/JQuery/jquery_ajax_get_post.asp. So I am baffled.
I tried to read and understand what a 405 error could mean. Presumably it means that the POST request is not supported by this URL. But how would I enable it to be supported?
<p id="content-from-ajax"></p>
<button id="get-content-btn">Get Content</button>
<button id="post-something-btn">Post something</button>
<script type="text/javascript">
$("#get-content-btn").click(function() {
$.ajax({type: "GET",
url: "test.html",
success: function(result) {
$("#content-from-ajax").html(result);
alert("GET successful");
}
});
});
$("#post-something-btn").click(function(){
alert("GRRRR");
$.post("test.html",
{
name: "Donald Duck",
city: "Duckburg"
},
function(data, status){
alert("something worked");
});
});
</script>

For a POST request to access resources hosted on your web server you will need an application server. Examples include Laravel for PHP, Spring for Java, and Node for JavaScript.
Many application server require you to explicitly specify what type of request a particular endpoint can receive, this can be confusing when learning a new web application framework because a GET request is often the default.
Though a POST request must be handled by an application server it doesn't need to be one your hosting. So you can access public APIs with a POST request (depending on the API and the endpoint your using) without hosting your site on an application server. So if this project is purely educational, this is the best way to test using a POST request without going through the trouble of configuring one yourself.

Related

How do I pass cookies from a PHP proxy server to a webpage?

I have a webpage consisting of HTML/CSS/JS/JQUERY on server 1.
On server 2, I have a PHP file to avoid cors.
So, I make requests from server 1 to server 2. The PHP code then uses cURL to interact with API I am working with.
This API sends back cookies, which I want to forward back to server 1 ( the website).
I've been searching for a while, but I have no idea how to go about doing this?
I'm guessing it has to do with something to catch the response headers?
Any help would be nice! I'm new to PHP.
Heres more info:
// Here is how I am calling the server 2 file.
$.ajax({
URL:"HTTP://localhost......server.php",
type:"post",
data: $(this).serialize(),
success: .....,
});
Is there any way I can just get the headers in this file regularly?
Eg. Make it automatically set the cookies here?
If I understand this question correctly. You are hosting a website, and the website makes a request to a PHP script that in turn calls an API that returns some set-cookie headers.
For the cookies to be passed on to the client viewing the website, you'd need to extract the cookie values and call PHPs setcookie function before returning the response to the client from PHP.
Most frameworks will provide a mechanism to specify the header for the response to the client and provide the ability to set a cookie.
Based on your update:
// Here is how I am calling the server 2 file.
$.ajax({
URL:"HTTP://localhost......server.php",
type:"post",
data: $(this).serialize(),
success: .....,
});
So you have some JS that is making a request to the "server 2" file. This "server 2" file should be able to extract the values from the response to the curl call it is making and return set-cookie headers to the client. The client will then store those cookies and could provide them on subsequent requests to http://localhost, for how long, for what paths etc are configurable as part of the process for creating the cookie.
Might be worth posting more code, or making it clearer what you aim is with this as there may be a better solution outside of extracting cookie data from the curl call and passing back to the client.

Microsoft Outlook Add-in can't extract/pass data to a localhost server via Ajax

I'm trying to build an Outlook add-in for encrypting/decrypting emails. The Add-in itself uses a web app, which in turn uses Javascript.
I basically want to pass the unencrypted/encrypted email to a local server running python using GET/POST requests, perform some encryption/decryption on it in python, and then pass it back to Outlook Add-in.
The problem is that the Add-in just won't pass any data to the local server nor get something in return. I have tried to work with both Django and Flask with the same results. I also configured the local servers to use locally-generated certificates and keys with no improvement. I even tried routing the HTTP connection using ngrok, but none came of it.
Server response to GET request on HTTP
Server response to GET request on HTTPS using Werkzeug
The code given below never returns "Here5" on item-status. Clearly the success snippet isn't being run.
$.ajax({
url: "https://127.0.0.1:8000/getPost/hello/",
type: 'GET',
dataType: 'json', // added data type
success: function (res) {
$('#item-status').text("Here5");
$('#item-message').text(res);
}
});
I've also added the required URLs in the App Domain part of the manifest file:
<AppDomain>https://127.0.0.1:8000/getPost/hello/</AppDomain>
The Add-in performs fine when running GET requests from other sites on the internet, like:
https://api.github.com/users
However, I just can't seem to run it on my local server. How do I solve this?
Edit: After some debugging, I've learned that XMLHttpRequest status is 0 and responseText is empty. I think it might have something to do with CORS. Am I correct in that assumption? If yes, then how do I disable Cross Origin for localhost in this particular case?
Thank You

Getting a 403 response ONLY when posting to s3 from javascript? All other methods work fine

I'm pretty confused on this one. I'm attempting to post some data straight to S3 from the client rather than bogging down my web server. I'm using Python with the boto library to generate the signature, and javascript to (hopefully) schlep everything over to S3.
This issue I'm running into is that javascript gives me the following error whenever I send the request:
The request signature we calculated does not match the signature you
provided. Check your key and signing method.
I've verified that (a) my keys are valid, and (b) that I can actually upload/download things from S3. I did this by uploading small test files via Python, as well as using plain ol' curl.
The basic setup I have is this:
js reads the form data on the website
makes a request to my web server to get an upload url
uses the url to make an ajax post request to S3
The server side is super simple. It just spits out a url to use for uploading:
c = boto.connect_s3(settings.S3_ACCESS_KEY, settings.S3_AWS_SECRET_ACCESS_KEY)
c.generate_url(5000, 'PUT', settings.S3_BUCKET, 'mycoolkey')
Which spits out something like this:
https://mytestbucket.s3.amazonaws.com/mycoolkey?Signature=OX6vJCNjb4Pz3Fuzh0840qCnY5U%3D&Expires=1415394562&AWSAccessKeyId=MYACCESSKEY
This output is the same that I used with curl to verify that I can actually post to S3
curl --request PUT --upload-file myfilename "https://mytestbucket.s3.amazonaws.com/mycoolkey?Signature=OX6vJCNjb4Pz3Fuzh0840qCnY5U%3D&Expires=1415394562&AWSAccessKeyId=MYACCESSKEY"
So, it's all well and good, until I try to do the same thing via Javascript.
$.ajax({
url: 'https://mytestbucket.s3.amazonaws.com/mycoolkey?Signature=OX6vJCNjb4Pz3Fuzh0840qCnY5U%3D&Expires=1415394562&AWSAccessKeyId=MYACCESSKEY',
type: 'PUT',
data: 'sometestdata',
success: function() {
console.log('Uploaded data successfully.');
}
});
I've set the CORS settings in S3 to allow everything from all domains (while testing), and as far as I can tell, the js should be making the same request as curl does.. so.. what gives?
Why would one request fail while the other succeeds when they're both using the exact same URL?

Cross domain ajax GET parameters not allowed

I'm trying to get data from an API with javascript but i'm getting an error on the request.
$.ajax({
dataType: "jsonp",
url: "https://www.bitstamp.net/api/ticker/",
type: "GET",
succes: myfunction
});
result:
{"error": "GET parameters not allowed for this request."}
I use Jsonp because its another domain.
Why can't I get the data with Jquery?
If I just browse to the link I can see the Json.
I just tried getting data from the url you provided using AJAX. The server did not return any data using the $.ajax and this clearly shows that the server does not support cross domain requests. That is why I asked you if you had access to code because you have to manually specify if you want API to support cross domain requests.
One way around to this is using some server side language to access this API. I once had similar problem and the used PHP CURL to access the API. The php code then served data to JQuery to be used on frontend. So you can write relay code to solve this problem.
Because, as the error message says, bitstamp do not allow it.
If they get a JSONP request for the data, they respond with the error instead of the normal response.

JQuery Client Failing outside localhost

Something pretty peculiar is happening with a simple JS GET client. Here's the code using JQuery:
<h3 onclick="$.ajax({
url: 'http://147.102.82.124/',
type: 'GET',
error: function() { alert('FAILURE'); },
success: function() {alert('SUCCESS')}
});">Click me</h3>
The method fires up a 'FAILURE' message unless the url is set to localhost. At the same time, the remote server replies with a 200 status code ( I checked using the web console of Firefox).
[15:06:59.135] GET http://147.102.82.124/ [HTTP/1.1 200 OK 9ms]
And ideas?
As a security measure cross origin requests are not allowed, see CORS
I got the same issue and I solved using a server script which is always able to get the contents of a different domain.
So your ajax request needs to point to your local script (written using Java, PHP, Python or what ever,...) and your local script will be able to provide you the content of different domain.

Categories