Specify the backend address using environment variables

hengxin · Jan 26, 2024 · 1980cf5 · 1980cf5
1 parent 5e8dcde
commit 1980cf5
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 3 deletions.
diff --git a/frontend/.env b/frontend/.env
@@ -0,0 +1 @@
+VITE_BACKEND_URL=http://localhost:8000/
diff --git a/frontend/src/components/Dashboard.vue b/frontend/src/components/Dashboard.vue
@@ -2,9 +2,11 @@
 import {reactive, ref} from "vue"
 import {ElMessage, ElMessageBox} from "element-plus"
 import type {UploadProps, UploadUserFile} from "element-plus"
-import {run, get_current_log} from "@/api/api"
+import {run} from "@/api/api"
 import {InfoFilled} from "@element-plus/icons-vue"
 
+const backendUrl = ref(import.meta.env.VITE_BACKEND_URL);
+
 const testingOption = reactive({
   db_url: 'jdbc:mysql://localhost:3306',
   db_type: 'MYSQL',
@@ -314,7 +316,7 @@ const handleIndexChange = (index) => {
                   <el-upload
                       v-model:file-list="fileList"
                       class="upload-demo"
-                      action="http://localhost:8000/upload/"
+                      :action="backendUrl + 'upload'"
                       multiple
                       :on-preview="handlePreview"
                       :on-remove="handleRemove"

diff --git a/frontend/src/utils/request.js b/frontend/src/utils/request.js
@@ -2,7 +2,7 @@ import axios from "axios";
 
 
 const request  = axios.create({
-    baseURL: 'http://localhost:8000/',
+    baseURL: import.meta.env.VITE_BACKEND_URL,
     timeout: 300000,
 })