connected the frontend with the gateway and discovery service

Former-commit-id: 32a3218c

fda-container-service/rest-service/src/main/resources/application-docker.yml

@@ -22,5 +22,5 @@ logging:
     root: warn
     at.tuwien.: debug
 eureka:
-  instance.hostname: fda-discovery-service
+  instance.hostname: fda-container-service
   client.serviceUrl.defaultZone: http://fda-discovery-service:9090/eureka/
\ No newline at end of file

fda-database-service/rest-service/src/main/resources/application-docker.yml

@@ -22,5 +22,5 @@ logging:
     root: warn
     at.tuwien.: debug
 eureka:
-  instance.hostname: fda-discovery-service
+  instance.hostname: fda-database-service
   client.serviceUrl.defaultZone: http://fda-discovery-service:9090/eureka/
\ No newline at end of file

fda-gateway-service/src/main/java/at/tuwien/gatewayservice/config/GatewayConfig.java

@@ -21,16 +21,21 @@ public class GatewayConfig {
                         .method("POST","GET","PUT","DELETE")
                         .and()
                         .uri("lb://fda-container-service"))
-                .route("fda-database-service", r -> r.path("/api/database/**")
+                .route("fda-query-service", r -> r.path("/api/database/**/query/**")
                         .and()
                         .method("POST","GET","PUT","DELETE")
                         .and()
-                        .uri("lb://fda-database-service"))
+                        .uri("lb://fda-query-service"))
                 .route("fda-table-service", r -> r.path("/api/database/**/table/**")
                         .and()
                         .method("POST","GET","PUT","DELETE")
                         .and()
                         .uri("lb://fda-table-service"))
+                .route("fda-database-service", r -> r.path("/api/database/**")
+                        .and()
+                        .method("POST","GET","PUT","DELETE")
+                        .and()
+                        .uri("lb://fda-database-service"))
                 .build();
     }
 

fda-gateway-service/src/main/java/at/tuwien/gatewayservice/config/WebConfig.java

 package at.tuwien.gatewayservice.config;
 
+import org.springframework.cloud.client.loadbalancer.LoadBalanced;
+import org.springframework.context.annotation.Bean;
 import org.springframework.context.annotation.Configuration;
 import org.springframework.web.reactive.config.CorsRegistry;
 import org.springframework.web.reactive.config.WebFluxConfigurer;
+import org.springframework.web.reactive.function.client.WebClient;
 
 @Configuration
 public class WebConfig implements WebFluxConfigurer {
@@ -13,4 +16,11 @@ public class WebConfig implements WebFluxConfigurer {
                 .allowedMethods("POST", "GET", "PUT", "DELETE")
                 .allowedOrigins("*");
     }
+
+    @Bean
+    @LoadBalanced
+    public WebClient.Builder loadBalancedWebClientBuilder() {
+        return WebClient.builder();
+    }
+
 }

fda-query-service/rest-service/src/main/resources/application-docker.yml

@@ -22,5 +22,5 @@ logging:
     root: warn
     at.tuwien.: debug
 eureka:
-  instance.hostname: fda-discovery-service
+  instance.hostname: fda-query-service
   client.serviceUrl.defaultZone: http://fda-discovery-service:9090/eureka/
\ No newline at end of file

fda-table-service/rest-service/src/main/resources/application-docker.yml

@@ -20,7 +20,7 @@ logging:
     root: warn
     at.tuwien.: debug
 eureka:
-  instance.hostname: fda-discovery-service
+  instance.hostname: fda-table-service
   client.serviceUrl.defaultZone: http://fda-discovery-service:9090/eureka/
 fda:
   mapping.path: /root

fda-ui/.env

 # DB Service API url
-API_CONTAINER="http://localhost:9091"
-API_IMAGE="http://localhost:9091"
-API_DATABASE="http://localhost:9092"
-API_TABLES="http://localhost:9094"
-API_ANALYSE="http://localhost:5000"
+# GATEWAY SERVICE
+API="http://localhost:9095"

fda-ui/.env-docker

+# DB Service API url
+# GATEWAY SERVICE
+API="http://fda-gateway-service:9095"

fda-ui/Dockerfile

@@ -17,7 +17,7 @@ RUN apt-get update && apt-get install -y --no-install-recommends \
   libxtst6
 
 # Our app
-COPY ./.env ./
+COPY ./.env-docker ./.env
 COPY ./assets ./assets
 COPY ./ava.config.cjs ./
 COPY ./babel.config.js ./

fda-ui/components/TableList.vue

