Làm thế nào để hiển thị hình ảnh blob mysql trong html bằng cách sử dụng Vuejs?

Những gì bạn muốn là một url dữ liệu . Bạn sẽ cần chuyển đổi mảng byte thành base64. Không có cách nào để sử dụng các byte thô. Có thể thực hiện việc này trong thuộc tính được tính toán, bằng cách sử dụng một trong các mảng byte để các hàm base64 .

Đánh dấu

<img :src="dataUrl">

Hành vi (chưa được kiểm tra!)

computed : {
    dataUrl(){
        return 'data:image/jpeg;base64,' + btoa(
            new Uint8Array(this.info.image)
            .reduce((data, byte) => data + String.fromCharCode(byte), '')
        );
    }
}

Tìm kiếm lương tâm của bạn. Đây thực sự không phải là một ý kiến ​​hay :-) Gửi hình ảnh dưới dạng mảng byte được mã hóa JSON là điều mà tôi chưa bao giờ thấy và sẽ lớn hơn 10 lần trên dây so với hình ảnh nhị phân. Hình ảnh trong DB là phản vật chất . Hình ảnh trong JSON hoạt động, nhưng chúng phải được mã hóa dưới dạng chuỗi base64 trong JSON. Thậm chí sau đó, chúng làm giảm khả năng đọc của JSON và có thể chôn vùi các công cụ như Postman. Các url dữ liệu chậm hơn nhiều để tải hơn các url thông thường. Ngay cả với các hình ảnh trong DB, nếu bạn kiểm soát api của mình, bạn có thể thu được nhiều lợi nhuận bằng cách tạo các api hình ảnh chỉ trả về mảng byte, với loại ứng dụng / jpeg mime.