diff --git a/examples/facebook_profile_picture/README.md b/examples/facebook_profile_picture/README.md new file mode 100644 index 00000000..04bc2083 --- /dev/null +++ b/examples/facebook_profile_picture/README.md @@ -0,0 +1,25 @@ +Facebook Profile Picture Example +-------------------------------- + +This example demonstrates how to retrieve the Facebook profile +picture when logging in with the Facebook OAuth provider. + +## Before you begin + +1. Create a Stormpath Account and set your environment variables. To learn more, [follow the 'Setup' steps in our docs.](https://docs.stormpath.com/nodejs/express/latest/setup.html) +2. Set up Facebook Social Auth with Stormpath. To learn more, [see our 'Facebook Login' docs.](https://docs.stormpath.com/nodejs/express/latest/social_login.html#facebook-login) + +## Install + +Simply install all dependencies by executing `$ npm install`. + +## Usage + +1. Start the application by running `$ node app.js`. +2. Open up your browser and navigate to [http://localhost:3000/login](http://localhost:3000/login). +3. Click the Facebook-button to login with your Facebook credentials. +4. You should now see the text `Facebook profile picture of account '(Stormpath account href)' is '(Facebook profile picture URL)'.` in your console. + +## Next steps + +Now that you have the account's href and a profile picture URL, you can [save it to custom data](https://docs.stormpath.com/nodejs/express/latest/user_data.html), embed the image on one of your pages, etc. diff --git a/examples/facebook_profile_picture/app.js b/examples/facebook_profile_picture/app.js new file mode 100644 index 00000000..b2f0d9da --- /dev/null +++ b/examples/facebook_profile_picture/app.js @@ -0,0 +1,53 @@ +var fbgraph = require('fbgraph'); +var express = require('express'); +var stormpath = require('express-stormpath'); + +var app = express(); + +function getFacebookPicture(accessToken, size, callback) { + if (!size) { + size = 'normal'; + } + + var requestOptions = { + access_token: accessToken + }; + + fbgraph.get('/me/picture?type=' + size, requestOptions, callback); +} + +app.use(stormpath.init(app, { + debug: 'info', + postLoginHandler: function (account, req, res, next) { + account.getProviderData(function (err, providerData) { + if (err) { + return next(err); + } + + if (providerData.providerId === 'facebook') { + return getFacebookPicture(providerData.accessToken, 'normal', function (err, profilePicture) { + if (err) { + return next(err); + } + + // E.g. save profilePicture.location to database. + console.log('Facebook profile picture of account \'%s\' is \'%s\'.', account.href, profilePicture.location); + + next(); + }); + } + + next(); + }); + } +})); + +app.on('error', function (err) { + console.error('An error occurred!', err); +}); + +app.on('stormpath.ready', function (err) { + app.listen(3000, function () { + console.log('Listening on http://localhost:3000/'); + }); +}); \ No newline at end of file diff --git a/examples/facebook_profile_picture/package.json b/examples/facebook_profile_picture/package.json new file mode 100644 index 00000000..0987a989 --- /dev/null +++ b/examples/facebook_profile_picture/package.json @@ -0,0 +1,7 @@ +{ + "dependencies": { + "express": "^4.14.0", + "express-stormpath": "^3.1.5", + "fbgraph": "^1.3.0" + } +}