@@ -104,7 +104,7 @@ export default {
       if (typeof this.panelIndex !== 'undefined') {
         const tableId = this.tables[this.panelIndex].id
         try {
-          const res = await this.$axios.get(`http://localhost:9094/api/database/${this.$route.params.database_id}/table/${tableId}`)
+          const res = await this.$axios.get(`/api/database/${this.$route.params.database_id}/table/${tableId}`)
           this.tableDetails = res.data
         } catch (err) {
           this.$toast.error('Could not get table details.')
@@ -124,7 +124,7 @@ export default {
       let res
       try {
         res = await this.$axios.get(
-          `http://localhost:9094/api/database/${this.$route.params.database_id}/table`)
+          `/api/database/${this.$route.params.database_id}/table`)
         this.tables = res.data
       } catch (err) {
         this.$toast.error('Could not list table.')
@@ -133,7 +133,7 @@ export default {
     async deleteTable () {
       try {
         await this.$axios.delete(
-          `http://localhost:9094/api/database/${this.$route.params.database_id}/table/${this.deleteTableId}`)
+          `/api/database/${this.$route.params.database_id}/table/${this.deleteTableId}`)
         this.refresh()
       } catch (err) {
         this.$toast.error('Could not delete table.')

fda-ui/components/query/Builder.vue

@@ -73,7 +73,7 @@ export default {
     // XXX same as in TableList
     try {
       const res = await this.$axios.get(
-        `http://localhost:9094/api/database/${this.$route.params.database_id}/table`)
+        `/api/database/${this.$route.params.database_id}/table`)
       this.tables = res.data
     } catch (err) {
       this.$toast.error('Could not list table.')
@@ -102,7 +102,7 @@ export default {
     async loadColumns () {
       const tableId = this.table.id
       try {
-        const res = await this.$axios.get(`http://localhost:9094/api/database/${this.$route.params.database_id}/table/${tableId}`)
+        const res = await this.$axios.get(`/api/database/${this.$route.params.database_id}/table/${tableId}`)
         this.tableDetails = res.data
         this.buildQuery()
       } catch (err) {

fda-ui/nuxt.config.js

@@ -4,7 +4,7 @@ import colors from 'vuetify/es5/util/colors'
 // pick env vars from .env file or get them passed through docker-compose
 require('dotenv').config()
 
-if (!process.env.API_CONTAINER) {
+if (!process.env.API) {
   throw new Error(`Environment variable API_CONTAINER not defined.
 
 Have you passed env vars from docker-compose or defined them in your .env file?`)
@@ -64,11 +64,7 @@ export default {
   },
 
   proxy: {
-    '/api/container': process.env.API_CONTAINER,
-    '/api/image': process.env.API_IMAGE,
-    '/api/database': process.env.API_DATABASE,
-    '/api/analyse': process.env.API_ANALYSE,
-    '/api/table': process.env.API_TABLES
+    '/api': process.env.API
   },
 
   serverMiddleware: [

fda-ui/pages/databases/_database_id/tables/_table_id/import.vue

@@ -71,7 +71,7 @@ export default {
         this.loading = false
         return
       }
-      const insertUrl = `http://localhost:9094/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}/data`
+      const insertUrl = `/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}/data`
       let insertResult
       try {
         insertResult = await this.$axios.post(insertUrl, this.tableInsert)

fda-ui/pages/databases/_database_id/tables/_table_id/index.vue

@@ -48,7 +48,7 @@ export default {
   methods: {
     async loadProperties () {
       try {
-        const res = await this.$axios.get(`http://localhost:9094/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}`)
+        const res = await this.$axios.get(`/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}`)
         this.table = res.data
         console.debug('headers', res.data.columns)
         this.headers = res.data.columns.map((c) => {
@@ -64,7 +64,7 @@ export default {
     },
     async loadData () {
       try {
-        const res = await this.$axios.get(`http://localhost:9094/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}/data`)
+        const res = await this.$axios.get(`/api/database/${this.$route.params.database_id}/table/${this.$route.params.table_id}/data`)
         this.rows = res.data.result
         console.debug('table data', res.data)
       } catch (err) {

fda-ui/pages/databases/_database_id/tables/create.vue

@@ -140,7 +140,7 @@ export default {
         columns: this.columns
       }
       try {
-        const res = await this.$axios.post(`http://localhost:9094/api/database/${this.$route.params.database_id}/table`, data)
+        const res = await this.$axios.post(`/api/database/${this.$route.params.database_id}/table`, data)
         if (res.status === 201) {
           this.$toast.success('Table created.')
           this.$root.$emit('table-create', res.data)

fda-ui/pages/databases/_database_id/tables/import.vue

@@ -117,7 +117,7 @@
       <v-stepper-content step="4">
         Proceed to table view.
         <div class="mt-2">
-          <v-btn :to="`/database/${$route.params.database_id}/tables/${newTableId}`" outlined>
+          <v-btn :to="`/databases/${$route.params.database_id}/tables/${newTableId}`" outlined>
             <v-icon>mdi-table</v-icon>
             View
           </v-btn>
@@ -208,7 +208,7 @@ export default {
           column.enumValues = column.enumValues.split(',')
         }
       })
-      const createUrl = `http://localhost:9094/api/database/${this.$route.params.database_id}/table`
+      const createUrl = `/api/database/${this.$route.params.database_id}/table`
       let createResult
       try {
         createResult = await this.$axios.post(createUrl, this.tableCreate)
@@ -218,7 +218,7 @@ export default {
         console.log(err)
         return
       }
-      const insertUrl = `http://localhost:9094/api/database/${this.$route.params.database_id}/table/${createResult.data.id}/data`
+      const insertUrl = `/api/database/${this.$route.params.database_id}/table/${createResult.data.id}/data`
       let insertResult
       try {
         insertResult = await this.$axios.post(insertUrl, this.tableInsert)