账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    用 axios 对同一个 URL 同时发起多个请求(不同参数),返回的 data 错乱
    20
    0

    前端 Vue,后端 Java。后端生成 API 供前端调用。
    所有 API 的 URL 地址是同一个,只是对不同的 API 传递不同的参数。

    参数格式如下:

    let data = {
      'username': 'admin',
      'password': 'admin',
      'methodName': 'method1',
      'boId': 'bo1',
      'returnType': 'json',
      'parameters': 'param1'
    };

    usernamepasswordreturnType 是固定的,methodNameboIdparameters 会随着不同的 API 而变化。

    前端用 axios 调用。当同时调用三个API时(URL 相同,params 不同),返回的数据会错乱。

    axios.get(apiUrl, {params: data1}).then((response) => {
      myData1 = response.data
    })
    
    axios.get(apiUrl, {params: data2}).then((response) => {
      myData2 = response.data
    })
    
    axios.get(apiUrl, {params: data3}).then((response) => {
      myData3 = response.data
    })

    期望结果:

    myData1: {'data': 'A'}
    myData2: {'data': 'B'}
    myData3: {'data': 'C'}

    但实际结果是,有时候可以得到期望结果,有时候返回的数据却会错乱,比如 myData1myData2 相互调包,chrome 查看 response 也是错乱的

    // response 1、2 也相互调包
    myData1: {'data': 'B'}
    myData2: {'data': 'A'}
    myData3: {'data': 'C'}

    或者是 myData1myData2 返回相同值:

    // response 1、2 返回相同值
    myData1: {'data': 'A'}
    myData2: {'data': 'A'}
    myData3: {'data': 'C'}

    总结一下,我的期望结果是这样的:

    参数(params: data) 实际请求URL (Request URL) 响应(Response) 返回值 (myData)
    data1 Request URL1 Response1 myData1
    data2 Request URL2 Response2 myData2
    data3 Request URL3 Response3 myData3

    但实际调用会经常发生以下两种错误情况:

    一、其中两个API响应和返回值调包

    参数(params: data) 实际请求URL (Request URL) 响应(Response) 返回值 (myData)
    data1 Request URL1 Response2 myData2
    data2 Request URL2 Response1 myData1
    data3 Request URL3 Response3 myData3

    二、其中两个API响应和返回值相同

    参数(params: data) 实际请求URL (Request URL) 响应(Response) 返回值 (myData)
    data1 Request URL1 Response1 myData1
    data2 Request URL2 Response1 myData1
    data3 Request URL3 Response3 myData3

    但当以上3个API分别调用时,每次都可以返回正确结果。

    试过 axios.all \ promise.all ,不行。


    请问导致这种问题的原因是什么?前端还是后端的问题?
    是不是同一个 URL 的原因?但后端是用一个现成的框架,只能用这种API形式。
    有没有办法解决这个问题?谢谢。

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部