vuejs2 - Vuejs 中的每一秒 axios 调用都很慢
问题描述
我正在将 Vuejs 2.6.11 与 Vuex 3.2.0 和 axios v0.19.2 一起使用,并且有一个不同的特殊问题,我也在这个 stackoverflow 问题中报告过:Every Second Vuex Commit to the same action is slow
我已经消除了后端不是问题,因为我正在从 Angular 1 应用程序和其他地方调用相同的后端端点,并且在第一次调用后所有调用都始终快速没有问题。
我还测试了 axios 调用,而没有直接在组件中使用 vuex,但我遇到了完全相同的问题。
下面是我本地组件中的 axios 调用。
async getDataLocal() {
// this.showCollapse = !this.showCollapse
// this.$store.dispatch('getData', {TableId: this.TableId, ViewId: this.ViewId, PageNumber: this.PageNumber, PageSize: this.PageSize })
await this.$axios
.$get(
'/scad/TablesV2/' +
this.TableId +
'/data?ViewId=' +
this.ViewId +
'&PageNumber=' +
this.PageNumber +
'&PageSize=' +
this.PageSize
)
.then(
response => {
this.items = response
},
error => {
reject(error)
}
)
},
这是 Chrome 中网络流量的结果。我的通话间隔大约 1 秒。
下面是我的 vuex 操作的代码。
return new Promise((resolve, reject) => {
let ParameterList = payload.ParameterList || {}
vuexContext.commit('loading', true)
this.$axios
.$get(
'/scad/tablesv2/' +
payload.TableId +
'/data.json?ViewId=' +
payload.ViewId +
'&PageNumber=' +
payload.PageNumber +
'&PageSize=' +
payload.PageSize,
{
params: { ParameterList: payload.ParameterList },
crossdomain: true,
withCredentials: true
}
)
.then(
response => {
const result = {
TableId: payload.TableId,
ViewId: payload.ViewId,
PageNumber: payload.PageNumber,
PageSize: payload.PageSize,
data: response
}
vuexContext.commit('getData', result)
resolve(result)
},
error => {
vuexContext.commit('setError', error.response)
reject(error)
}
)
vuexContext.commit('loading', false)
})
这是 Chrome 中到同一端点的网络流量。再次间隔 1 秒
这是从 Angular 1 应用程序到同一端点的网络流量。
我搜索了互联网,但找不到任何相关内容。
解决方案
我在使用 axios 处理 vue.js 应用程序时遇到了同样的问题。
我发现延迟是由于在 Windows 操作系统上基于 Chromium 的浏览器中使用 localhost 造成的。查看每个网络请求的详细信息时,您可以看到每隔一个 axios 请求就执行一次 DNS 查找。
如果您将地址栏中的 localhost 替换为 127.0.0.1,则延迟将消失。
推荐阅读
- swift - 将 viewDidLoad() 或 ViewDidAppear() 中的变量传递给按钮操作
- php - 谷歌地图 api 标记、sql 和 xml
- rest - Servicenow 与 SAP 的集成
- c - 为什么我在 C 中遇到分段错误?
- excel - Excel VBA宏读取具有不同文本的一列
- odata - sap.m.table 未更新
- google-bigquery - BigQuery 是否可以使用 aes_decrypt 函数?
- botframework - 部署自定义网络聊天机器人框架
- keras - keras:提取一层作为模型
- java - 使用 FF 54 从 Selenium 2.47.0 迁移到 Selenium 3.13.0 后出现错误