arti/Estonian-ID-card-mobile-authenticator-POC
1
0
Fork 0
mirror of https://github.com/TanelOrumaa/Estonian-ID-card-mobile-authenticator-POC.git synced 2024-12-22 12:30:16 +02:00
Code Packages Releases Wiki Activity

MOB-55 Added vue frontend

Browse Source
This commit is contained in:
TanelOrumaa 2021-12-06 18:14:01 +02:00
parent 1b9a59d4eb
commit 7daea4b6c2
20 changed files with 36747 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
demoBackend/src/demo-website/.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

BIN
demoBackend/src/demo-website/.npmrc Normal file
View File

Binary file not shown.

24
demoBackend/src/demo-website/README.md Normal file
View File

@ -0,0 +1,24 @@
# demo-website
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).

5
demoBackend/src/demo-website/babel.config.js Normal file
View File

@ -0,0 +1,5 @@
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}

BIN
demoBackend/src/demo-website/node/node.exe Normal file
View File

Binary file not shown.

44
demoBackend/src/demo-website/node/npm Normal file
View File

@ -0,0 +1,44 @@
#!/usr/bin/env bash
(set -o igncr) 2>/dev/null && set -o igncr; # cygwin encoding fix
basedir=`dirname "$0"`
case `uname` in
*CYGWIN*) basedir=`cygpath -w "$basedir"`;;
esac
NODE_EXE="$basedir/node.exe"
if ! [ -x "$NODE_EXE" ]; then
NODE_EXE="$basedir/node"
fi
if ! [ -x "$NODE_EXE" ]; then
NODE_EXE=node
fi
# this path is passed to node.exe, so it needs to match whatever
# kind of paths Node.js thinks it's using, typically win32 paths.
CLI_BASEDIR="$("$NODE_EXE" -p 'require("path").dirname(process.execPath)')"
NPM_CLI_JS="$CLI_BASEDIR/node_modules/npm/bin/npm-cli.js"
NPM_PREFIX=`"$NODE_EXE" "$NPM_CLI_JS" prefix -g`
if [ $? -ne 0 ]; then
# if this didn't work, then everything else below will fail
echo "Could not determine Node.js install directory" >&2
exit 1
fi
NPM_PREFIX_NPM_CLI_JS="$NPM_PREFIX/node_modules/npm/bin/npm-cli.js"
# a path that will fail -f test on any posix bash
NPM_WSL_PATH="/.."
# WSL can run Windows binaries, so we have to give it the win32 path
# however, WSL bash tests against posix paths, so we need to construct that
# to know if npm is installed globally.
if [ `uname` = 'Linux' ] && type wslpath &>/dev/null ; then
NPM_WSL_PATH=`wslpath "$NPM_PREFIX_NPM_CLI_JS"`
fi
if [ -f "$NPM_PREFIX_NPM_CLI_JS" ] || [ -f "$NPM_WSL_PATH" ]; then
NPM_CLI_JS="$NPM_PREFIX_NPM_CLI_JS"
fi
"$NODE_EXE" "$NPM_CLI_JS" "$@"

19
demoBackend/src/demo-website/node/npm.cmd Normal file
View File

@ -0,0 +1,19 @@
:: Created by npm, please don't edit manually.
@ECHO OFF
SETLOCAL
SET "NODE_EXE=%~dp0\node.exe"
IF NOT EXIST "%NODE_EXE%" (
SET "NODE_EXE=node"
)
SET "NPM_CLI_JS=%~dp0\node_modules\npm\bin\npm-cli.js"
FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" prefix -g') DO (
SET "NPM_PREFIX_NPM_CLI_JS=%%F\node_modules\npm\bin\npm-cli.js"
)
IF EXIST "%NPM_PREFIX_NPM_CLI_JS%" (
SET "NPM_CLI_JS=%NPM_PREFIX_NPM_CLI_JS%"
)
"%NODE_EXE%" "%NPM_CLI_JS%" %*

27336
demoBackend/src/demo-website/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

44
demoBackend/src/demo-website/package.json Normal file
View File

@ -0,0 +1,44 @@
{
"name": "demo-website",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@web-eid/web-eid-library": "../../../../web-eid.js/",
"core-js": "^3.6.5",
"vue": "^3.0.0"
},
"devDependencies": {
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/compiler-sfc": "^3.0.0",
"babel-eslint": "^10.1.0",
"bootstrap": "^5.1.3",
"bootstrap-vue-3": "^0.0.5",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "babel-eslint"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}

BIN
demoBackend/src/demo-website/public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

17
demoBackend/src/demo-website/public/index.html Normal file
View File

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

BIN
demoBackend/src/demo-website/src/assets/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

94
demoBackend/src/demo-website/src/components/Login.vue Normal file
View File

