I want to load in a user's home timeline after authenticating through 'sign it with twitter' using OAuth. I'm using this library to handle the authentication part https://github.com/jmathai/twitter-async
The authentication part is working fine but I'm unclear about how to send requests to twitter api as the given authenticated user. I want to make an ajax request for for the user's home timeline like this:
// this call produces "is not allowed by Access-Control-Allow-Origin" error
$.getJSON("http://api.twitter.com/1/statuses/home_timeline.json", function(json) {
console.log(json);
});
So my question is how do I send the user's access token along with my request and where is the token stored? Or am I approaching this problem wrong?
You need to make this request into a JSONP request, so you can do cross-domain AJAX.
$.getJSON("http://api.twitter.com/1/statuses/home_timeline.json?callback=?", function(json) {
console.log(json);
});
The ?callback=? converts this into a JSONP request.
The link you provided is for a PHP library. If you want to make API calls in JavaScript, you need to use a JavaScript OAuth library.
Related
I am using caspio rest api to authenticate my users in a mobile app. Upon authenticating, I was given an access token to which I included in my AJAX call under the parameter 'Authorization' : Bearer [access token].
I understand that I can renew the token with the refresh token given to me where I can use the POST call.
My question is: prior to using the POST call for a new token, must I store the access token?
Also, the Caspio website advised this format for the POST call:
Method: POST
URL: Token Endpoint
Body: grant_type=refresh_token&refresh_token= [token value]
Header parameters:
Authorization: Basic [string "Client_ID:Client_Secret" encoded in Base64]
Content-Type: application/x-www-form-urlencoded
Should I also include the client ID and client secret in the parameters? Upon using Firefox's rest client, I'm getting a bad request (400) error.
Thank you for the help!
I never using caspio rest api before. The answer base on my OAuth experiences.
My question is: prior to using the POST call for a new token, must I store the access token?
YES! The OAuth 2.0 using the access token to switch the refresh token at first time.
Should I also include the client ID and client secret in the parameters? Upon using Firefox's rest client, I'm getting a bad request (400) error.
According to the api document. You should include the client ID and client secret in your request, like most OAuth 2.0 do.
The bad request (400) error you may see the rfc6749 to find further information.
I've deployed a Let's Chat application for my own server.
However, instead of using currently built, original Let's Chat web application I would like to develop my own, using its API.
And according to Let's Chat wiki:
Revoke an API Token
In the top-left dropdown menu:
Select "Auth tokens"
Click "Revoke token"
Choose "Yes". This will delete any previously generated token.
Basic Authentication
Use the API token as the username when authenticating. The password
can be set to anything, but it must not be blank (simply because most
clients require it).
So far I've generated own token and tried to send GET request to retrieve all rooms that I have in the app, but I've got an error: 401 - Unauthorized - I've tried to send this request with { data: my_token, password: my_random_password } credentials but without success. So my main question is: how exactly I can authenticate with Let's Chat API using ajax request?
I couldn't find any API url / endpoint dedicated for such task - please help.
EDIT:
I've tried also setting headers but it still doesn't work:
$.ajax({
url: CHAT_URL + 'rooms',
beforeSend: function(xhr){
xhr.setRequestHeader('username', 'NTczYzZ1111111111111111111JiMWE3MGUwYThiNzZhYjhmYjFjOWJkOTQ5ZDQ2YjhjNWUyMzkwNmMzYjhjMQ==');
xhr.setRequestHeader('password', '123qwe');
}
}).done(function(resp){
console.log('1');
console.log(resp);
}).done(function(resp){
console.log('2');
console.log(resp);
});
From that wiki page:
Use the API token as the Bearer token.
This is done by setting the header Authentication to the value bearer YOUR_TOKEN_HERE
So,
xhr.setRequestHeader('Authentication', 'bearer NTczYzZ1111111111111111111JiMWE3MGUwYThiNzZhYjhmYjFjOWJkOTQ5ZDQ2YjhjNWUyMzkwNmMzYjhjMQ==');
If you want to use basic authentication, this answers that question
How to use Basic Auth with jQuery and AJAX?
I have an API that I am able to authenticate against using the Postman client. Using Postman I am able to enter in my username and password into the header and receive back an access token.
I would like to accomplish the same authentication with a simple HTML page using Javascript. However, I am unsure how to craft the Javascript request and pass in my username and password as I did with Postman.
A password is normally considered private, if you include it in your javascript anyone can read it and fire requests off to the API as your user.
Additionally, the browsers same-origin policy - unless configured otherwise will stop you firing ajax requests to a domain other than the one the webpage was loaded from.
Instead you should create a proxy script in the server-side language of your choice hosted on your domain and fire your ajax requests off to this.
This script would do the relevant actions with the API keeping your credentials a secret and return the response.
Under the address bar of Postman there's a link that says "Generate Code" on previous versions it was a button with a </> symbol.
Clicking that link opens up a popup with a dropdownlist where Javascript is one option, this will generate the code to do the request.
Let me also add to the other answers that with jQuery you can do a get request with $.get(), and a post request with $.post(). But I would do what Vector suggests and generate the JavaScript with Postman.
You could do that with ajax call within a javascript file and you can aslo do with the xhttprequest .
example of ajax call:
$.ajax({
url : url, //URL
type : 'POST', // The HTTP Method
data : array,
contentType : 'application/json',
cache : false,
success : function (data) {
},
error : function (err) {
});
In this you can also add the Headers where u can your api access token
I am currently in the process of implementing a server-side OAuth2 flow in order to authorize my application.
The JS application will be displaying YouTube Analytics data on behalf of a registered CMS account to an end user (who own's a channel partnered with the CMS account). As a result of this, the authorization stage needs to be completely hidden from the user. I am attempting to authorize once, then use the 'permanent' authorization code to retrieve access tokens as and when they're needed.
I am able to successfully authorize, and retrieve an access code. The problem begins when i attempt to exchange the access code for a token.
The HTTP POST Request to achieve this needs to look like this...
POST /o/oauth2/token HTTP/1.1
Host: accounts.google.com
Content-Type: application/x-www-form-urlencoded
code=4/P7q7W91a-oMsCeLvIaQm6bTrgtp7&
client_id=8819981768.apps.googleusercontent.com&
client_secret={client_secret}&
redirect_uri=https://oauth2-login-demo.appspot.com/code&
grant_type=authorization_code
I am using this code to achieve this:
var myPOSTRequest = new XMLHttpRequest();
myPOSTRequest.open('POST', 'https://accounts.google.com/o/oauth2/token', true);
myPOSTRequest.setRequestHeader('content-type', 'application/x-www-form-urlencoded');
myPOSTRequest.send('code=' + myAuthCode + '&redirect_uri=http%3A%2F%2Flocalhost%2FCMSAuth3.html&client_id=626544306690-kn5m3vu0dcgb17au6m6pmr4giluf1cle.apps.googleusercontent.com&scope=&client_secret={my_client_secret}&grant_type=authorization_code');
I can successfully get a 200 OK response to this Request however no access token is returned, and myPOSTRequest.responseText returns an empty string.
I have played with Google's OAuth Playground - and can successfully get a token using my own credentials.
Am i missing something here?
You cannot do this, because there is the same origin policy. This is a security concept of modern browsers, which prevents javascript to get responses from another origin, than your site. This is an important concept, because it gives you the ability, to protect you against CSRF. So don't use the code authorization flow, use instead the token authorization flow.
Try and build up the full URL. Then dump it in a webbrowser. If its corect you will get the json back. You have the corect format.
https://accounts.google.com/o/oauth2/token?code=<myAuthCode>&redirect_uri=<FromGoogleAPIS>&client_id=<clientID>&client_secret={my_client_secret}&grant_type=authorization_code
Other things to check:
Make sure that you are using the same redirect_uri that is set up in google apis.
How are you getting the Authcode back? If you are riping it from the title of the page i have had issues with it not returning the full authcode in the title try checking the body of the page. This doesnt happen all the time. I just ocationally.
I'm trying to post on an Event wall on a user's behalf. I have the publish_stream permission but am having trouble making a post request.
This doesn't work:
$http.post("#{url}/#{id}/feed", {message: message, access_token: token})
But these do:
1)
$http.get("#{url}/#{id}/feed?method=POST&message=#{message}&access_token=#{token}")
2)
$http.post "#{url}/#{id}/feed?access_token=#{token}&message=#{message}"
Any idea why the Facebook API would accept the latter but reject the post method (like the API requires)? The error I get with the $http.post is "this method requires an access_token"
I have limited idea about Facebook API but it seems that post method on $http is designed to send the data in the request body, whereas access token i think needs to be provided in querystring. post method would to parameter mapping for the url if the you provide it gets the same name token as here
$http.post("#{url}/#{id}/feed?access_token=#{token}&message=#{message}", {message: message, access_token: token})