wip fix google oauth2 signing

Author: Brian Caffey

.env.template

@@ -10,8 +10,8 @@ RDS_PORT=5432
 GITHUB_KEY=yourkey
 GITHUB_SECRET=yoursecret
 
-GOOGLE_KEY=12345-abcde.apps.googleusercontent.com
-GOOGLE_SECRET=abcde-fghij
+GOOGLE_OAUTH2_KEY=12345-abcde.apps.googleusercontent.com
+GOOGLE_OAUTH2_SECRET=abcde-fghij
 
 CELERY_BROKER_URL=redis://redis:6379
 CELERY_RESULT_BACKEND=redis://redis:6379

backend/accounts/utils/social/oauth.py

@@ -6,26 +6,46 @@
 import requests
 
 
-def get_access_token_from_code(backend, code):
-    """Get access token for any OAuth backend from code"""
+def get_payload(backend, code):
+
 
     key = f"{backend.upper()}_KEY"
     secret = f"{backend.upper()}_SECRET"
 
     client_id = os.environ.get(key, "nokey")
     client_secret = os.environ.get(secret, "nosecret")
 
-    url = c.OAUTH[backend]['url']
 
-    payload = {
+    if backend == 'github':
+        payload = {
+        'code': code,
+        'client_id': client_id,
+        'client_secret': client_secret,
+    }
+
+    elif backend == 'google_oauth2':
+        payload = {
         'code': code,
         'client_id': client_id,
         'client_secret': client_secret,
+        'redirect_uri': "http://localhost/auth/google/callback",
+        'grant_type': "authorization_code"
     }
 
+    return payload
+
+
+def get_access_token_from_code(backend, code):
+    """Get access token for any OAuth backend from code"""
+
+    url = c.OAUTH[backend]['url']
+
+    payload = get_payload(backend, code)
+
     r = requests.post(url, data=payload)
 
     # TODO: cleanup logic
     url = "http://example.com?" + str(r.content)
     params = dict(parse.parse_qsl(parse.urlsplit(url).query))
+
     return params["b'access_token"]

backend/backend/settings/base.py

@@ -67,13 +67,14 @@
 
 AUTHENTICATION_BACKENDS = (
     'social_core.backends.github.GithubOAuth2',
+    'social_core.backends.google.GoogleOAuth2',
     'django.contrib.auth.backends.ModelBackend',
 )
 
 for key in ['GITHUB_KEY',
             'GITHUB_SECRET',
-            # 'FACEBOOK_KEY',
-            # 'FACEBOOK_SECRET'
+            'GOOGLE_OAUTH2_KEY',
+            'GOOGLE_OAUTH2_SECRET'
             ]:
     # Use exec instead of eval here because we're not
     # just trying to evaluate a dynamic value here;

backend/core/constants.py

@@ -1,7 +1,13 @@
+# https://developer.github.com/apps/building-oauth-apps/authorizing-oauth-apps/#web-application-flow
 # https://developers.google.com/identity/protocols/OpenIDConnect
 
 OAUTH = {
     'github': {
+        'name': 'github',
         'url':'https://github.com/login/oauth/access_token'
+    },
+    'google': {
+        'name': 'google_oauth2',
+        'url':'https://oauth2.googleapis.com/token'
     }
-}
+}

docker-compose.yml

@@ -70,7 +70,7 @@ services:
     environment:
       - CHOKIDAR_USEPOLLING=true
       - GITHUB_KEY=${GITHUB_KEY}
-      - GOOGLE_KEY=${GOOGLE_KEY}
+      - GOOGLE_OAUTH2_KEY=${GOOGLE_OAUTH2_KEY}
       - HTTP_PROTOCOL=http
       - WS_PROTOCOL=ws
       - DOMAIN_NAME=${DOMAIN_NAME}
@@ -103,8 +103,8 @@ services:
       - DJANGO_SETTINGS_MODULE=backend.settings.development
       - GITHUB_KEY=${GITHUB_KEY}
       - GITHUB_SECRET=${GITHUB_SECRET}
