From 10658b0d77b86f207e6ae0887ee1eb75fabd7e46 Mon Sep 17 00:00:00 2001 From: "Daniel J. Summers" Date: Mon, 7 Sep 2020 15:27:33 -0400 Subject: [PATCH] Auth and access codes work the first half of #1 --- src/jobs-jobs-jobs/.gitignore | 3 + src/jobs-jobs-jobs/package-lock.json | 5 ++ src/jobs-jobs-jobs/package.json | 8 +- src/jobs-jobs-jobs/src/App.vue | 32 ++++++-- src/jobs-jobs-jobs/src/auth/index.ts | 63 ++++++++++++++++ src/jobs-jobs-jobs/src/main.ts | 3 +- src/jobs-jobs-jobs/src/router/index.ts | 33 ++++++++ src/jobs-jobs-jobs/src/views/About.vue | 5 ++ src/jobs-jobs-jobs/src/views/Home.vue | 75 +++++++++++++++++++ .../src/views/user/Authorized.vue | 18 +++++ 10 files changed, 234 insertions(+), 11 deletions(-) create mode 100644 src/jobs-jobs-jobs/src/auth/index.ts create mode 100644 src/jobs-jobs-jobs/src/router/index.ts create mode 100644 src/jobs-jobs-jobs/src/views/About.vue create mode 100644 src/jobs-jobs-jobs/src/views/Home.vue create mode 100644 src/jobs-jobs-jobs/src/views/user/Authorized.vue diff --git a/src/jobs-jobs-jobs/.gitignore b/src/jobs-jobs-jobs/.gitignore index 403adbc..c33eee6 100644 --- a/src/jobs-jobs-jobs/.gitignore +++ b/src/jobs-jobs-jobs/.gitignore @@ -21,3 +21,6 @@ pnpm-debug.log* *.njsproj *.sln *.sw? + +dev-client.txt +src/auth/config.ts diff --git a/src/jobs-jobs-jobs/package-lock.json b/src/jobs-jobs-jobs/package-lock.json index 97671fe..c68fad2 100644 --- a/src/jobs-jobs-jobs/package-lock.json +++ b/src/jobs-jobs-jobs/package-lock.json @@ -11675,6 +11675,11 @@ } } }, + "vue-router": { + "version": "4.0.0-beta.9", + "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.0.0-beta.9.tgz", + "integrity": "sha512-k8AGMm3LCTqnsEuF37AD4kcZVMwtnFEzdjACgmIII/xbLnTj3+o5XyH/zREBZutgv5q2hzlLltMVglqDQYMd/A==" + }, "vue-style-loader": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz", diff --git a/src/jobs-jobs-jobs/package.json b/src/jobs-jobs-jobs/package.json index fdb69ed..1c45ea6 100644 --- a/src/jobs-jobs-jobs/package.json +++ b/src/jobs-jobs-jobs/package.json @@ -3,20 +3,22 @@ "version": "0.8.0", "private": true, "scripts": { - "serve": "vue-cli-service serve", - "build": "vue-cli-service build", + "serve": "vue-cli-service serve --port 3005", + "build": "vue-cli-service build --modern", "lint": "vue-cli-service lint" }, "dependencies": { "core-js": "^3.6.5", "vue": "^3.0.0-0", - "vue-class-component": "^8.0.0-0" + "vue-class-component": "^8.0.0-0", + "vue-router": "^4.0.0-0" }, "devDependencies": { "@typescript-eslint/eslint-plugin": "^2.33.0", "@typescript-eslint/parser": "^2.33.0", "@vue/cli-plugin-babel": "~4.5.0", "@vue/cli-plugin-eslint": "~4.5.0", + "@vue/cli-plugin-router": "^4.5.4", "@vue/cli-plugin-typescript": "^4.5.4", "@vue/cli-service": "~4.5.0", "@vue/compiler-sfc": "^3.0.0-0", diff --git a/src/jobs-jobs-jobs/src/App.vue b/src/jobs-jobs-jobs/src/App.vue index bf0c12d..860a9ee 100644 --- a/src/jobs-jobs-jobs/src/App.vue +++ b/src/jobs-jobs-jobs/src/App.vue @@ -1,16 +1,22 @@ @@ -21,6 +27,18 @@ export default { -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; - margin-top: 60px; +} + +#nav { + padding: 30px; +} + +#nav a { + font-weight: bold; + color: #2c3e50; +} + +#nav a.router-link-exact-active { + color: #42b983; } diff --git a/src/jobs-jobs-jobs/src/auth/index.ts b/src/jobs-jobs-jobs/src/auth/index.ts new file mode 100644 index 0000000..0a6e013 --- /dev/null +++ b/src/jobs-jobs-jobs/src/auth/index.ts @@ -0,0 +1,63 @@ +/** + * Authentication and Authorization. + * + * This contains authentication and authorization functions needed to permit secure access to the application. + * + * @author Daniel J. Summers + * @version 1 + */ +import { CLIENT_SECRET } from './config' + +/** Client ID for Jobs, Jobs, Jobs */ +const CLIENT_ID = '6Ook3LBff00dOhyBgbf4eXSqIpAroK72aioIdGaDqxs' + +/** No Agenda Social's base URL */ +const NAS_URL = 'https://noagendasocial.com/' + +/** No Agenda Social's base API URL */ +const API_URL = `${NAS_URL}api/v1/` + +/** The base URL for Jobs, Jobs, Jobs */ +const JJJ_URL = `${location.protocol}//${location.host}/` + +/** + * Authorize access to this application from No Agenda Social. + * + * This is the first step in a 2-step log on process; this step will prompt the user to authorize Jobs, Jobs, Jobs to + * get information from their No Agenda Social profile. Once that authorization has been granted, we receive an access + * code which we can use to request a full token. + */ +export function authorize() { + const params = new URLSearchParams([ + [ 'client_id', CLIENT_ID ], + [ 'scope', 'read' ], + [ 'redirect_uri', `${JJJ_URL}user/authorized` ], + [ 'response_type', 'code' ] + ]).toString() + location.assign(`${NAS_URL}oauth/authorize?${params}`) +} + +export async function logOn(authCode: string) { + const options: RequestInit = { + method: 'POST', + body: JSON.stringify({ + client_id: CLIENT_ID, + client_secret: CLIENT_SECRET, + redirect_uri: `${JJJ_URL}user/authorized`, + grant_type: 'authorization_code', + code: authCode, + scope: 'read' + }), + headers: { 'Content-Type': 'application/json' } + } + const resp = await fetch(`${NAS_URL}oauth/token`, options) + if (resp.ok) { + const token = await resp.json() + // TODO: submit token to server, let server obtain profile from NA Social + console.info(`Success - response ${JSON.stringify(token)}`) + } else { + // TODO: notify the user + const err = await resp.text() + console.error(`Failure - ${err}`) + } +} diff --git a/src/jobs-jobs-jobs/src/main.ts b/src/jobs-jobs-jobs/src/main.ts index 01433bc..3e79677 100644 --- a/src/jobs-jobs-jobs/src/main.ts +++ b/src/jobs-jobs-jobs/src/main.ts @@ -1,4 +1,5 @@ import { createApp } from 'vue' import App from './App.vue' +import router from './router' -createApp(App).mount('#app') +createApp(App).use(router).mount('#app') diff --git a/src/jobs-jobs-jobs/src/router/index.ts b/src/jobs-jobs-jobs/src/router/index.ts new file mode 100644 index 0000000..8e12de1 --- /dev/null +++ b/src/jobs-jobs-jobs/src/router/index.ts @@ -0,0 +1,33 @@ +import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router' + +import Home from '../views/Home.vue' +import Authorized from '../views/user/Authorized.vue' + +const routes: Array = [ + { + path: '/', + name: 'Home', + component: Home + }, + { + path: '/about', + name: 'About', + // route level code-splitting + // this generates a separate chunk (about.[hash].js) for this route + // which is lazy-loaded when the route is visited. + component: () => import(/* webpackChunkName: "about" */ '../views/About.vue') + }, + { + path: '/user/authorized', + name: 'Authorized', + component: Authorized, + props: (route) => ({ code: route.query.code }) + } +] + +const router = createRouter({ + history: createWebHistory(process.env.BASE_URL), + routes +}) + +export default router diff --git a/src/jobs-jobs-jobs/src/views/About.vue b/src/jobs-jobs-jobs/src/views/About.vue new file mode 100644 index 0000000..3fa2807 --- /dev/null +++ b/src/jobs-jobs-jobs/src/views/About.vue @@ -0,0 +1,5 @@ + diff --git a/src/jobs-jobs-jobs/src/views/Home.vue b/src/jobs-jobs-jobs/src/views/Home.vue new file mode 100644 index 0000000..76ec286 --- /dev/null +++ b/src/jobs-jobs-jobs/src/views/Home.vue @@ -0,0 +1,75 @@ + + + + + + diff --git a/src/jobs-jobs-jobs/src/views/user/Authorized.vue b/src/jobs-jobs-jobs/src/views/user/Authorized.vue new file mode 100644 index 0000000..f17f1ec --- /dev/null +++ b/src/jobs-jobs-jobs/src/views/user/Authorized.vue @@ -0,0 +1,18 @@ + + + \ No newline at end of file