tonyxu-io / react-linkedin-login Goto Github PK

View Code? Open in Web Editor NEW

80.0 4.0 27.0 26.5 MB

A React demo app for Linkedin API: LinkedIn OAuth, LinkedIn REST API

Home Page: https://tonyxu-linkedin-react-app.azurewebsites.net/

License: MIT License

HTML 9.47% CSS 8.70% JavaScript 77.41% EJS 4.42%

linkedin-api react linkedin-sdk expressjs linkedin

react-linkedin-login's Introduction

React Linkedin Login

Caution

This repo has been archived since the login API used by this repo has been deprecated. https://www.linkedin.com/developers/news/featured-updates/openid-connect-authentication

A simple app to demo LinkedIn login using LinkedIn OAuth 2.0

Screenshot

Demo

https://tony-linkedin-login.azurewebsites.net/

Usage

Clone

git clone https://github.com/tonyxu-io/React-Linkedin-Login.git

Install Dependencies

Install dependencies for server

cd React-Linkedin-Login
npm install

Install dependencies for client

cd client
npm install

Get LinkedIn App Credential from LinkedIn Developer Portal

client_id
client_secret

Configure 'http://localhost:3001/callback' as Oauth2.0 redirect uri

Create Environment Variables

/React-Linkedin-Login/.env

EXPRESS_APP_CLIENT_ID=${Your-Client-ID}
EXPRESS_APP_CLIENT_SECRET=${Your-Client-Secret}
EXPRESS_APP_REDIRECT_URI=http://localhost:3001/callback

/React-Linkedin-Login/client/.env

REACT_APP_CLIENT_ID=${Your-Client-ID}
REACT_APP_REDIRECT_URI=http://localhost:3001/callback

Build Client

/React-Linkedin-Login/client:

yarn run build

Start Server

/React-Linkedin-Login/:

PORT=3001 npm start

Visit http://localhost:3001/ in your browser.

Consumed SDK/API

Changelog

Mar 1, 2020: Migrated hosting platform from GAE to Azure, and CI/CD platform from Travis CI to GitHub Actions
Jan 20, 2019: Migrated JS SDK related API usage (due to deprecation of LinkedIn JS SDK) to REST API
Aug 1, 2018: Removed summary check in case user doesn't have summary content
April 2, 2018: Created first version using JS SDK to load profile

Disclaimer

This is not an official sample app or documentation from LinkedIn. Please refer to LinkedIn API Documentation for official documentation and sample apps.

react-linkedin-login's People

Contributors

Stargazers

Watchers

react-linkedin-login's Issues

demo doesn't work

shows this error The redirect_uri does not match the registered value

"Bad request" error

When clicking on the "Allow" button in the authorization popup, the popup gets blank and "bad request error" is displayed . This occurred in the demo site.

Auth error

Hi,

I am getting authentication error while using the app. Ami missing something. Secreenshot added below

Very hard bug to find

I was reciving "Bad request" everytime I wanted to get /accessToken, without any error message whatsoever from linkedIn api.

The reason: the redirect_uri was different for authorization and for access token.
Reason for that: I've set my custom URL in .env for redirect_api, but because of the "proxy": "localhost:3001" in package.json it was still taken into account.

So my idea is:

Don't suggest using .env, for custom hosts
Remove "proxy" entry from package.json

Because you can't use both anyway :D

Const redirect_url = "http://localhost:3000/callback"
var oauthUrl = `https://www.linkedin.com/oauth/v2/authorization?response_type=code&client_id=${client_id}&scope=r_liteprofile&state=123456&redirect_uri=${redirect_url}`