Website with Facebook OAuth

Arthur Lee
3 min readAug 18, 2018

--

In order to remember the detail to use Facebook OAuth

I decide to write the blog

go to facebook.com/apps and click Add a New App

remember your App ID, App secret

setting -> Basic -> Add platform (Website)

input Site URL:

click Setting -> Advanced -> Native or Desktop app? (YES)

click Setting -> Basic -> App domain type: https://localhost:3443

change the index.html code: to your appId

install the npm (option+ command + 6)

npm install passport-facebook-token — save

Updating config.js

  • Update config.js with the App ID and App Secret that you obtained earlier as follows:

Updating User Model

  • Open user.js from the models folder and update the User schema as follows:

Setting up Facebook Authentication

  • Open authenticate.js and add in the following line to add Facebook strategy:
var FacebookTokenStrategy = require('passport-facebook-token');

and implement the function:

Updating users.js

  • Open users.js in routers and add the following code to it:
  • Start the server and test the application.
  • In a browser, open https://localhost:3443/ to open the index.html file. Then click on the Facebook Login button to log into Facebook. At the end of the login process, open your browser’s JavaScript console and then obtain the Access Token from there.
  • Then you can use the access token to contact the server at https://localhost:3443/users/facebook/token and pass in the token using the Authorization header with the value as Bearer <Access Token> to obtain the JWT token from the server.

There are 3 ways:

  • one is using Authorization and with Bearer and one space + token
  • the other one is using access_token and only token
  • ..token?access_token=`token`

--

--

Arthur Lee
Arthur Lee

Written by Arthur Lee

An machine learning engineer in Bay Area in the United States

No responses yet