-      - GOOGLE_KEY=${GOOGLE_KEY}
-      - GOOGLE_SECRET=${GOOGLE_SECRET}
+      - GOOGLE_OAUTH2_KEY=${GOOGLE_OAUTH2_KEY}
+      - GOOGLE_OAUTH2_SECRET=${GOOGLE_OAUTH2_SECRET}
     depends_on:
       - db
 

quasar/quasar.conf.js

@@ -65,7 +65,7 @@ module.exports = function(ctx) {
               }/ws/ping-pong/`
             ),
             GITHUB_KEY: JSON.stringify(process.env.GITHUB_KEY),
-            GOOGLE_KEY: JSON.stringify(process.env.GOOGLE_KEY)
+            GOOGLE_OAUTH2_KEY: JSON.stringify(process.env.GOOGLE_OAUTH2_KEY)
           }
         : {
             API_URL: JSON.stringify(
@@ -77,7 +77,7 @@ module.exports = function(ctx) {
               }/ws/ping-pong/`
             ),
             GITHUB_KEY: JSON.stringify(process.env.GITHUB_KEY),
-            GOOGLE_KEY: JSON.stringify(process.env.GOOGLE_KEY)
+            GOOGLE_OAUTH2_KEY: JSON.stringify(process.env.GOOGLE_OAUTH2_KEY)
           },
       scopeHoisting: true,
       useNotifier: false,

quasar/src/components/AuthModal.vue

@@ -50,11 +50,17 @@
             <div class="text-h6">TODO</div>
             Implement Sign up with Email + Email Verification
             <q-btn
-              :href="githuboath2link"
+              :href="$store.getters.oauthUrl('github')"
               type="a"
               class="full-width q-mt-md"
               label="Sign Up with GitHub"
             />
+            <q-btn
+              :href="$store.getters.oauthUrl('google')"
+              type="a"
+              class="full-width q-mt-md"
+              label="Sign Up with Google"
+            />
           </q-tab-panel>
         </q-tab-panels>
       </q-card>

quasar/src/store/index.js

@@ -3,6 +3,7 @@ import Vuex from "vuex";
 import ui from "./ui";
 import auth from "./auth.js";
 import user from "./user.js";
+import social from "./social";
 
 // import example from './module-example'
 
@@ -17,7 +18,8 @@ export default new Vuex.Store({
   modules: {
     ui,
     auth,
-    user
+    user,
+    social
   },
 
   // enable strict mode (adds overhead!)

quasar/src/store/social.js

@@ -1,3 +1,4 @@
+import buildURL from "axios/lib/helpers/buildURL";
 import oauth from "../utils/oauth";
 
 const state = {
@@ -6,10 +7,13 @@ const state = {
 
 const getters = {
   oauthUrl: () => {
-    return provider => state.oauth[provider].sender;
-  },
-  getProfile: s => s.status,
-  getUrl: s => s.status
+    return provider => {
+      const url = state.oauth[provider].url;
+      const params = state.oauth[provider].params;
+
+      return buildURL(url, params);
+    };
+  }
 };
 
 const actions = {};

quasar/src/utils/oauth.js

@@ -1,17 +1,27 @@
-const protocol = process.env.NODE_ENV === "production" ? "https://" : "http://";
-const url = process.env.SITE_URL;
-const baseUrl = protocol + url;
+const url = process.env.API_URL;
 
 const oauth = {
   github: {
-    url: "https://github.com/oauth",
+    url: "https://github.com/login/oauth/authorize",
     params: {
       client_id: process.env.GITHUB_KEY,
-      redirect_uri: `${baseUrl}/auth/github/callback`,
+      redirect_uri: `${url}/auth/github/callback`,
       login: "",
       scope: "user",
       state: "eworifjeovivoiej"
     }
+  },
+  google: {
+    url: "https://accounts.google.com/o/oauth2/v2/auth",
+    params: {
+      client_id: process.env.GOOGLE_OAUTH2_KEY,
+      response_type: "code",
+      scope: "openid email",
+      redirect_uri: `${url}/auth/google/callback`,
+      state: "eworifjeovivoiej",
+      nonce: "forewijf43oirjoifj",
+      login_hint: ""
+    }
   }
 };