Facebook feed on website using javascript. Is it secure? - javascript

I have a client who would like the most recent post displayed on their site (along with like and comment counts) plus a link to the actual post. Their page is public, so I can view it in a browser without being logged in. Let's just say it's Nike.
http://www.facebook.com/nike (public)
http://graph.facebook.com/nike/feed (wait, i need to authenticate to see this?)
I went through the trouble of setting up a dummy app on a dummy account, got an access_token an was able to pull what I needed using javascript(Jquery). The reason I'm doing it this way is because the client has sensitive data and other apps/sites on this server and does not want to involve their IT department to QA my code.
Before final handoff, they'll likely set up their own facebook app on their account. This would significantly raise the stakes if someone decided they wanted to play with that access_token.
I'm mostly a front-end guy who's done some small php sites/apps, so what would you recommend I do?
Thanks for your time!

I don't know about facebook in particular, but typically if you want to protect api access credentials you would proxy the request through your server, and just send the results to the client (so the access key only exists on the server). Alternately, and I'm not sure that facebook provides this, some APIs will give you a user token, which does not expose your access key, but allows the client to call the api.

Related

Accessing private Google Drive data without OAuth2 redirection/copy and pasting

I'm making an open source Node module that will require access to each user's private Google Drive files. I've been trying to wrap my head around all of these different authentication types, and have come to a road block. From what I've gathered, there are two primary types of authentication
I, the library author, provide in my library the public and private keys necessary to authenticate each user with OAuth2. This means giving them a URL to go to to give my app permission to access their data, and have them copy and paste an access code back into their terminal. I was able to run through this tutorial and get it working, but this method seems dangerous, because of the keys I have to package with my library, and unnecessarily difficult.
Have the user go to the Google API console, get their own API key, and provide that to my library through some sort of configuration file. No URL redirection, no copying and pasting, just some private credentials that only they have access to.
2 sounds a lot better to me: This library has absolutely nothing to do with me once it's in the user's hands, so it feels incorrect to have them authenticate with me. But from what I can find, the only way to do this with Google's API is to create a Google Service account, download the JSON they give you, go through a flow similar to the top comment on this blog post, and then manually give the service account email access to my personal Google Drive files. This seems hacky, and a lot of work to gain access to my own private data. Is there a better way to go about this? It seems strange to me that this fairly standard flow in other APIs is only available in Google's API through service accounts, but maybe there is a way and I'm just not seeing it. I'm fairly new to authentication, so any help at all is appreciated. Thanks!
First off I want to say that you cant release your open source project with the client id and client secrete that you created on Google Developers console this is against googles terms of service.
1.Developer credentials (such as passwords, keys, and client IDs) are intended to be used by you and identify your API Client. You will keep
your credentials confidential and make reasonable efforts to prevent
and discourage other API Clients from using your credentials.
Developer credentials may not be embedded in open source projects.
My Answer on another question about exposing client id in open source projects.
Second you could instruct your users to use either Oauth2 or a service account or both its really up to you.
If the user will only be accessing their own data and wont need to access someone else's data then they can use a service account you will need to instruct them in how to share a folder on Google Drive with the service account. However from your side permissions can be tricky when they are uploaded the service account will own the file uploaded to the users google drive account you will need to have the service account add permissions for the user so the user will then also be able to access said file.
The easiest way to go will be Oauth2 when the code uploads files they are owned by the authenticated user so you wont have the same permissions issue you had with a service account.

Security risk when exposing Facebook access_token?

I'm pulling a list of Facebook albums from a page using a GET url like so:
https://graph.facebook.com/<page-id>/albums?access_token=<app-id>|<app-secret>
Even though the page is public, apparently you have to provide an access_token to pull content. So, my question is, is this a huge security vulnerability by publicly displaying the app ID and the secret key in the browser? I'm using JavaScript, so I'm afraid that someone could just grab the app ID and the secret key and then use it to post spam to the account. Is that possible? Or am I forgetting about another security step that has to be taken in order to actually write using the API?
You should never expose tokens (that are not the user’s very own access token) in client-side code. Everyone can read them from there, and abuse them. The app access token allows a lot of app settings to be changed, and performing of other actions in the name of the app as well.
You need to either make viewing the user login to your app, so that you can use their personal access token; or you need to move this code to the server side.

