i'm new in progamming and at here i start learn about ajax and rest api usage, how make this api fetch run at browser?
fetch('https://api.blockcypher.com/v1/bcy/test/txs/new', {
method: 'POST',
headers: {
'Content-Type': 'application/json; charset=UTF-8'
},
body: JSON.stringify({"inputs":[{"addresses": ["1EZTFHruH2aBnfeZwCvqwxoyVeQ7ofss6y"]}],"outputs":[{"addresses": ["155FUrRjM3umyw2gA1bJi3eFbHbAQBahBS"], "value": 100}]})
});
Thank You
Related
I'm working with learning some javascript to make a post to a little rest API I created with django rest. I have a post that works when I was working with jQuery but now I am reimplementing using Vue.js and am hitting a snag. When I do the below post request I get a 400 error and am not sure what I am missing. I would imagine something with my header is incorrect? Any advice would be welcome.
axios({
method: 'post',
url: '/api/matches/',
data: JSON.stringify(data),
headers: {
"X-CSRFToken": csrfToken,
"Content-Type": "application/json"
}
})
jQuery post for reference:
$.ajax({
type: "POST",
url: "/api/matches/",
data: JSON.stringify(final_data),
success: function() {},
error: function(err) {console.log(err)},
contentType: "application/json; charset=utf-8",
dataType: "json",
crossDomain:false,
beforeSend: function(xhr, settings) {
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
});
I have a phonegap application that uses
$.ajax(
type: 'POST,
dataType:"json",
url: 'test.com'
data: { mail: 'bob#test.com' }
)
which i get in my glassfish server doing something like
HttpServletRequest request;
request.getParameter('mail');
I'm moving my application in react native so i'm doing
fetch('test.com', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({ mail: 'bob#test.com' }),
})
but that doesn't work, my glassfish server doesn't get my parameters.
How should i do ?
It goes without saying that i don't want to make changes on the server side !
In your first example (using $.ajax()) you are not sending a JSON body. You are actually sending a query string. In your react example, you are sending a JSON body which would need to be handled differently by your server.
You will need to either change your server handler to actually accept JSON or you will have to send a query string with react which would look something like:
fetch('test.com', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: $.param({ mail: 'bob#test.com' }),
})
If you don't have access to jQuery you wouldn't be able to use $.param(). For this particular example, the query string you'd want to send would be
body: "mail=bob#test.com"
It is fairly straightforward to serialize data for a query string and creating a function that will do it pretty easy.
As a side note, in order to send a JSON body with an $.ajax() call, you would want to do something like this:
$.ajax(
type: 'POST,
dataType:"json",
url: 'test.com'
data: { mail: 'bob#test.com' }
contentType: "application/json",
)
Note the contentType parameter which actually tells jQuery how to format the body of the request
I have a phonegap application that uses
$.ajax(
type: 'POST,
dataType:"json",
url: 'test.com'
data: { mail: 'bob#test.com' }
)
which i get in my glassfish server doing something like
HttpServletRequest request;
request.getParameter('mail');
I'm moving my application in react native so i tryed
fetch('test.com', {
method: 'POST',
headers: {
'Content-Type': 'text/plain',
},
body: 'mail=bob#test.com',
})
and i tryed
fetch('test.com', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ mail: 'bob#test.com' }),
})
but neither of these worked, i'm deseperately having request.getParameter('mail') == null on server side.How can i do ?Note : i don't want to change the way the server handles things.
Please explain how to do push notifications with XHR and Javascript. or is there any other way to send push notifications in progressive web apps. I have created curl command and when i execute it in my terminal push notification sent but how to do it on button click?
Here is my cURL command:-
curl --header "Authorization: key=AIzaSxUdg" --header Content-Type:"application/json" https://android.googleapis.com/gcm/send -d "{\"registration_ids\":[\"cxA-dUj8BTs:APAvGlCYW\"]}"
This is what i have tried :-
function send()
{
navigator.serviceWorker.ready
.then(function(registration) {
registration.pushManager.getSubscription()
.then(function (subscription) {
curlCommand(subscription);
$.ajax({
url: "https://android.googleapis.com/gcm/send",
headers: {
Authorization: "key=AIzaSxUdg",
},
contentType: "application/json",
data: JSON.stringify({
"registration_ids": [endpoint]
}),
xhrFields: {
withCredentials: true
},
crossDomain: true,
type:"push",
dataType: 'json'
})
.done(function() {
alert('done');
})
.fail(function() {
alert('err');// Error
});
})
})
}
But it shows error -----
XMLHttpRequest cannot load https://android.googleapis.com/gcm/send. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8880' is therefore not allowed access..
Google API is intended to be used from a server so it is not including CORS headers.
As you are performing a cross origin XHR (from your domain to Google's domain), the User Agent makes a preflight request in search of the CORS headers that tell your client is authorized to perform operations.
To do this you need to make a request to your server (i.e. a POST on /notifications/send) and your server should then execute the cURL request to GCM.
This will work:
function send()
{
navigator.serviceWorker.ready
.then(function(registration) {
registration.pushManager.getSubscription()
.then(function (subscription) {
curlCommand(subscription);
$.ajax({
url: "https://cors-anywhere.herokuapp.com/https://android.googleapis.com/gcm/send",
headers: {
Authorization: "key=AIzaSxUdg",
},
contentType: "application/json",
data: JSON.stringify({
"registration_ids": [endpoint]
}),
xhrFields: {
withCredentials: true
},
crossDomain: true,
type:"push",
dataType: 'json'
})
.done(function() {
alert('done');
})
.fail(function() {
alert('err');// Error
});
})
})
}
I can't get my AJAX request to complete successfully. It's for the bearere token on Twitter's API. I have done successfully in a HTTP request client as shown below:
But I can't replicate this in code:
$.ajax({
type: 'POST',
url: 'https://api.twitter.com/oauth2/token',
headers: {
'Authorization':'Basic ' + base64EncodedBearerTokenCredentials,
},
contentType: 'application/x-www-form-urlencoded; charset=utf-8',
data: {
'grant_type': 'client_credentials'
},
error: function(xhr, status, error) {
},
success: function(response){
},
});
I'm getting a 405, but because I have the Authorization header in I can't see the response in Firebug.
What is it?
Thanks.