I'm developing an Asana app using Ember.js and I've running into some issue when I need to call the API. The oauth2 sign in/sign up is working great and I receive a working token ( tested it using curl)
I understand that I need to use the "Authorization: Bearer" header to auth with the API and this also work great using curl.
Here's my code:
$.ajax({
url: 'https://app.asana.com/api/1.0/users/me',
type: 'GET',
dataType: "json",
complete: function (resp) { console.log(resp) },
error: function (jqXHR, textStatus, errorThrown) { console.log( textStatus )},
beforeSend: function (xhr) { xhr.setRequestHeader("Authorization: Bearer", "my_access_token") }
});
When I execute this code, I get the following error
Uncaught SyntaxError: Unexpected token : me:1
parsererror
it looks like Asana doesn't reply with a properly encoded JSON file?
this the response that can't be parsed (sorry for the poorly formatted JSON)
{"data":{"id":864403617524,"name":"Sylvain","email":"my#email.com","photo":{"image_21x21":"https://s3.amazonaws.com/profile_photos/864403617524.skysUHPuO07ZftDGJSjY_21x21.png","image_27x27":"https://s3.amazonaws.com/profile_photos/864403617524.skysUHPuO07ZftDGJSjY_27x27.png","image_36x36":"https://s3.amazonaws.com/profile_photos/864403617524.skysUHPuO07ZftDGJSjY_36x36.png","image_60x60":"https://s3.amazonaws.com/profile_photos/864403617524.skysUHPuO07ZftDGJSjY_60x60.png","image_128x128":"https://s3.amazonaws.com/profile_photos/864403617524.skysUHPuO07ZftDGJSjY_huge.jpeg"},"workspaces":[{"id":498346170860,"name":"Personal Projects"},{"id":3958612780941,"name":"insideFPL"},{"id":5502245946578,"name":"Shipping Pixel"}]}}
Any help is much appreciated.
Cheers,
S
The problem seems to be that you have set the Authorization header incorrectly. The following works for me:
$.ajax(
'https://app.asana.com/api/1.0/users/me',
{
type: 'GET',
dataType: 'json',
beforeSend: function (xhr) {
xhr.setRequestHeader("Authorization", "Bearer $token")
},
complete: function (resp) {
console.log(resp);
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(textStatus);
}
}
);
Bearer should be at the beginning of the second parameter, and there should be no colon in either string.
Related
i have a php API server with below setting :
and i try to consume the API server by below ajax:
$.ajaxSetup({
contentType: "application/json; charset=utf-8",
//contentType: "text/plain",
dataType: "json",
beforeSend: function (xhr) {
xhr.setRequestHeader("authorization", "Basic " + oAuthKey);
},
complete: function (xhr, status) {
//
}});
request = $.ajax({
type: "GET",
url: "http://www.example.com/testAPI/users/10004",
async: false,
});
request.done(function (response, textStatus, jqXHR) {
var msg = textStatus;
});
request.fail(function (jqXHR, textStatus, errorThrown) {
var msg = errorThrown;
});
when i watch the activity in Fiddler, the request is using http options instead of http get. i know this is because i am setting xhr.setRequestHeader cause preflight request. Due to the API server required authentication, i have no choice and need to set the customer header.
when i try to run above request inside Fiddler, it manage to return correct json data. But when i run the above java script in my phone gap app, it return error.
*** In fiddler, it will auto use http get, so that is why no error. In my app, it keep using http options.
I am using codeigniter with csrf enabled. i am making some ajax post requests but somehow i am getting 403 post forbidden error. my folder structure is like this i have included this js in which ajax code is written outside of application folder. the code i am using for ajax request is
var data = {
name: $('.name').val(),
crm_csrf_token: $('input[name="crm_csrf_token"]').val()
}
var url = 'http://demo/signup/signup';
$.ajax({
url: url,
dataType: 'json',
type: 'post',
contentType: 'application/json',
data: data,
success: function( data, textStatus, jQxhr ){
console.log(data);
console.log(textStatus);
console.log(jQxhr);
},
error: function( jqXhr, textStatus, errorThrown ){
console.log(jqXhr);
console.log(textStatus);
console.log(errorThrown);
}
});
so where am i going wrong. before making this ajax call i am validating form using javascript too. site_url() and base_url is not accessible outside application forlder too.
you just need to send csrf token via using jquery cookie you can download it from here
https://github.com/js-cookie/js-cookie
now in your ajax call
$.ajax({
url:url,
data:{
"<?php echo $this->security->get_csrf_token_name(); ?>": Cookies.get('your_csrf_cookie_name_in_config')
},
method :"POST",
success:function(data){
$("#city").html(data);
}
});
Try this working for me, I guess its problem with your url. Here i correct this, might be work for you.
JQuery
var data = {
name: $('.name').val(),
crm_csrf_token: $('input[name="crm_csrf_token"]').val()
}
//Url should be index.php/YourControllerName/YourMethodName
var url = '<?php echo base_url(); ?>index.php/demo/signup';
$.ajax({
url: url,
dataType: 'json',
type: 'post',
contentType: 'application/json',
data: data,
success: function( data, textStatus, jQxhr ){
console.log(data);
console.log(textStatus);
console.log(jQxhr);
},
error: function( jqXhr, textStatus, errorThrown ){
console.log(jqXhr);
console.log(textStatus);
console.log(errorThrown);
}
});
CI Controller :
<?php
class demo extends CI_Controller {
public function signup()
{
echo 'Hello World!';
}
}
Greetings!
I have the following code which I wish to use for inserting a record into an entity of an ODATA service.
The post request throws a XMLHttpRequest cannot load Invalid HTTP status code 501.
Apparently GET request works fine. Can anyone suggest a way to find out the problem ? Does my WCF Service has a problem ?
var data = { application_id: 777 , user_id: 'test' };
var data = JSON.stringify(data);
$.ajax({
type: 'POST',
contentType: 'application/json; charset=utf-8',
datatype: 'json',
url: oDataURL + 'application_admins',
data: data,
beforeSend: function (XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "application/json");
},
success: function (data, textStatus, XmlHttpRequest) {
account = data.d;
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
}
});
I have mobile services configured on my Azure database and I am trying to send a POST request to update the data. The service keeps returning a bad request and I fear its because of the format of my JQuery.Ajax request. I have tried a number combinations but I can't see what I'm doing wrong. The schema of the request can be found here (http://msdn.microsoft.com/en-us/library/windowsazure/jj677200.aspx), any help would be appreciated.
function RegisterPatient(){
var wsUrl = "https://vervemobile.azure-mobile.net/tables/ref_*****";
var data = {"YearOfBirth":1970,"Sex":"M","ControlGroupMember":false,"OrganisationID":null,"Type":null}
$.ajax({
url:wsUrl,
type: "POST",
data:data,
beforeSend: function (request)
{
request.setRequestHeader("X-ZUMO-APPLICATION", "******");
request.setRequestHeader("Content-Type", "application/json");
},
success: function(data, textStatus, jqXHR)
{
alert(JSON.stringify(data));
},
error: function (jqXHR, textStatus, errorThrown)
{
alert(JSON.stringify(jqXHR));
console.log(JSON.stringify(jqXHR));
console.log(JSON.stringify(textStatus));
console.log(JSON.stringify(errorThrown));
}
});
}
Thanks in Advance,
Bradley
The request requires a json body to be sent, so you have to stringify your data.
...
$.ajax({
url:wsUrl,
type: "POST",
data: JSON.stringify(data),
...
I have the following jQuery code:
$.ajax({
url: Url,
dataType: 'JSONP',
type: 'POST',
success: function (data, textStatus, jqXHR) {
//callback function here
},
error: function (xhr, ajaxOptions, thrownError) {
//report error
}
});
However, when i view this AJAX request in Fiddler, my request has been converted from a POST to a GET.
This is not allowed with the API I'm connecting to, as it must be a POST request.
Why is this happening?
JSONP requests can only be GETs.
Remove dataType: 'JSONP'.
dataType: 'JSONP',
is always a GET request
You cannot use POST with JSONP see https://groups.google.com/forum/?fromgroups=#!topic/jquery-dev/5-tKI-7zQvs for more detail on this.