uni-app接口请求时后端返回数据如果超过180kb就会出现问题

发布于 1周前 作者 itying888 来自 Uni-App

uni-app接口请求时后端返回数据如果超过180kb就会出现问题
接口请求时后端返回数据如果超过180kb就会出现接口返回的数据只有一部分的问题，数据量越大越容易出现。请问你们遇到过没有呢？如何解决呢？现在我是使用接口获取pdf文件流的时候出现的问题了。pdf基本会超过180kb，99.9%的概率只返回20%的数据，后端是.netcore

Harmonyos Next教程
10 回复

pdf直接用线上链接不行吗


需要在这个网页里面使用pdfjs预览，后端的pdf又不在这个域名下面会出现跨域，所以就叫后端返回的文件流

回复 靐齉齾麤龖龗: 那让后端处理下跨域的不就好了

回复 蔡cai: 毕竟是医院的项目，不能让跨域啊，不然容易出问题

回复 靐齉齾麤龖龗: 好吧【哭笑】

回复 蔡cai: 我在apifox上面点又很快，在谷歌浏览器上点就不行。。。我换个浏览器试试

回复 靐齉齾麤龖龗: 加个防盗链呢

回复 蔡cai: 只能让后端看看了，哎，从来没遇到过这种的。。。

回复 靐齉齾麤龖龗: 行

在处理uni-app接口请求时，如果后端返回的数据量超过180kb出现问题，可能是由于多个原因导致的，例如前端处理大数据的能力受限、网络问题、内存不足、或者数据解析错误等。以下是一些代码案例，可以帮助你更好地处理这种情况，确保应用能够稳定处理大数据量的返回。

1. 使用Blob处理大数据

如果后端返回的是二进制数据，可以考虑使用Blob对象来处理。这样可以避免直接操作大字符串，减少内存占用。

uni.request({
    url: 'https://example.com/api/large-data',
    responseType: 'arraybuffer', // 指定返回数据类型为ArrayBuffer
    success: (res) => {
        const blob = new Blob([res.data], { type: 'application/octet-stream' });
        const url = URL.createObjectURL(blob);
        // 你可以使用url来处理数据，例如下载或显示
        console.log(url);
        // 释放URL对象
        URL.revokeObjectURL(url);
    },
    fail: (err) => {
        console.error(err);
    }
});

2. 分页请求数据

如果后端支持分页，可以将大数据拆分成多个小数据包进行请求。

let page = 1;
const pageSize = 1000; // 每页数据量

function fetchData() {
    uni.request({
        url: `https://example.com/api/large-data?page=${page}&size=${pageSize}`,
        success: (res) => {
            const data = res.data;
            // 处理数据
            console.log(data);
            if (data.length > 0) {
                page++;
                fetchData(); // 递归请求下一页数据
            }
        },
        fail: (err) => {
            console.error(err);
        }
    });
}

fetchData();

3. 使用WebSocket处理大数据流

如果数据量非常大，可以考虑使用WebSocket进行流式传输。

const ws = uni.connectSocket({
    url: 'wss://example.com/socket',
    success: () => {
        console.log('WebSocket连接成功');
        ws.send({ action: 'request_large_data' });
    },
    fail: (err) => {
        console.error('WebSocket连接失败', err);
    }
});

ws.onMessage((res) => {
    const chunk = res.data;
    // 处理数据块
    console.log(chunk);
});

ws.onClose((res) => {
    console.log('WebSocket连接关闭', res);
});

ws.onError((err) => {
    console.error('WebSocket错误', err);
});

总结

以上代码案例展示了如何处理大数据量的情况，包括使用Blob处理二进制数据、分页请求数据以及使用WebSocket进行流式传输。你可以根据具体的需求和后端API的支持情况选择合适的方法。

回到顶部