【前端-架构管理】请求规范-Path

[ly525]

从后端服务迁移，思考前端请求层规范应该如何写？

比如请求
request('https://www.baidu.com/user-center-xxx/mini-app/auth')
request('https://www.baidu.com/user-center-yyy/mini-app/auth')
request('https://www.baidu.com/user-center-zzz/mini-app/auth')

1. host 不用写，配置 baseURL 即可，即

✅
request.config({ baseURL: 'https://www.baidu.com'})
=> 
request.config({ baseURL: isDev ? `https://dev-www.baidu.com` : `https://www.baidu.com` })

request('/user-center-xxx/mini-app/auth')
request('/user-center-yyy/mini-app/auth')
request('/user-center-zzz/mini-app/auth')

原因：

• 减少Host 拼接，可以少些代码
• 不同环境，Host不同 ，应该收归至配置baseURL 的地方写一次即可
• 待补充

2. 请求path 需写完整，尽量减少拼接形式的，即

✅
const url = isXXX ? `/user-center-xxx/mini-app/auth` : '/user-center-yyy/mini-app/auth'
request(url)

❎
const service = isXXX ? `/user-center-xxx/` : '/user-center-yyy/'
request(service + 'mini-app/auth')

• 便于检索，后端同学一般提供接口请前端排查的时候，多是提供 /user-center-xxx/mini-app/auth 这种形式的（没有host的完整path）

3. 请求协议使用自适应协议即可

#228

✅
request.config({ baseURL: '//www.baidu.com'})

❌
request.config({ baseURL: location.protocal  + 'www.baidu.com'})

4. host 相关变量，末尾请不要携带 /

具体可以参考 window.location.host，因为 / 是属于 window.location.pathname 的

✅
{
  google: '//www.google.com'
}

❌
{
  google: '//www.google.com/'
}