这是我在 React 项目中做类似事情时所做的事情。

1) 假设如下：

• 我们从 API 得到的响应不是 BASE64 编码的
• 请求中未指定 responseType
• 一个 png 是响应

响应数据将如下所示：

与看起来不友好的角色。

2) 更改 responseType

• 在请求中设置responseType: "arraybuffer"

响应现在将在响应数据中包含 arrayBuffer

然后可以通过以下方式将响应转换为 base64

let base64ImageString = Buffer.from(response.data, 'binary').toString('base64')

如果你想在 img 标签上显示它，那么在 Base64 字符串前添加data:image/png;base64

let srcValue = "data:image/png;base64,"+base64ImageString

但是在您的情况下，您似乎只是将文件名作为字符串而不是文件本身。

如果您的应用程序中有图像（资产文件夹或其他任何内容），您可以像这样显示它

<img src={`assets/${coverImage}`}>

否则图像应该以 base64 格式从 API 发送，然后您可以像这样简单地显示它。

data = "base64 image"
<img src={`data:image/jpeg;base64,${data}`} />

为什么不将您需要的 imege 视为 Bese64 字符串？
如果您能够将 png 图像转换为 Base64 字符串（显然是服务器端），您可以轻松地在 img 标签中使用它作为 src 属性值。

在我的情况下也是如此。"react": "17.0.1", "react-native": "0.64.2",
我的回复包含 png 图像（没有 URL，没有 base64），我将我的回复转换为 base64，如下所示，

const makeApiRequest = async()=>{
    try {
        const response = await apiCaller('ProfileImage',{"thisID": "ABCD","thatID": "1234"})
        if(response.status === 200){
            const dataResponse = await response.blob()
            let blob = new Blob([dataResponse], { type: "text/plain" });
            var reader = new FileReader();
            reader.readAsDataURL(blob);
            reader.onloadend = function () {
               var base64String = reader.result; 
               setImageFromAPI(base64String.substr(base64String.indexOf(', ') + 1)); //Setting response to hook
            }
        }else{
            console.log(response.status)
        }
    } catch (error) {
        console.log("components/profile/ProfileTimeline.js:-",error)
    }
}

但是当我在我的图像标签中使用它时，它没有显示图像，我不知道为什么

<Image  source={{uri: `data:image/png;base64,${imagefromAPI}`}}  style={{width:100, height:100}} resizeMode="cover" />