You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@dubbo.apache.org by mi...@apache.org on 2018/10/26 13:32:40 UTC

[incubator-dubbo-ops] branch develop updated: Change to frontend proxy (#167)

This is an automated email from the ASF dual-hosted git repository.

min pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/incubator-dubbo-ops.git


The following commit(s) were added to refs/heads/develop by this push:
     new efd93a7  Change to frontend proxy (#167)
efd93a7 is described below

commit efd93a7f01f3c7e40b6d736bd47d9d7c06d40903
Author: 马金凯 <ma...@vip.qq.com>
AuthorDate: Fri Oct 26 21:32:35 2018 +0800

    Change to frontend proxy (#167)
    
    * Remove backend CORS
    * Add frontend proxy
    * Add axios to global
---
 .../java/org/apache/dubbo/admin/config/I18nConfig.java  | 11 -----------
 dubbo-admin-frontend/config/index.js                    | 10 +++++++++-
 dubbo-admin-frontend/src/components/ServiceDetail.vue   |  4 +---
 dubbo-admin-frontend/src/components/ServiceSearch.vue   |  4 +---
 .../src/components/governance/AccessControl.vue         |  9 ++++-----
 .../src/components/governance/LoadBalance.vue           | 13 ++++++-------
 .../src/components/governance/Overrides.vue             | 17 ++++++++---------
 .../src/components/governance/RoutingRule.vue           | 17 ++++++++---------
 .../src/components/governance/WeightAdjust.vue          | 13 ++++++-------
 dubbo-admin-frontend/src/components/http-common.js      |  2 +-
 dubbo-admin-frontend/src/main.js                        |  2 ++
 11 files changed, 46 insertions(+), 56 deletions(-)

diff --git a/dubbo-admin-backend/src/main/java/org/apache/dubbo/admin/config/I18nConfig.java b/dubbo-admin-backend/src/main/java/org/apache/dubbo/admin/config/I18nConfig.java
index e5a6ab0..fae1e00 100644
--- a/dubbo-admin-backend/src/main/java/org/apache/dubbo/admin/config/I18nConfig.java
+++ b/dubbo-admin-backend/src/main/java/org/apache/dubbo/admin/config/I18nConfig.java
@@ -23,7 +23,6 @@ import org.springframework.context.annotation.Bean;
 import org.springframework.context.annotation.ComponentScan;
 import org.springframework.context.annotation.Configuration;
 import org.springframework.web.servlet.LocaleResolver;
-import org.springframework.web.servlet.config.annotation.CorsRegistry;
 import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
 import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
 import org.springframework.web.servlet.i18n.LocaleChangeInterceptor;
@@ -57,16 +56,6 @@ public class I18nConfig implements WebMvcConfigurer {
     }
 
     @Override
-    public void addCorsMappings(CorsRegistry registry) {
-        if (activeProfile.equals("develop")) {
-            registry.addMapping("/**")
-                    .allowedHeaders("*")
-                    .allowedMethods("*")
-                    .allowedOrigins("*");
-        }
-    }
-
-    @Override
     public void addInterceptors(InterceptorRegistry registry) {
         registry.addInterceptor(localeChangeInterceptor());
     }
diff --git a/dubbo-admin-frontend/config/index.js b/dubbo-admin-frontend/config/index.js
index f9cedfb..b8ec2a2 100644
--- a/dubbo-admin-frontend/config/index.js
+++ b/dubbo-admin-frontend/config/index.js
@@ -10,7 +10,15 @@ module.exports = {
     // Paths
     assetsSubDirectory: 'static',
     assetsPublicPath: '/',
-    proxyTable: {},
+    proxyTable: {
+      '/': {
+        target: 'http://localhost:8080/',
+        changeOrigin: true,
+        pathRewrite: {
+          '^/': '/'
+        }
+      }
+    },
 
     // Various Dev Server settings
     host: 'localhost', // can be overwritten by process.env.HOST
diff --git a/dubbo-admin-frontend/src/components/ServiceDetail.vue b/dubbo-admin-frontend/src/components/ServiceDetail.vue
index 80bfaed..2f65e49 100644
--- a/dubbo-admin-frontend/src/components/ServiceDetail.vue
+++ b/dubbo-admin-frontend/src/components/ServiceDetail.vue
@@ -103,8 +103,6 @@
   </v-container>
 </template>
 <script>
-  import {AXIOS} from './http-common'
-
   export default {
     data: () => ({
       metaHeaders: [
@@ -170,7 +168,7 @@
     }),
     methods: {
       detail: function (service) {
-        AXIOS.get('/service/' + service)
+        this.$axios.get('/service/' + service)
             .then(response => {
               this.providerDetails = response.data.providers
               this.consumerDetails = response.data.consumers
diff --git a/dubbo-admin-frontend/src/components/ServiceSearch.vue b/dubbo-admin-frontend/src/components/ServiceSearch.vue
index 0642459..64e3830 100644
--- a/dubbo-admin-frontend/src/components/ServiceSearch.vue
+++ b/dubbo-admin-frontend/src/components/ServiceSearch.vue
@@ -86,8 +86,6 @@
   </v-container>
 </template>
 <script>
-  import {AXIOS} from './http-common'
-
   export default {
     data: () => ({
       items: [
@@ -144,7 +142,7 @@
         this.search(this.filter, pattern, true)
       },
       search: function (filter, pattern, rewrite) {
-        AXIOS.get('/service', {
+        this.$axios.get('/service', {
           params: {
             pattern: pattern,
             filter: filter
diff --git a/dubbo-admin-frontend/src/components/governance/AccessControl.vue b/dubbo-admin-frontend/src/components/governance/AccessControl.vue
index 73e5759..57e1cc8 100644
--- a/dubbo-admin-frontend/src/components/governance/AccessControl.vue
+++ b/dubbo-admin-frontend/src/components/governance/AccessControl.vue
@@ -128,7 +128,6 @@
 
 <script>
 import yaml from 'js-yaml'
-import { AXIOS } from '@/components/http-common'
 import AceEditor from '@/components/public/AceEditor'
 import Search from '@/components/public/Search'
 
@@ -191,7 +190,7 @@ export default {
         path: 'access',
         query: { service: this.filter }
       })
-      AXIOS.get('/rules/access', {
+      this.$axios.get('/rules/access', {
         params: {
           service: this.filter
         }
@@ -223,7 +222,7 @@ export default {
       if (this.modal.service === '' || this.modal.service === null) {
         return
       }
-      AXIOS.post('/rules/access', {
+      this.$axios.post('/rules/access', {
         service: this.modal.service,
         whitelist: doc.whitelist,
         blacklist: doc.blacklist
@@ -246,7 +245,7 @@ export default {
     },
     editItem () {
       let doc = yaml.load(this.modal.content)
-      AXIOS.put('/rules/access/' + this.modal.id, {
+      this.$axios.put('/rules/access/' + this.modal.id, {
         whitelist: doc.whitelist,
         blacklist: doc.blacklist
       }).then(response => {
@@ -264,7 +263,7 @@ export default {
       })
     },
     deleteItem (id) {
-      AXIOS.delete('/rules/access/' + id)
+      this.$axios.delete('/rules/access/' + id)
       .then(response => {
         this.showSnackbar('success', 'Delete success')
         this.search(this.filter)
diff --git a/dubbo-admin-frontend/src/components/governance/LoadBalance.vue b/dubbo-admin-frontend/src/components/governance/LoadBalance.vue
index dc1cd63..dfe84b1 100644
--- a/dubbo-admin-frontend/src/components/governance/LoadBalance.vue
+++ b/dubbo-admin-frontend/src/components/governance/LoadBalance.vue
@@ -102,7 +102,6 @@
 </template>
 <script>
   import yaml from 'js-yaml'
-  import {AXIOS} from '../http-common'
   import AceEditor from '@/components/public/AceEditor'
   import Search from '@/components/public/Search'
   export default {
@@ -161,7 +160,7 @@
         this.search(this.filter, true)
       },
       search: function (filter, rewrite) {
-        AXIOS.get('/rules/balancing', {
+        this.$axios.get('/rules/balancing', {
           params: {
             service: filter
           }
@@ -203,7 +202,7 @@
             this.closeDialog()
           } else {
             balancing.id = this.updateId
-            AXIOS.put('/rules/balancing/' + balancing.id, balancing)
+            this.$axios.put('/rules/balancing/' + balancing.id, balancing)
               .then(response => {
                 this.search(this.service, true)
                 this.filter = this.service
@@ -211,7 +210,7 @@
               })
           }
         } else {
-          AXIOS.post('/rules/balancing', balancing)
+          this.$axios.post('/rules/balancing', balancing)
             .then(response => {
               if (response.data) {
                 this.search(this.service, true)
@@ -224,7 +223,7 @@
       itemOperation: function (icon, item) {
         switch (icon) {
           case 'visibility':
-            AXIOS.get('/rules/balancing/' + item.id)
+            this.$axios.get('/rules/balancing/' + item.id)
               .then(response => {
                 let balancing = response.data
                 this.handleBalance(balancing, true)
@@ -232,7 +231,7 @@
               })
             break
           case 'edit':
-            AXIOS.get('/rules/balancing/' + item.id)
+            this.$axios.get('/rules/balancing/' + item.id)
               .then(response => {
                 let balancing = response.data
                 this.handleBalance(balancing, false)
@@ -257,7 +256,7 @@
         this.height = window.innerHeight * 0.5
       },
       deleteItem: function (id) {
-        AXIOS.delete('/rules/balancing/' + id)
+        this.$axios.delete('/rules/balancing/' + id)
           .then(response => {
             this.warn = false
             this.search(this.filter, false)
diff --git a/dubbo-admin-frontend/src/components/governance/Overrides.vue b/dubbo-admin-frontend/src/components/governance/Overrides.vue
index b28ef77..be232e6 100644
--- a/dubbo-admin-frontend/src/components/governance/Overrides.vue
+++ b/dubbo-admin-frontend/src/components/governance/Overrides.vue
@@ -101,7 +101,6 @@
 <script>
   import AceEditor from '@/components/public/AceEditor'
   import yaml from 'js-yaml'
-  import {AXIOS} from '../http-common'
   import Search from '@/components/public/Search'
   import operations from '@/api/operation'
   export default {
@@ -158,7 +157,7 @@
         this.search(this.filter, true)
       },
       search: function (filter, rewrite) {
-        AXIOS.get('/rules/override', {
+        this.$axios.get('/rules/override', {
           params: {
             service: filter
           }
@@ -199,14 +198,14 @@
           if (this.updateId === 'close') {
             this.closeDialog()
           } else {
-            AXIOS.put('/rules/override/' + this.updateId, override)
+            this.$axios.put('/rules/override/' + this.updateId, override)
               .then(response => {
                 this.search(this.service, true)
                 this.filter = this.service
               })
           }
         } else {
-          AXIOS.post('/rules/override', override)
+          this.$axios.post('/rules/override', override)
             .then(response => {
               if (response.data) {
                 this.search(this.service, true)
@@ -219,7 +218,7 @@
       itemOperation: function (icon, item) {
         switch (icon) {
           case 'visibility':
-            AXIOS.get('/rules/override/' + item.id)
+            this.$axios.get('/rules/override/' + item.id)
               .then(response => {
                 let config = response.data
                 this.handleConfig(config, true)
@@ -227,7 +226,7 @@
               })
             break
           case 'edit':
-            AXIOS.get('/rules/override/' + item.id)
+            this.$axios.get('/rules/override/' + item.id)
               .then(response => {
                 let config = response.data
                 this.handleConfig(config, false)
@@ -264,19 +263,19 @@
         let id = warnStatus.id
         let operation = warnStatus.operation
         if (operation === 'delete') {
-          AXIOS.delete('/rules/override/' + id)
+          this.$axios.delete('/rules/override/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
             })
         } else if (operation === 'disable') {
-          AXIOS.put('/rules/override/disable/' + id)
+          this.$axios.put('/rules/override/disable/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
             })
         } else if (operation === 'enable') {
-          AXIOS.put('/rules/override/enable/' + id)
+          this.$axios.put('/rules/override/enable/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
diff --git a/dubbo-admin-frontend/src/components/governance/RoutingRule.vue b/dubbo-admin-frontend/src/components/governance/RoutingRule.vue
index c5d7a5e..9247350 100644
--- a/dubbo-admin-frontend/src/components/governance/RoutingRule.vue
+++ b/dubbo-admin-frontend/src/components/governance/RoutingRule.vue
@@ -111,7 +111,6 @@
   import yaml from 'js-yaml'
   import AceEditor from '@/components/public/AceEditor'
   import Search from '@/components/public/Search'
-  import {AXIOS} from '../http-common'
   import operations from '@/api/operation'
   export default {
     components: {
@@ -184,7 +183,7 @@
         this.search(this.filter, true)
       },
       search: function (filter, rewrite) {
-        AXIOS.get('/rules/route/', {
+        this.$axios.get('/rules/route/', {
           params: {
             service: filter
           }
@@ -227,7 +226,7 @@
             this.closeDialog()
           } else {
             rule.id = this.updateId
-            AXIOS.put('/rules/route/' + rule.id, rule)
+            this.$axios.put('/rules/route/' + rule.id, rule)
               .then(response => {
                 if (response.data) {
                   this.search(this.service, true)
@@ -236,7 +235,7 @@
               })
           }
         } else {
-          AXIOS.post('/rules/route/', rule)
+          this.$axios.post('/rules/route/', rule)
             .then(response => {
               if (response.data) {
                 this.search(this.service, true)
@@ -252,7 +251,7 @@
       itemOperation: function (icon, item) {
         switch (icon) {
           case 'visibility':
-            AXIOS.get('/rules/route/' + item.id)
+            this.$axios.get('/rules/route/' + item.id)
               .then(response => {
                 let route = response.data
                 this.handleBalance(route, true)
@@ -262,7 +261,7 @@
           case 'edit':
             let id = {}
             id.id = item.id
-            AXIOS.get('/rules/route/' + item.id)
+            this.$axios.get('/rules/route/' + item.id)
               .then(response => {
                 let route = response.data
                 this.handleBalance(route, false)
@@ -302,19 +301,19 @@
         let id = warnStatus.id
         let operation = warnStatus.operation
         if (operation === 'delete') {
-          AXIOS.delete('/rules/route/' + id)
+          this.$axios.delete('/rules/route/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
             })
         } else if (operation === 'disable') {
-          AXIOS.put('/rules/route/disable/' + id)
+          this.$axios.put('/rules/route/disable/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
             })
         } else if (operation === 'enable') {
-          AXIOS.put('/rules/route/enable/' + id)
+          this.$axios.put('/rules/route/enable/' + id)
             .then(response => {
               this.warn = false
               this.search(this.filter, false)
diff --git a/dubbo-admin-frontend/src/components/governance/WeightAdjust.vue b/dubbo-admin-frontend/src/components/governance/WeightAdjust.vue
index 6ce6fe6..4cddb00 100644
--- a/dubbo-admin-frontend/src/components/governance/WeightAdjust.vue
+++ b/dubbo-admin-frontend/src/components/governance/WeightAdjust.vue
@@ -104,7 +104,6 @@
 <script>
   import AceEditor from '@/components/public/AceEditor'
   import yaml from 'js-yaml'
-  import {AXIOS} from '../http-common'
   import Search from '@/components/public/Search'
   export default {
     components: {
@@ -164,7 +163,7 @@
         this.search(this.filter, true)
       },
       search: function (filter, rewrite) {
-        AXIOS.get('/rules/weight/', {
+        this.$axios.get('/rules/weight/', {
           params: {
             service: filter
           }
@@ -205,7 +204,7 @@
             this.closeDialog()
           } else {
             weight.id = this.updateId
-            AXIOS.put('/rules/weight/' + weight.id, weight)
+            this.$axios.put('/rules/weight/' + weight.id, weight)
               .then(response => {
                 this.search(this.service, true)
                 this.filter = this.service
@@ -213,7 +212,7 @@
               })
           }
         } else {
-          AXIOS.post('/rules/weight', weight)
+          this.$axios.post('/rules/weight', weight)
             .then(response => {
               this.search(this.service, true)
               this.filter = this.service
@@ -224,7 +223,7 @@
       itemOperation: function (icon, item) {
         switch (icon) {
           case 'visibility':
-            AXIOS.get('/rules/weight/' + item.id)
+            this.$axios.get('/rules/weight/' + item.id)
                 .then(response => {
                   let weight = response.data
                   this.handleWeight(weight, true)
@@ -232,7 +231,7 @@
                 })
             break
           case 'edit':
-            AXIOS.get('/rules/weight/' + item.id)
+            this.$axios.get('/rules/weight/' + item.id)
                 .then(response => {
                   let weight = response.data
                   this.handleWeight(weight, false)
@@ -256,7 +255,7 @@
         this.height = window.innerHeight * 0.5
       },
       deleteItem: function (warnStatus) {
-        AXIOS.delete('/rules/weight/' + warnStatus.id)
+        this.$axios.delete('/rules/weight/' + warnStatus.id)
           .then(response => {
             this.warn = false
             this.search(this.filter, false)
diff --git a/dubbo-admin-frontend/src/components/http-common.js b/dubbo-admin-frontend/src/components/http-common.js
index 6516020..3421e56 100644
--- a/dubbo-admin-frontend/src/components/http-common.js
+++ b/dubbo-admin-frontend/src/components/http-common.js
@@ -19,7 +19,7 @@ import Vue from 'vue'
 import HttpStatus from 'http-status'
 
 let instance = axios.create({
-  baseURL: 'http://localhost:8080/api/dev'
+  baseURL: '/api/dev'
 })
 
 instance.interceptors.response.use((response) => {
diff --git a/dubbo-admin-frontend/src/main.js b/dubbo-admin-frontend/src/main.js
index e43a7da..4eeb96d 100644
--- a/dubbo-admin-frontend/src/main.js
+++ b/dubbo-admin-frontend/src/main.js
@@ -24,9 +24,11 @@ import Vuetify from 'vuetify'
 import 'vuetify/dist/vuetify.min.css'
 import { store } from './store'
 import Notify from './components/public/notify'
+import { AXIOS } from './components/http-common'
 
 Vue.use(Vuetify)
 Vue.use(Notify)
+Vue.prototype.$axios = AXIOS
 
 Vue.config.productionTip = false