Is it possible to show blog view counter with information Google Analytics

I have a static blog using Jekyll hosted on GitHub. I have set up Google Analytics for it and works well enough.
Now I want to show how many people viewed each post in my blog. I found Google Analytics JavaScript API to get the information. But it seems that this API uses OAuth for data access. So I think this might not be the API I needed.
Is it possible to do so with Google Analytics? I don't have any server since it's hosted on GitHub.
I finally solved this problem by Google Analytics superProxy as suggested in the comment of #EikePierstorff.
I wrote a blog on it.
Here's the main idea.
I first build a project on Google App Engile, with which I authenticate for the access of my Google Analytics. Then a URL of query (which can be pageview of certain pages) is generated in JSON format. I can set the refresh rate on this GAE project so that the JSON file can be updated from Google Analytic.
Sounds almost perfect to me. Thank you all guys for help!
You can't query the Google Analytics API without authorization by someone, that's the most important thing to remember.
It's certainly possible to display Google Analytics data on your website to users who don't have access to your account, but in order to do that, someone with access to the account needs to authorize and get an access token in order to run queries.
Normally this is done server side, and once you have a valid access token you can query the API client side (to display charts and graph, etc.). Access tokens are typically valid for 1 hour, so if you want to have your website up all the time, you'll also have to deal with refreshing the access token once it expires.
Now, since you're using Github Pages and don't have a back end, which means all the authorization will need to happen client side. While it's technically possible to do the same thing client side as server side, it's generally not a good idea because private data like your client secret, refresh token, etc. will be visible in the source code.
Applications that do auth client side typically don't authorize on behalf of a user. They require the users themselves to go through an auth flow for security reasons (as I just explained), but that would mean those users 1) have to log in, and 2) can only see the analytics data they have access to, which probably isn't what you want.
--
What you can do is run reports periodically yourself and export that data to a Google Spreadsheet. Google Spreadsheets allow you to embed charts and graphs of data as an <iframe> in external pages, so that might be an option.
At the end of the day, if you can't authorize server side you'll have to come up with some kind of workaround to make this happen.
Here are a few possibly helpful links that might point you in the right direction:
https://developers.google.com/analytics/solutions/google-analytics-spreadsheet-add-on
https://developers.google.com/analytics/devguides/reporting/embed
https://developers.google.com/analytics/solutions/report-automation-magic

SINGLE SIGN ON SECURITY THREAT! FACEBOOK access_token broadcast in the open/clear

