Connect Github using OAuth in javascript

Question

Is it possible to connect with Github using oAuth in JAVASCRIPT/AJAX/JQuery

I have came across with its implementation in php and node.js, but i need to have it in js. Is it possible. Any links?

As per http://developer.github.com/v3/oauth/ , i'm not able to implement it in js.

Here is the link for implementation in php, please help me out to implement the same in js/ajax/jquery.

Thanks

Answer 1

I was just searching for the same issue myself and apparently it is not possible. what you requested is referred to as Implicit grant and the link you provided for Github api states that:

The implicit grant type is not supported

You can still access it using cors or jsonp which are both mentioned as methods to use Github api (json-p, cors) but unless you are authenticated the rate limit is bounded to 60 requests per hour https://developer.github.com/v3/#rate-limiting

Edit:

So I did some further reading, if you want to use their api with a web browser script you can create yourself a Personal Access Token, and define it's scope as no scope. This will make sure it will have only read access to your public information. Thus you could use this token without fearing having it published publicly in a website and someone abusing it.

Answer 2

If you really want to use 'Javascript-only to connect to Github, or any other OAuth provider that does not support OAuth2 'implicit' grant type/flow, and you do not mind using an OAuth-based web service, which greatly simplifies everything to a < 10 lines, you can try to use OAuth.io (https://oauth.io).

OAuth.io provides an open-source Javascript library: https://cdn.rawgit.com/oauth-io/oauth-js/c5af4519/dist/oauth.js. The library communicates with the OAuth.io server, which is configured with your Github (OAuth server) client id/client secret, so it acts as a intermediary between your browser, and Github (or any OAuth provider), making it capable of completing the OAuth2 'authorization code' grant type/flow.

The code then is as simple as:

  OAuth.popup('github').then(github => {
    console.log('github:', github);
    // You can use the github object to 
    // perform any HTTP get/post to Github API endpoints
    github.get('/user').then(data => {
      console.log('self data:', data);
    })
  });

Reference: https://coderwall.com/p/sjbwcq/javascript-github-social-login-button-for-oauth

Answer 3

No, for security reasons you cannot login with client-side code only. This is to protect the client-secret code.

You can create a simple server-side app that protects your codes. For example, have a look at https://github.com/prose/gatekeeper

Answer 4

I ran into the same issue and made a Netlify Function to handle the backend so it would be serverless.

Here's the repo: https://github.com/cadbox1/github-oktokit-oauth-netlify