@ -0,0 +1,94 @@
<template>
<div class="container container-md d-flex flex-column">
<div>
<h3 class="text-center">Welcome to Estonian ID card mobile authentication demo website. When using an Android mobile phone, you can
log in to the
website using your ID card by using the button below.</h3>
<p class="text-center">Read more from <a href="https://github.com/TanelOrumaa/Estonian-ID-card-mobile-authenticator-POC">here.</a></p>
</div>
<div class="justify-content-center d-flex">
<button type="button" class="btn btn-lg btn-dark" v-on:click="authenticate">Authenticate</button>
</div>
<div class="btn-group-sm d-flex justify-content-center" role="group" aria-label="Basic radio toggle button group">
<input type="radio" class="btn-check" name="btnradio" id="btnCardReader" autocomplete="off" v-on:click="useCardReader">
<label class="btn btn-outline-secondary" for="btnCardReader">using ID-card reader</label>
<input type="radio" class="btn-check" name="btnradio" id="btnApp" autocomplete="off" checked v-on:click="useApp">
<label class="btn btn-outline-secondary" for="btnApp">using Android App</label>
</div>
<div id="canvas"></div>
<p>Token: {{ csrftoken }}</p>
</div>
</template>
<script>
import * as webeid from '../web-eid.js';
export default {
name: 'Login',
props: {
"csrftoken": String,
},
data() {
return {
useApp: true,
}
},
methods: {
useApp: function() {
this.useApp = true;
},
useCardReader: function() {
this.useApp = false;
},
authenticate: async function () {
const csrfToken = document.querySelector('#csrftoken').content;
const csrfHeaderName = document.querySelector('#csrfheadername').content;
const options = {
getAuthChallengeUrl: window.location.origin + "/auth/challenge",
postAuthTokenUrl: window.location.origin + "/auth/login",
getAuthSuccessUrl: window.location.origin + "/auth/login",
useAuthApp: this.useApp,
headers: {
[csrfHeaderName]: csrfToken
}
};
console.log(options);
try {
const response = await webeid.authenticate(options);
console.log("Authentication successful! Response:", response);
window.location.href = "/welcome";
} catch (error) {
console.log("Authentication failed! Error:", error);
throw error;
}
}
},
mounted() {
fetch("/auth/challenge")
.then((response) => response.text()
).then((data) => {
console.log(data)
this.msg = data
}
)
}
}
</script>
<style scoped>
div {
margin-top: 2vh;
}
</style>

18
demoBackend/src/demo-website/src/components/Navbar.vue Normal file
View File

@ -0,0 +1,18 @@
<template>
<!-- As a heading -->
<nav class="navbar navbar-light bg-light">
<div class="container-fluid">
<span class="navbar-brand mb-0 h1">Mobile authentication demo</span>
</div>
</nav>
</template>
<script>
export default {
name: "Navbar"
}
</script>
<style scoped>
</style>

22
demoBackend/src/demo-website/src/pages/login/App.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<Navbar/>
<hello-world v-bind:csrftoken="csrf_token()"/>
</template>
<script>
import HelloWorld from '../../components/Login.vue'
import Navbar from "@/components/Navbar";
export default {
name: 'App',
components: {
HelloWorld,
Navbar
},
methods: {
csrf_token: function () {
return "csrf-token";
}
}
}
</script>

10
demoBackend/src/demo-website/src/pages/login/main.js Normal file
View File

@ -0,0 +1,10 @@
import { createApp } from 'vue';
import App from './App.vue';
import BootstrapVue3 from 'bootstrap-vue-3'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
const app = createApp(App)
app.use(BootstrapVue3)
app.mount('#app')

22
demoBackend/src/demo-website/src/pages/welcome/App.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<Navbar/>
<hello-world v-bind:csrftoken="csrf_token()"/>
</template>
<script>
import HelloWorld from '../../components/Login.vue'
import Navbar from "@/components/Navbar";
export default {
name: 'App',
components: {
HelloWorld,
Navbar
},
methods: {
csrf_token: function () {
return "csrf-token";
}
}
}
</script>

10
demoBackend/src/demo-website/src/pages/welcome/main.js Normal file
View File

@ -0,0 +1,10 @@
import { createApp } from 'vue';
import App from './App.vue';
import BootstrapVue3 from 'bootstrap-vue-3'
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'
const app = createApp(App)
app.use(BootstrapVue3)
app.mount('#app')

9023
demoBackend/src/demo-website/src/web-eid.js Normal file
View File

File diff suppressed because it is too large Load Diff

36
demoBackend/src/demo-website/vue.config.js Normal file
View File

@ -0,0 +1,36 @@
// vue.config.js
module.exports = {
chainWebpack: config => {
config.module.rule('vue').uses.delete('cache-loader');
config.module.rule('js').uses.delete('cache-loader');
config.module.rule('ts').uses.delete('cache-loader');
config.module.rule('tsx').uses.delete('cache-loader');
},
// https.//cli.vuejs.org/config/#devserver-proxy
devServer: {
port: 3000,
proxy: {
"/auth": {
target: "http://localhost:8080",
ws: true,
changeOrigin: true
}
}
},
pages: {
index: {
entry: "./src/pages/home/main.js",
template: "public/index.html",
filename: "index.html",
title: "Home",
chunks: [],
},
legal: {
entry: "./src/pages/legal/main.js",
template: "public/index.html",
filename: "legal.html",
title: "Legal",
chunks:,
}
}
}