02/20/2011:
It was confirmed by Facebook today that indeed there is one call in which the access_token is broadcast in the open . . . it just happens to be one call I use to make sure that the USER is still logged in before saving to my application database. Their recommendation was to use the SSL option provided as of last month for canvase and facebook as a whole. For the most part the Auth and Auth are secure.
Findings:
Subsequent to my posting there was a remark made that this was not really a question but I thought I did indeed postulate one. So that there is no ambiquity here is the question with a lead in:
Since there is no data sent from Facebook during the Canvas Load process that is not at some point divulged, including the access_token, session and other data that could uniquely identify a user, does any one see any other way other than adding one more layer, i.e., a password, sent over the wire via HTTPS along with the access_toekn, that will insure unique untampered with security by the user?
Using Wireshark I captured the local broadcast while loading my Canvas Application page. I was hugely surprised to see the access_token broadcast in the open, viewable for any one to see. This access_token is appended to any https call to the Facebook OpenGraph API.
Using facebook as a single click log on has now raised huge concerns for me. It is stored in a session object in memory and the cookie is cleared upon app termination and after reviewing the FB.Init calls I saw a lot of HTTPS calls so I assumed the access_token was always encrypted.
But last night I saw in the status bar a call from what was simply an http call that included the App ID so I felt I should sniff the Application Canvas load sequence.
Today I did sniff the broadcast and in the attached image you can see that there are http calls with the access_token being broadcast in the open and clear for anyone to gain access to.
Am I missing something, is what I am seeing and my interpretation really correct. If any one can sniff and get the access_token they can theorically make calls to the Graph API via https, even though the call back would still need to be the site established in Facebook's application set up.
But what is truly a security threat is anyone using the access_token for access to their own site. I do not see the value of a single sign on via Facebook if the only thing that was established as secure was the access_token - becuase for what I can see it clearly is not secure. Access tokens that never have an expire date do not change. Access_tokens are different for every user, to access to another site could be held tight to just a single user, but compromising even a single user's data is unacceptable.
http://www.creatingstory.com/images/InTheOpen.png
Went back and did more research on this:
FINDINGS:
Went back an re ran the canvas application to verify that it was not any of my code that was not broadcasting.
In this call: HTTP GET /connect.php/en_US/js/CacheData HTTP/1.1
The USER ID is clearly visible in the cookie. So USER_ID's are fully visible, but they are already. Anyone can go to pretty much any ones page and hover over the image and see the USER ID. So no big threat. APP_ID are also easily obtainable - but . . .
http://www.creatingstory.com/images/InTheOpen2.png
The above file clearly shows the FULL ACCESS TOKEN clearly in the OPEN via a Facebook initiated call.
Am I wrong. TELL ME I AM WRONG because I want to be wrong about this.
I have since reset my app secret so I am showing the real sniff of the Canvas Page being loaded.
Additional data 02/20/2011:
#ifaour - I appreciate the time you took to compile your response.
I am pretty familiar with the OAuth process and have a pretty solid understanding of the signed_request unpacking and utilization of the access_token. I perform a substantial amount of my processing on the server and my Facebook server side flows are all complete and function without any flaw that I know of. The application secret is secure and never passed to the front end application and is also changed regularly. I am being as fanatical about security as I can be, knowing there is so much I don’t know that could come back and bite me.
Two huge access_token issues:
The issues concern the possible utilization of the access_token from the USER AGENT (browser). During the FB.INIT() process of the Facebook JavaScript SDK, a cookie is created as well as an object in memory called a session object. This object, along with the cookie contain the access_token, session, a secret, and uid and status of the connection. The session object is structured such that is supports both the new OAuth and the legacy flows. With OAuth, the access_token and status are pretty much al that is used in the session object.
The first issue is that the access_token is used to make HTTPS calls to the GRAPH API. If you had the access_token, you could do this from any browser:
https://graph.facebook.com/220439?access_token=...
and it will return a ton of information about the user. So any one with the access token can gain access to a Facebook account. You can also make additional calls to any info the user has granted access to the application tied to the access_token. At first I thought that a call into the GRAPH had to have a Callback to the URL established in the App Setup, but I tested it as mentioned below and it will return info back right into the browser. Adding that callback feature would be a good idea I think, tightens things up a bit.
The second issue is utilization of some unique private secured data that identifies the user to the third party data base, i.e., like in my case, I would use a single sign on to populate user information into my database using this unique secured data item (i.e., access_token which contains the APP ID, the USER ID, and a hashed with secret sequence). None of this is a problem on the server side. You get a signed_request, you unpack it with secret, make HTTPS calls, get HTTPS responses back. When a user has information entered via the USER AGENT(browser) that must be stored via a POST, this unique secured data element would be sent via HTTPS such that they are validated prior to data base insertion.
However, If there is NO secured piece of unique data that is supplied via the single sign on process, then there is no way to guarantee unauthorized access. The access_token is the one piece of data that is utilized by Facebook to make the HTTPS calls into the GRAPH API. it is considered unique in regards to BOTH the USER and the APPLICATION and is initially secure via the signed_request packaging. If however, it is subsequently transmitted in the clear and if I can sniff the wire and obtain the access_token, then I can pretend to be the application and gain the information they have authorized the application to see. I tried the above example from a Safari and IE browser and it returned all of my information to me in the browser.
In conclusion, the access_token is part of the signed_request and that is how the application initially obtains it. After OAuth authentication and authorization, i.e., the USER has logged into Facebook and then runs your app, the access_token is stored as mentioned above and I have sniffed it such that I see it stored in a Cookie that is transmitted over the wire, resulting in there being NO UNIQUE SECURED IDENTIFIABLE piece of information that can be used to support interaction with the database, or in other words, unless there were one more piece of secure data sent along with the access_token to my database, i.e., a password, I would not be able to discern if it is a legitimate call. Luckily I utilized secure AJAX via POST and the call has to come from the same domain, but I am sure there is a way to hijack that.
I am totally open to any ideas on this topic on how to uniquely identify my USERS other than adding another layer (password) via this single sign on process or if someone would just share with me that I read and analyzed my data incorrectly and that the access_token is always secure over the wire.
Mahalo nui loa in advance.
I am not terribly familiar with Facebook's authentication/authorization methods, but I do believe that they implement oauth (or something close to it) for delegation, distributed authorization, and "single sign-on".
OAuth is described by RFC-5849
EDIT: Facebook Uses OAuth 2.0 which is still in working draft.
In OAuth, and similar systems, the "access_token" is only part of the picture. There is also typically a secret key, which is known only by the service provider (facebook) and the client application (your app). The secret key is the only part that is expected to stay secret - and that part is never sent over the wire (after it's initial issuance).
In the case of Facebook, I think the secret key is assigned to you when you register your application to use their API, and the 'access_token' is returned to you for a given user, whenever the user agrees to allow your app to access their info.
Messages are sent in the clear, including the user's username, and the relevant "access_token"; However, each message must also include a valid signature in order to be accepted by the server. The signature is a cryptographically computed string, that is created using a technique called HMAC.
Computing the HMAC signature requires both the token and the secret, and includes other key parts of the message as well. Each signature is unique for the given message contents; and each message uses a nonce to ensure that no two messages can ever be exactly identical.
When the server receives a signed message, it starts by extracting the access_token (clear-text), and determining which app the token was issued for. It then retrieves the matching secret from its own local database (the secret is not contained in the message). Finally, the server uses the clear-text message, the clear-text access_token, and the secret to compute the expected HMAC signature for the message. If the computed signature matches the signature on the received message, then the message must have been sent by someone who knows the same secret (i.e. your application).
Have a look at Section 3.1 of RFC-5849 for an OAuth specific example, and further elaboration on the details.
Incidentally, the same approach is used by Amazon to control access to S3 and EC2, as well as most other service providers that offer API access with long-term authorization. Suffice it to say - this approach is secure. It might be a little counter-intuitive at first, but it makes sense once you think it through.
Adding a few links and quotes from Facebook Documentation:
Facebook is indeed using the HMAC-SHA256 algorithm. Registration document (PHP Example reading signed_request section).
Always verify the signed_request:
If you are unable to validate the
signed_request because you can't embed
your application secret (e.g. in
javascript or a desktop application)
then you MUST only use one piece of
information from the payload, the
oauth_token.
The Authentication Document contains a lot of useful info about the different flows you may use to authenticate a user. Also read the Security Considerations section at the bottom of the page:
Cross site request forgery is an
attack in which an trusted
(authenticated and authorized) user
unknowingly performs an action on
website. To prevent this attack, you
should pass an identifier in the state
parameter, and then validate the state
parameter matches on the response. We
strongly recommend that any app
implementing Facebook user login
implement CSRF protection using this
mechanism.
It was confirmed by Facebook that indeed there is one call in which the access_token is broadcast in the open - it just happens to be one call I use to make sure that the user is still logged in before saving to my application database. Their recommendation was to use the SSL option provided as of last month for canvas and Facebook as a whole. For the most part the Auth and Auth are secure.
To ensure a secure interface between a third party application and a Facebook application or even any website that uses Facebook Single Sign on, an identity question would provide the extra layer when used in conjunction with the access_token.
Either that or require your users to use Facebook with the new SSL feature of Facebook and Facebook Canvas Applications. If the access_token is broadcast in the open it cannot be used to uniquely identify anyone in your third party database when needing to have a confirmed identity before database interactions.

Facebook Connect help

According to the Facebook API documentation, most of the work is handled through javascript.
That means that all the processing is done, and then the front end checks if the user is connected to Facebook/authorized. right?
My question is:
Suppose a user goes to my site for the first time ever.
He clicks on "facebook connect". The javascript verifies him as authentic, and it "redirects" to another page on my server. From then on, how do I know that the user is actually authenticated to my website, since everything is done on frontend?
I think this is correct, but aren't there some security issues..:
-After user clicks Login, Facebook redirects to a page on my site. AND they also create a cookie with a specific "Facebook ID" that is retrieved only from this user. My backened will "read" the cookie and grab that ID...and then associate it to my userID.
If that is correct...then it doesn't make sense. What if people steal other people's "facebook ID" and then forge the cookie? And then my backend sees the cookie and thinks it's the real user...?
Am I confused? If I am confused, please help me re-organize and tell me how it's like.
Facebook Connect uses a clever (or insane, depending on your point of view) hack to achieve cross-site communication between your site and Facebook's authentication system from within the browser.
The way it works is as follows:
Your site includes a very simple static HTML file, known as the cross-domain communications channel. This file is called xd_receiver.htm in the FB docs, but it can be named anything you like.
Your site's login page includes a reference to the Javascript library hosted on Facebook's server.
When a user logs in via the "Connect" button, it calls a function in Facebook's JS API which pops up a login dialog. This login box has an invisible iframe in which the cross-domain communications file is loaded.
The user fills out the form and submits it, posting the form to Facebook.
Facebook checks the login. If it's successful, it communicates this to your site. Here's where that cross-domain stuff comes in:
Because of cross-domain security policies, Facebook's login window can not inspect the DOM tree for documents hosted on your server. But the login window can update the src element of any iframe within it, and this is used to communicate with the cross-domain communications file hosted on your page.
When the cross-domain communications file receives a communication indicating that the login was successful, it uses Javascript to set some cookies containing the user's ID and session. Since this file lives on your server, those cookies have your domain and your backend can receive them.
Any further communication in Facebook's direction can be accomplished by inserting another nested iframe in the other iframe -- this second-level iframe lives on Facebook's server instead of yours.
The cookies are secure (in theory) because the data is signed with the secret key that Facebook generated for you when you signed up for the developer program. The JS library uses your public key (the "API key") to validate the cookies.
Theoretically, Facebook's Javascript library handles this all automatically once you've set everything up. In practice, I've found it doesn't always work exactly smoothly.
For a more detailed explanation of the mechanics of cross-domain communication using iframes, see this article from MSDN.
Please someone correct me if I'm wrong - as I am also trying to figure all this stuff out myself. My understanding with the security of the cookies is that there is also a cookie which is a special signature cookie. This cookie is created by combining the data of the other cookies, adding your application secret that only you and FB know, and the result MD5-Hashed. You can then test this hash server-side, which could not easily be duplicated by a hacker, to make sure the data can be trusted as coming from FB.
A more charming explaination can be found here - scroll about halfway down the page.
Same issues here, and I think Scott is closer to the solution.
Also Im using "http://developers.facebook.com/docs/?u=facebook.jslib-alpha.FB.init" there open source js framework. So things are a little different.
For me, via the opensource js framework, facebook provides and sets a session on my site with a signature. So what I am thinking is to recreate that signature on my side. - if they both match then the user is who he says he is.
So basically if a user wanted to save something to my database, grab the session signature set up by facebook and recreate that signature with php and validate it against the one facebook gave me?
if($_SESSION['facebookSignature'] == reGeneratedSignature){
// save to database
}else{
// go away I don't trust you
}
But how do you regenerate that signature? preferably without making more calls to Facebook?

Categories