Javascript 为什么base64字符串只显示图片的一部分？

在前面的一个问题上，我收到了社区的帮助，将结果base64字符串设置为src属性，但是，一个或多个图像缺少图像的底部。请看下图

下面是我用来设置图像内容的代码。如何显示图像的其余部分

从“React”导入React；
从“axios”导入axios；
从“./settings”导入*作为设置；
导出默认类Post扩展React.Component{
构造函数（）{
超级（）；
此.state={
profileImage:'img/loading.gif'
};
}
componentDidMount（）{
如果（this.props.post.postmageid！=“00000000-0000-0000-0000-000000000000”）{
//获取后期图像数据
_rvw.getImage（this.props.post.postmageid）
。然后（（res）=>{
这是我的国家({
postImage:“数据：”+res.headers[“内容类型”]+“base64”+res.data
});
});
}
否则//没有图像
{
这是我的国家({
postImage:“img/no image.png”
});
}
}
getImage（id）{
让配置={
标题：{
“内容类型”：“应用程序/json”，
“接受”：“应用程序/json”，
“授权”：“承载人”+localStorage.token
}
};
返回axios.get（settings.baseUrl（）++'/mediacontent/get/'+id，config）；
}
render（）{
返回(
);
}
}

---

根据您的帖子，src的值应该是this.state.profileImage，而不是this.state.postImage。还请检查图像的其他部分是否被其他UI元素覆盖。您可以使用浏览器提供的DOM Explorer窗口来检查应用于这些html元素的html元素和样式表。

首先检查您收到的数据是否完整。不相关，但仍然是：顺便说一句，

this.props.post.ProfileImageId！=空检查可能是多余的。我仔细检查了大小，结果是正确的。azure上的blob是289.9kb，我从http响应接收到290kb。等等，二进制数据的blob是289k？或者是289kb的base64？你好，亲爱的，我继续做了一些更正。我试图从完整组件中提取代码，以仅显示与我遇到的问题相关的内容，但现在我继续并添加了指向完整组件代码的链接。我希望这会增加一些上下文。我建议您从C#端和JS端打印base64字符串。检查它们是否不同。然后，您可以创建一个带有一个图像标记的简单html文件，并使用base64字符串设置src属性。它将帮助您定位错误位置。