将图像转换为 Data URI Base64 的问题

Question

我正在尝试将位于服务器上的图像转换为数据 URI。当我通过确切的 url 位置时，它转换得很好。我需要能够将文件名作为变量传递，但是当我这样做时，它会返回一个 base64，用于 data:text/html 而不是 data:image/jpeg。

感谢任何帮助！

    function toDataURL(url, callback) {
    var xhr = new XMLHttpRequest();
    xhr.onload = function() {
        var reader = new FileReader();
        reader.onloadend = function() {
            callback(reader.result);
        }
        reader.readAsDataURL(xhr.response);
    };
    xhr.open('GET', url);
    xhr.responseType = 'blob';
    xhr.send();
}

//Works Here
    toDataURL(`/attachments/HouseLandPackage/FloorPlans/Floorplan.jpg`, function(dataUrl) {
            UserSelection.FloorPlanBase64 = dataUrl;
        });

//Doesn't work here (Floorplan = Floorplan.jpg in this)
    toDataURL(`/attachments/HouseLandPackage/FloorPlans/${Floorplan}`, function(dataUrl) {
                UserSelection.FloorPlanBase64 = dataUrl;
            });

Answer 1

试试

toDataURL(`/attachments/HouseLandPackage/FloorPlans/${Floorplan}`, function(dataUrl) {
                UserSelection.FloorPlanBase64 = dataUrl;
            });

您应该使用${variableName} 而不是只使用带有反引号的{variableName}