react native 0.595 上传图片 update之后获取返回blob而不是文本

本文链接：https://blog.youkuaiyun.com/qq_36538734/article/details/90214846

本文介绍了一个React Native应用程序在升级后遇到的fetch API异步问题，并提供了一种解决方案，即将上传图片的函数从Promise改写为async/await语法，以获得预期的响应效果。

原来写法
function uploadImage (url,params){
        return new Promise(function (resolve, reject) {
            console.log(params)
            let formData = new FormData();
            // for (let i =0; i<params.length;i++){
                let file = {uri:params , type: 'application/octet-stream', name: 'image.jpg'};
                formData.append('file',file );
            // }
            fetch(url, {
                method: 'POST',
                headers: {
                    'Content-Type': 'multipart/form-data;charset=utf-8',
                },
                body: formData,
            }).then((response) =>{
                // response.json()
                console.log(response)
            }).then((responseData)=> {
                    console.log('uploadImage', responseData);
                    resolve(responseData);
                })
                .catch((err)=> {
                    console.log(err);
                    reject(err);
                });
        });
    }

得到的结果是

{
    "type": "default",
    "status": 200,
    "ok": true,
    "headers": {
        "map": {
            "x-xss-protection": "1",
            "set-cookie": "jwt=eyJhbGciOiJIUzI1NiJ9.eyJ1c2VyLWNvZGUiOiJyb290LXVzZXIiLCJleHAiOjE1NTU0MjY0Mjl9.UaHzsIil8t9HtgrBF8JN0c2W-eIIkDEmb6GvO9Do0-A;Expires=Tue, 16 Apr 2019 14:53:49 +0000;Path=/;HttpOnly;SameSite=Strict",
            "connection": "keep-alive",
            "content-length": "360",
            "content-type": "application/json;charset=utf-8",
            "date": "Tue, 16 Apr 2019 13:53:49 GMT",
            "server": "nginx/1.15.10"
        }
    },
    "url": "***",
    "_bodyInit": {
        "_data": {
            "size": 360,
            "offset": 0,
            "blobId": "3397402a-12dd-4dd9-8980-90924aeb416d"
        }
    },
    "_bodyBlob": {
        "_data": {
            "size": 360,
            "offset": 0,
            "blobId": "3397402a-12dd-4dd9-8980-90924aeb416d"
        }
    }
}

这并不是我期望得到的结果，原因是因为RN版本升级feach 重写了异步你将上传函数改成

async function uploadImage (url,params){
        console.log(params)
        let formData = new FormData();
        // for (let i =0; i<params.length;i++){
        let file = {uri:params , type: 'application/octet-stream', name: 'image.jpg'};
        formData.append('file',file );
        // }
        let response = await fetch(url, {
            method: 'POST',
            headers: {
                'Content-Type': 'multipart/form-data;charset=utf-8',
            },
            body: formData,
        })
        let responseJson = await response.json();
        console.log(responseJson)

}

如此便能得到你想要的效果

详情官网 https://facebook.github.io/react-native/docs/network