Commit ba73ffff authored by 祁新's avatar 祁新

fix: 修改前端脚手架工程联调配置说明

parent 7661378d
# LDP前端脚手架工程联调配置说明 # LDP前端脚手架工程联调配置说明
版本支持: `ldp-appui-example`前端应用开发脚手架 `develop``master`分支
## 脚手架默认配置说明 ## 脚手架默认配置说明
> 在开发环境中脚手架默认代理转发`/dev-api `头的请求地址。 > 在开发环境中脚手架默认代理转发`/dev-api `头的请求地址。
...@@ -36,7 +38,7 @@ proxy: { ...@@ -36,7 +38,7 @@ proxy: {
} }
``` ```
## 联调说明 ## 本地联调说明
> 通常情况下平台都需要登录才能进行接口访问, 也就是需要从授权登录页面获取到token,然后再进行操作, 那么就需要先配置 授权的相关信息。 > 通常情况下平台都需要登录才能进行接口访问, 也就是需要从授权登录页面获取到token,然后再进行操作, 那么就需要先配置 授权的相关信息。
> 如果只是服务器地址变化,则修改 `VUE_APP_PROXY_SERVER` 即可。 > 如果只是服务器地址变化,则修改 `VUE_APP_PROXY_SERVER` 即可。
...@@ -45,29 +47,51 @@ proxy: { ...@@ -45,29 +47,51 @@ proxy: {
```javascript ```javascript
// vue.config.js // vue.config.js
// 如果用框架内部的`request` 或`this.$http` 请求的话默认会拼接 /*
const proxyPath = process.env.VUE_APP_BASE_API + '/example-service' * 本地联调配置变量说明
// 如果是其他方式比如说一个资源请求,或者第三方库自带内部的请求 * proxyLocalServer 本地联调的接口地址
const otherPath = '/example-service' *
* proxyLocalPath 代理转发的路由匹配地址
* 默认项目中使用`axios`封装的接口请求默认需要拼接上process.env.VUE_APP_BASE_API
*
* proxyLocalPriority 使用其他库请求接口或者静态资源的匹配地址
* 不需要拼接process.env.VUE_APP_BASE_API
*
* rewriteTargetPath 重写的实际请求地址路径。如果需要跟路径地址转换则需要配置
* 如/api/user/userinfo 请求代理到的实际地址也是/api/user/userinfo
* 匹配的路径为/api 那么rewritePath 也需要设置为/api
*
*/
const proxyLocalServer = `http://192.168.0.106:8800`
const proxyLocalPath = process.env.VUE_APP_BASE_API + '/example-service'
const proxyLocalPriority = '/example-service'
const rewriteTargetPath = ''
// 代理设置对象 // 代理设置对象
proxy: { proxy: {
/**
* 代理设置说明
* 按照定义顺序依次进行匹配,如匹配到路径则进行转发操作。
* 优先级高的匹配需要定义在前面。
*/
// 第一种默认请求方式的代理转发 // 第一种默认请求方式的代理转发
proxyPath: { proxyLocalPath: {
target: `http://192.168.0.106:8800`, target: proxyLocalServer,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
'^' + proxyPath: '' '^' + proxyLocalPath: rewriteTargetPath
} }
}, },
// 第二种用其他请求方式的代理转发 // 第二种用其他请求方式的代理转发
otherPath: { proxyLocalPriority: {
target: `http://192.168.0.106:8800`, target: proxyLocalServer,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
'^' + otherPath: '' '^' + proxyLocalPriority: rewriteTargetPath
} }
}, },
// 默认的配置 /**
*保留默认配置请求,部分接口请求需要依赖服务器环境。
*/
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: process.env.VUE_APP_PROXY_SERVER, target: process.env.VUE_APP_PROXY_SERVER,
changeOrigin: true, changeOrigin: true,
...@@ -76,5 +100,16 @@ proxy: { ...@@ -76,5 +100,16 @@ proxy: {
} }
} }
} }
``` ```
列举几个代理匹配的例子
> 目标匹配地址: `proxy`中的`target`参数
> 重写的实际地址: `rewriteTargetPath`变量
| 实际接口地址 | 项目中访问地址 | 目标匹配地址 | 重写的实际地址 |
| --------------------------------------- | -------------------- | -------------------- | ---------------------------------- |
| `http:192.168.0.106:8800/user/userinfo` | `/user/userinfo` | `^/user` | `'/user'` |
| `http:192.168.0.106:8800/user/userinfo` | `/api/user/userinfo` | `^/api` | `''` |
| `http:192.168.0.106:8800/user/userinfo` | `/api/user/userinfo` | `^/api/user` | `'/user'` |
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment