Setup axios with the dev/prod environment variables for the API access

frontend/.env.development

@@ -0,0 +1,2 @@
+VUE_APP_URL=http://127.0.0.1:8080
+VUE_APP_API_URL=http://127.0.0.1:8081

frontend/.env.production

@@ -0,0 +1,2 @@
+VUE_APP_URL=https://timings.okaeri.eu
+VUE_APP_API_URL=https://timings-api.okaeri.eu

frontend/package.json

@@ -13,10 +13,12 @@
     "@fortawesome/free-solid-svg-icons": "^5.15.4",
     "@fortawesome/vue-fontawesome": "^3.0.0-5",
     "apexcharts": "^3.33.0",
+    "axios": "^0.25.0",
     "core-js": "^3.6.5",
     "mdb-vue-ui-kit": "^1.9.0",
     "typeface-roboto": "^1.1.13",
     "vue": "^3.0.0",
+    "vue-axios": "^3.4.0",
     "vue3-apexcharts": "^1.4.1"
   },
   "devDependencies": {

frontend/src/App.vue

@@ -21,7 +21,7 @@
             <MDBCardTitle>1. Generate report</MDBCardTitle>
             <MDBCardText>
               Execute this command on your Linux based system:
-              <pre class="mt-2 mb-4">curl -s https://timings.okaeri.eu/otimings.sh | bash -s 60</pre>
+              <pre class="mt-2 mb-4">curl -s {{ appUrl }}/otimings.sh | bash -s 60</pre>
               <strong>Note:</strong> report generation takes a long time. Make sure it runs till the end (e.g. using <code>screen</code>)
               for the best results. The default run-time is <code>60</code> minutes and cannot be shorter than 5 minutes. After the script
               finalizes its run, the file named 'okaeri-timings-XXX.csv' (e.g. 'okaeri-timings-1642975054.csv') will be available.
@@ -187,7 +187,8 @@ export default {
   },
   setup: function () {
     return {
-      dataLabels: ['user', 'nice', 'system', 'idle', 'iowait', 'irq', 'softirq', 'steal', 'guest', 'guest_nice']
+      dataLabels: ['user', 'nice', 'system', 'idle', 'iowait', 'irq', 'softirq', 'steal', 'guest', 'guest_nice'],
+      appUrl: process.env.VUE_APP_URL
     }
   },
   data: function () {

frontend/src/main.js

@@ -4,10 +4,15 @@ import 'typeface-roboto/index.css'
 import {createApp} from 'vue'
 import App from './App.vue'
 
+import axios from 'axios'
+import VueAxios from 'vue-axios'
 import fontAwesome from "@/plugins/font-awesome";
 import VueApexCharts from "vue3-apexcharts";
 
 const app = createApp(App);
+app.use(VueAxios, axios);
 app.use(fontAwesome);
 app.use(VueApexCharts);
 app.mount('#app')
+
+app.axios.defaults.baseURL = process.env.VUE_APP_API_URL;

frontend/yarn.lock

@@ -1984,6 +1984,13 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
+axios@^0.25.0:
+  version "0.25.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.25.0.tgz#349cfbb31331a9b4453190791760a8d35b093e0a"
+  integrity sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==
+  dependencies:
+    follow-redirects "^1.14.7"
+
 babel-eslint@^10.1.0:
   version "10.1.0"
   resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
@@ -4064,7 +4071,7 @@ flush-write-stream@^1.0.0:
     inherits "^2.0.3"
     readable-stream "^2.3.6"
 
-follow-redirects@^1.0.0:
+follow-redirects@^1.0.0, follow-redirects@^1.14.7:
   version "1.14.7"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.7.tgz#2004c02eb9436eee9a21446a6477debf17e81685"
   integrity sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==
@@ -8383,6 +8390,11 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
   integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
 
+vue-axios@^3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/vue-axios/-/vue-axios-3.4.0.tgz#059d7fcbe83f786cda24e9501317174736927b37"
+  integrity sha512-S3YTCJeEndzmtaYzyz919Z54wY1D2OftWEhioGbHED3VUSta8ti0OHjDipTPkb1StxOzQLAAO2hSUq830i14KA==
+
 vue-eslint-parser@^7.10.0:
   version "7.11.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz#214b5dea961007fcffb2ee65b8912307628d0daf"