html如何把某个网页上传的图片被写作base64形式存入后端,那这个图片如何传到另一个网页并显示,可以提供代码范例吗,谢谢
时间: 2023-06-03 17:07:41 浏览: 293
将图片进行Base64编码后传输
对于您的问题,您可以使用 HTML5 File API 来读取上传的图片并将其转换为 base64 格式,然后把它传到后端。在另一个网页上,您可以使用 JavaScript 将 base64 图片数据转换为 URL 格式并将其赋值到 img 标签的 src 属性上来显示图片。下面是示例代码:
前端 HTML 代码:
<input type="file" id="uploadImgBtn" onchange="uploadImg()">
前端 JavaScript 代码:
function uploadImg() {
var file = document.getElementById("uploadImgBtn").files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
var base64Img = reader.result.split(",")[1]; // 去掉头信息
// 将 base64 图片数据传到后端
uploadImgToServer(base64Img);
}
}
function uploadImgToServer(base64Img) {
// 使用 AJAX 发送请求将 base64 图片数据传到后端
// ...
}
另一个网页的 JavaScript 代码:
// 假设后端返回的数据为 base64Img
var imgElem = document.createElement("img");
imgElem.src = "data:image/png;base64," + base64Img;
document.body.appendChild(imgElem);
希望这些代码可以帮到您!
阅读全文