uni-app 拦截器拦截请求处理请求返回的值为什么没有效果？

示例代码：

const BASEURL = 'http://ys.wgudu.com';  

uni.addInterceptor('request', {  
    invoke(args) {  
        args.url = BASEURL + args.url;  
    },  
    returnValue() {  
        console.log('interceptor');  
        return { data: [] };  
    }  
});

uni.request({  
        url: '/api.php/provide/vod',  
        data: {  
            ac: 'list'  
        },  
        success(data) {  
            console.log(data);  
        }  
    })

操作步骤：

拦截器中的returnValue处理返回内容不生效

预期结果：

按理说在success函数中data变量应该是一个对象里面只有一个data属性的空数组才对

实际结果：

{  
    "data": {  
        "code": 1,  
        "msg": "数据列表",  
        "page": 1,  
        "pagecount": 2672,  
        "limit": "20",  
        "total": 53432,  
    },  
    "statusCode": 200,  
    "header": {  
        "connection": "keep-alive",  
        "content-encoding": "gzip",  
        "content-type": "text/html;charset=utf-8",  
        "date": "Fri, 29 Mar 2024 01:46:18 GMT",  
        "server": "nginx",  
        "transfer-encoding": "chunked",  
        "vary": "Accept-Encoding"  
    },  
    "cookies": [],  
    "errMsg": "request:ok"  
}

bug描述：

通过拦截器拦截请求，处理请求结果返回的值，按理说在success函数中data变量应该是一个对象里面只有一个data属性的空数组才对，为什么拦截器returnValue处理返回的结果无效？

wuwangju 1楼•3 天前

可以在success中修改 const BASEURL = ‘http://ys.wgudu.com’; uni.addInterceptor(‘request’, { invoke(args) { args.url = BASEURL args.url; }, success(args){ console.log(“success”,args); args.data = [] },
你的请求类型是XMLHttpRequest，如果尝试直接修改XMLHttpRequest的数据，你想把它改为空，会报错它只是个只读的 Cannot set property response of #<XMLHttpRequest> which has only a getter 如果是promise，则可以修改

h691938207 2楼•3 天前

+1
望解决

h691938207 3楼•3 天前

在 uni-app 中使用拦截器拦截请求并处理请求返回的值时，如果发现没有效果，可能是由于以下几个原因导致的：

1. 拦截器未正确注册

确保你已经在 uni-app 的请求拦截器中正确注册了拦截器。通常，你可以使用 uni.addInterceptor 方法来添加拦截器。

uni.addInterceptor('request', {
  invoke(args) {
    // 请求前的处理
    console.log('请求拦截器 - invoke', args);
  },
  success(res) {
    // 请求成功后的处理
    console.log('请求拦截器 - success', res);
    // 你可以在这里处理返回的数据
    res.data = res.data + ' - 修改后的数据';
    return res;
  },
  fail(err) {
    // 请求失败后的处理
    console.log('请求拦截器 - fail', err);
  },
  complete(res) {
    // 请求完成后的处理
    console.log('请求拦截器 - complete', res);
  }
});

2. 拦截器处理逻辑问题

确保你在拦截器中的处理逻辑是正确的。例如，如果你在 success 回调中修改了返回的数据，确保你返回了修改后的数据。

success(res) {
  // 修改返回的数据
  res.data = res.data + ' - 修改后的数据';
  return res;
}

3. 拦截器未生效

确保你的拦截器在请求发出之前已经注册。如果拦截器在请求发出之后才注册，那么拦截器不会生效。

4. 请求未使用 `uni.request`

uni.addInterceptor 只能拦截通过 uni.request 发起的请求。如果你使用的是其他方式（如 axios 或其他第三方库）发起请求，拦截器不会生效。

5. 拦截器作用域问题

确保你在正确的作用域内注册了拦截器。如果你在某个页面或组件中注册了拦截器，确保该页面或组件已经加载，拦截器才能生效。

6. 拦截器未正确处理异步操作

如果拦截器中涉及到异步操作（如异步请求），确保你正确处理了异步操作。例如，使用 async/await 或返回 Promise。

success: async (res) => {
  // 异步处理返回的数据
  const modifiedData = await someAsyncFunction(res.data);
  res.data = modifiedData;
  return res;
}

7. 拦截器未处理返回值

确保你在拦截器中正确处理了返回值。如果你在 success 或 fail 回调中没有返回正确的值，可能会导致拦截器没有效果。

示例代码

以下是一个完整的示例代码，展示了如何使用 uni.addInterceptor 拦截请求并处理返回的数据：

uni.addInterceptor('request', {
  invoke(args) {
    console.log('请求拦截器 - invoke', args);
  },
  success(res) {
    console.log('请求拦截器 - success', res);
    // 修改返回的数据
    res.data = res.data + ' - 修改后的数据';
    return res;
  },
  fail(err) {
    console.log('请求拦截器 - fail', err);
  },
  complete(res) {
    console.log('请求拦截器 - complete', res);
  }
});

// 发起请求
uni.request({
  url: 'https://example.com/api',
  success(res) {
    console.log('请求成功', res.data);
  },
  fail(err) {
    console.log('请求失败', err);
  }
});