fix: container can't upload

Author: KFCFans

src/components/views/ContainerManager.vue

@@ -26,8 +26,7 @@
                 :title="$t('message.newContainer')"
                 :visible.sync="dialogVisible"
                 width="50%"
-                v-on:close="closeEdit"
-                :before-close="handleClose">
+                v-on:close="closeEdit">
                 <el-form ref="form" :model="form" label-width="150px" class="genTable" label-position='left'>
                     <el-form-item :label="$t('message.containerName')">
                         <el-input v-model="form.containerName"></el-input>
@@ -59,6 +58,7 @@
                         :file-list = "fileList"
                         :on-success="onSuccess"
                         :action="`${requestUrl}/container/jarUpload`"
+                        :headers="headersObj"
                         multiple>
                     <i class="el-icon-upload"></i>
                     <div class="el-upload__text">Drag the file here, or <em>click on Upload</em></div>
@@ -79,6 +79,7 @@
 
 <script>
     import baseUrl from '../../main';
+    import {Message} from "element-ui";
 
     let ws;
     export default {
@@ -104,11 +105,17 @@
                 containerList:[],
                 logs:[],
                 requestUrl :"",
-                fileList: []
+                fileList: [],
+
+                headersObj: {
+                  Power_jwt: undefined,
+                  AppId: undefined
+                }
             }
         },
         methods: {
             onSubmit() {
+              const that = this
                 // 接口参数
                 let data = {
                     appId:this.appId,
@@ -124,19 +131,18 @@
                    data.sourceInfo = this.sourceInfo;
                    data.sourceType = 'FatJar'
                }
-               this.axios.post("container/save",data).then(()=>{
-                   let appId = window.localStorage.getItem("Power_appId");
-                   this.axios.get("/container/list?appId=" + appId).then(res => {
-                       this.$message.info(this.$t('message.success'));
-                       // 恢复默认表单
-                       this.dialogVisible = false;
-                       this.form.containerName = '';
-                       this.gitForm = {};
-                       this.sourceInfo = '';
-                       this.id = '';
-                       // 刷新容器表单
-                       this.containerList = res;
-                   });
+               this.axios.post("container/save",data).then(res=>{
+                 console.log('container save result:' + JSON.stringify(res))
+
+                 Message.success("SUCCESS");
+                 // 恢复默认表单
+                 that.dialogVisible = false;
+                 that.form.containerName = '';
+                 that.gitForm = {};
+                 that.sourceInfo = '';
+                 that.id = '';
+
+                 that.listContainers()
                });
             },
             // 文件上传成功后 修改来源信息
@@ -145,7 +151,7 @@
             },
             deleteItem(item,index){
                 let appId = window.localStorage.getItem("Power_appId");
-                this.flyio.get("/container/delete?containerId="+ item.id+'&appId='+appId).then(res => {
+                this.axios.get("/container/delete?containerId="+ item.id+'&appId='+appId).then(res => {
                     console.log(res);
                     this.containerList.splice(index,1);
                     this.$message.info(this.$t('message.success'));
@@ -194,7 +200,7 @@
             },
             listOfItem(item){
                 let appId = window.localStorage.getItem("Power_appId");
-                this.flyio.get("/container/listDeployedWorker?containerId="+ item.id+'&appId='+appId).then(res => {
+                this.axios.get("/container/listDeployedWorker?containerId="+ item.id+'&appId='+appId).then(res => {
                     if(res.data.data){
                         this.logs = res.data.data.split('\n');
                         this.arrangeTitle = this.$t('message.deployedWorkerList');
@@ -215,18 +221,24 @@
                 }else {
                     this.requestUrl = baseUrl;
                 }
-            }
+            },
+
+          listContainers() {
+            let appId = window.localStorage.getItem("Power_appId");
+            this.axios.get("/container/list?appId=" + appId).then(res => {
+              console.log(res);
+              if(res.data.success){
+                this.containerList = res.data.data;
+              }
+            });
+          }
         },
         mounted() {
             this.calculateRequestUrl();
+            this.listContainers();
 
-            let appId = window.localStorage.getItem("Power_appId");
-            this.flyio.get("/container/list?appId=" + appId).then(res => {
-                console.log(res);
-                if(res.data.success){
-                    this.containerList = res.data.data;
-                }
-            });
+            this.headersObj.AppId = window.localStorage.getItem("Power_appId")
+            this.headersObj.Power_jwt = window.localStorage.getItem("Power_jwt")
         }
     }
 </script>

src/components/views/ContainerTemplate.vue

@@ -43,7 +43,7 @@
         methods: {
             onSubmit() {
                  console.log('submit!');
-                this.flyio.post("/container/downloadContainerTemplate", this.form
+                this.axios.post("/container/downloadContainerTemplate", this.form
                 ,{
                     responseType:'blob'//服务器返回的数据类型
                 }).then((res)=>{

src/main.js

@@ -10,7 +10,6 @@ import './iconfont.css';
 
 // axios 负责统一拦截处理 ResultDTO，fly 负责处理不需要拦截的请求
 import axios from 'axios';
-import flyio from 'flyio';
 import router from "./router";
 import store from "./store";
 import common from "./common";
@@ -27,10 +26,6 @@ Vue.prototype.common = common;
 Vue.prototype.axios = axios;
 axios.defaults.baseURL = baseURL;
 axios.defaults.timeout = timeout;
-/* ******* fly.io config ******* */
-Vue.prototype.flyio = flyio;
-flyio.config.baseURL = baseURL;
-flyio.config.timeout = timeout;
 
 Vue.config.productionTip = false;
 
@@ -41,32 +36,14 @@ new Vue({
   render: h => h(App),
 }).$mount('#app');
 
-//请求发送拦截，没有 appId 要求重新 "登录"
+// 请求拦截，全局添加 JWT 和 APPID 信息
 axios.interceptors.request.use((request) => {
 
   request.headers['Power_jwt'] = window.localStorage.getItem("Power_jwt");
   if (request.headers['AppId'] == null) {
     request.headers['AppId'] = window.localStorage.getItem("Power_appId");
   }
 
-  // let url = request.url;
-  // let isListAppInfo = url.search("/appInfo/list") !== -1;
-  // let isAppRegister = url.search("/appInfo/save") !== -1;
-  // let isAssertAppInfo = url.search("/appInfo/assert") !== -1;
-  //
-  // if (isListAppInfo || isAppRegister  || isAssertAppInfo) {
-  //   return request;
-  // }
-
-  /*
-  TODO: 先注释原来的全局 appId 登录拦截逻辑，后续考虑兼容性问题
-  let appId = store.state.appInfo.id;
-  if (appId === undefined || appId === null) {
-    router.push("/");
-    // remove no appId warn due to too much user report this is a bug...
-    return Promise.reject();
-  }
-   */
   return request;
 
 }, function (error) {
@@ -84,6 +61,13 @@ axios.interceptors.response.use((response) => {
     return
   }
 
+  // 值示例 /user/query
+  const req_url = response.config.url
+  if (req_url.startsWith('/container')) {
+    console.log("skip intercept container's request")
+    return response
+  }
+
   if (response.data.success === true) {
     return response.data.data;
   }