uni-app 【报Bug】uni.uploadFile(OBJECT) API 成功回调里的data数据被转为JSON字符串的原因

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

uni-app 【报Bug】uni.uploadFile(OBJECT) API 成功回调里的data数据被转为JSON字符串的原因

产品分类

uniapp/小程序/微信

开发环境信息

项目 信息
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 Windows [版本 10.0.22000.1696]
HBuilderX类型 Alpha
HBuilderX版本号 3.8.7
第三方开发者工具版本号 1.06.2306281 Windows 64
基础库版本号 3.0.0
项目创建方式 HBuilderX

示例代码:

const uploadTask = uni.uploadFile({  
    url: "xx/userinfo/records/qjkbeashqgdgodx", // 文件上传接口  
    filePath: avatarUrl,  
    name: "avatarUrl",  
    header: { Authorization },  
    success: (uploadFileRes) => {  
        console.log("uploadTask-success", uploadFileRes)  
        // 这里的 uploadFileRes.data 类型为什么是JSON 字符串?后端返回的是JSON 对象呀  
        // const resData = JSON.parse(uploadFileRes.data)  
    },  
    fail: (err) => {  
        console.log("uploadTask-fail", err)  
    },  
})

操作步骤:

uni.uploadFile() 请求一个后端返回 json对象的接口,查看 uni.uploadFile() 成功回调里的 data 里的数据类型。

预期结果:

json对象

实际结果:

json字符串

bug描述:

同一个后端接口,我用 html 写了一个input 上传文件,和uni-app写小程序用 uni.uploadFile 上传文件成功后返回的数据类型不同,后端接口返回的是json数据。html上传完收到的也是json对象,而 uni.uploadFile 成功回调里参数的 data 是json字符串。


2 回复

对我也碰到这个问题了


uni-app 中使用 uni.uploadFile(OBJECT) API 时,如果遇到成功回调里的 data 数据被自动转为 JSON 字符串的情况,这通常是由于后端服务器返回的数据格式以及前端处理方式的综合结果。uni.uploadFile 本身并不负责解析或转换返回的数据,它仅仅是将原始响应文本传递给回调函数的 data 参数。

如果后端服务器返回的是 JSON 格式的字符串,而前端开发者期望得到的是一个 JavaScript 对象,那么就需要手动解析这个 JSON 字符串。以下是一个处理这种情况的代码示例:

uni.uploadFile({
    url: 'https://example.com/upload', // 上传接口
    filePath: tempFilePaths[0],
    name: 'file',
    formData: {
        user: 'test'
    },
    success: (uploadFileRes) => {
        console.log('上传成功:', uploadFileRes);
        
        // 假设服务器返回的是 JSON 格式的字符串
        const responseText = uploadFileRes.data;
        
        try {
            // 尝试解析 JSON 字符串
            const responseData = JSON.parse(responseText);
            console.log('解析后的数据:', responseData);
            
            // 在这里处理解析后的数据
            // 例如,根据返回的数据执行某些逻辑
        } catch (error) {
            // 如果解析失败,可能是因为返回的不是有效的 JSON
            console.error('解析 JSON 失败:', error);
        }
    },
    fail: (error) => {
        console.error('上传失败:', error);
    }
});

在上述代码中,uploadFileRes.data 包含了服务器返回的原始响应文本。通过 JSON.parse() 方法,我们尝试将这段文本解析为一个 JavaScript 对象。如果解析成功,responseData 将包含解析后的对象,可以进一步处理。如果解析失败(例如,因为返回的文本不是有效的 JSON),则会捕获到一个异常,并在控制台中输出错误信息。

请注意,如果后端服务器返回的是非 JSON 格式的数据(如纯文本、HTML 或其他),则不应尝试使用 JSON.parse() 进行解析,而应该根据返回数据的实际格式进行相应处理。

总之,uni.uploadFile 成功回调里的 data 数据被转为 JSON 字符串的说法可能是一个误解,实际上,这是前端开发者需要根据后端返回的数据格式进行适当处理的问题。上述代码示例展示了如何正确解析和处理服务器返回的 JSON 格式数据。

回到顶部