配置项目（一）—

配置项目——vue.config.js

第一步：查看接口文档的字段和端口号

第二步：在vue.config.js中，proxy里面定义

自定义名字/devStatusApi、target地址、pathRewrite同名字

第三步：在文件src/api/serviceConfig.js中，配置和导出devStatusApi

let devStatusApi,
if (process.env.NODE_ENV === 'development'){devStatusApi = '/devStatusApi',
}else{devStatusApi = '/192.168.105.66:9091',
}export {devStatusApi }

第四步：新建文件src/api/operationalData/devStatusApi.js文件，配置接口字段 /devopes/v1/Computer

import request from 'service';
import {devStatusApi
} from 'serviceConfig';export default {// 获取计算机信息getAllComputer(props) {return request.get(`${devStatusApi}/devopes/v1/Computer`)},// 启动计算机startComputer(props) {return request.put(`${devStatusApi}/devopes/v1/StartComputer/${props.id}`)},// 关闭计算机ShutdownComputer(props) {return request.put(`${devStatusApi}/devopes/v1/ShutdownComputer/${props.id}`)},// 重启计算机RebootComputer(props) {return request.put(`${devStatusApi}/devopes/v1/RebootComputer/${props.id}`)},// 启动软件StartSoftware(props) {// return request.put(`${devStatusApi}/devopes/v1/StartSoftware/${props.id}/${props.ids}`)return request.put(`${devStatusApi}/devopes/v1/StartSoftware/${props.id}`, props.data)},// 关闭软件CloseSoftware(props) {return request.put(`${devStatusApi}/devopes/v1/CloseSoftware/${props.id}/${props.ids}`, props.data)},// 重启软件RestartSoftware(props) {return request.put(`${devStatusApi}/devopes/v1/RestartSoftware/${props.id}/${props.ids}`, props.data)},//  部署软件deploymentSoft(props) {return request.put(`${devStatusApi}/devopes/v1/DeploySoftware/${props.id}`, props.data)},// deploymentSoft(id, props) {//   console.log(id)//   console.log(id.id)//   return request.put(`${devStatusApi}/devopes/v1/DeploySoftware/${id.id}`, props)// }
}

附：接口文档

接口-获取计算机信息

url     devops/v1/computer
方法    GET
输入    无
输出    所有计算机信息{code : 200,msg : "获取成功",data : [{id : 123456,name : "电脑",user : "administrator",description : "XXX电脑",ip : "127.0.0.1",osType : "Windows",osVer : "Win7",totalMemory : 8388608, /*单位MB*/cpuUsage : 0.95,memoryUsage : 123456 /*单位MB*/},{id : 123457,name : "电脑",user : "administrator",description : "XXX电脑",ip : "127.0.0.1",osType : "MAC OS",osVer : "mac os 11",totalMemory : 8388608, /*单位MB*/cpuUsage : 0.95,memoryUsage : 123456 /*单位MB*/}]}

接口-启动计算机

url     devops/v1/startcomputer/:computerId
方法    PUT
输入    计算机id
输出    结果{code : 200,msg : "启动成功",data : {}}

接口-启动软件

url     devopes/v1/StartSoftware/:computerId
方法    PUT
输入    计算机id{name:"XX软件",launcharPath:"XSIMd.exe",   // 启动参路径launcharParam: "-config config/AFSeatintegrationPlugin.config -appname '席位集成后台'",  // 启动参数processName:"XSIMd.exe"  // 进程名称}
输出    结果{code : 200,msg : "启动成功",data : {}}

接口-关闭软件

url     devopes/v1/CloseSoftware/:computerId/:softwareId
方法    PUT
输入    计算机id{name:"XX软件",launcharPath:"XSIMd.exe",launcharParam: "-config config/AFSeatintegrationPlugin.config -appname '席位集成后台'",processName:"XSIMd.exe"}
输出    结果{code : 200,msg : "关闭成功",data : {}}

1.0、get请求方式

第五步：在inde.vue界面中进行使用

import devStatusApi from "api/operationalData/devStatusApi"
let {getAllComputer} = devStatusApi

第六步：在methods中定义接口使用方法getAllComputer（）

getAllComputerInfo(){getAllComputer().then((res)=>{console.log(res)})
}

第七步：在created里进行调用

created(){this.getAllComputerInfo()
}

1.1.1、put请求方式-1个参数id

第一步：查看接口文档的字段和端口号
第二步：在vue.config.js中，proxy里面定义
自定义名字/devStatusApi、target地址、pathRewrite同名字
第三步：在serviceConfig.js配置和导出devStatusApi

以上相同
第四步：新建devStatusApi.js文件配置接口字段 /devopes/v1/StartComputer/

配置项目（一）——vue.config.js相关推荐

vue.config.js 配置参考
文章目录属性说明常用完整配置属性说明 vue.config.js是一个可选的配置文件,如果项目的 (和 package.json 同级的) 根目录中存在这个文件,那么它会被 @vue/cli-s ...
vue.config.js ：配置webpack（文件传输大小受限）The following asset(s) exceed the recommended size limit (244 KiB)
asset size limit: The following asset(s) exceed the recommended size limit (244 KiB). This can impac ...
Vue.js CLI4 Vue.config.js标准配置（最全注释）
前言: Vue.js CLI工具不知不觉发展到了4.0时代,CLI给人最直白的感受是没有了build文件夹跟config文件夹,所有的配置都在Vue.config.js完成.那么该文件的配置至关重要 ...
Vue Cli3 项目 vue.config.js 配置
Vue Cli3 项目 vue.config.js 配置配置优化一.js文件最小化处理二.分割代码三.图片资源压缩四.开启gzip压缩先看一下优化配置之前的文件大小通过vue-cli3脚 ...
(三)01 -Vue项目打包发布移动App——vue.config.js中配置相对路径publicPath为空字符串在public中添加HBuilderX的打包配置文件manifest.json
Vue 项目打包发布移动 App--npm run build打包 & vue.config.js文件中配置相对路径publicPath为空字符串 & 在 public中添加HBuil ...
Vue项目全面解析vuecil3/vuecil4的vue.config.js等常用配置
前端变化日新月异,层出不穷,公司原项目使用vuecil2版本开发,elementUI等一系列库版本太低,也脱离世界很久远了,新版本库需要webpack4等环境,而老版本配置起来bug很多,在使用过程中 ...
vue项目升级(01)：全面解析vuecil3/vuecil4的vue.config.js等常用配置
前言前端变化日新月异,层出不穷,公司原项目使用vuecil2版本开发,elementUI等一系列库版本太低,也脱离世界很久远了,新版本库需要webpack4等环境,而老版本配置起来bug很多,在使用 ...
Vue项目跨域解决方案与 vue.config.js 配置解析
为什么会出现跨域? 出于浏览器的同源策略限制.同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响.可以说 ...
vue cli3.3 以上版本配置vue.config.js
// vue.config.js 配置说明 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions // 这 ...

配置项目（一）——vue.config.js