Question

目前我正在选择一个文件并转换为base64字符串并在html页面中显示。请参阅下面的代码。但我希望这样一种方式，在加载函数时，它将自动从保存图像的位置获取文件并转换为base64并显示。我只想跳过手动选择方式..请帮助

<html>
<body>
Choose File: <input id="imageToLoad" type="file" onchange="displayImage();" />
<p>Image encoded</p>
<textarea id="base64TextArea" style="width:550;height:240" ></textarea>
<img id="myImg" width="218" height="300"  src="" />
<script type="text/javascript">

function displayImage()
{
    var filesSelected = document.getElementById("imageToLoad").files;


    if (filesSelected.length > 0)
    {
        var fileToLoad = filesSelected[0];

        var fileReader = new FileReader();

        fileReader.onload = function(fileLoadedEvent) 
        {



            base64TextArea.innerHTML = fileLoadedEvent.target.result;
            document.getElementById("myImg").src = fileLoadedEvent.target.result;
        };

        fileReader.readAsDataURL(fileToLoad);
    }
}

</script>

</body>
</html>

Answer 1

您无法使用JS在客户端的计算机上获取任意文件。使用大多数浏览器时，客户端必须手动选择要由脚本处理的文件。

如果您考虑一下，如果任何网站可以访问您计算机上的任何文件，那将是一个重大的安全漏洞。

Answer 2

我不确定为什么Base64在这里是一个重要的方面。如果将图像转换为文本是您需要的特定要求，请提供一些细节，但如果您只想显示和参考图像，则可以从以下开始：

if (filesSelected.length > 0)
    {
        var fileToLoad = filesSelected[0];

        document.getElementById("myImg").src = URL.createObjectURL(fileToLoad);
    }

这将使用＆＃34;对象网址＆＃34;这是一种引用已拖放或从<input>

中挑选的文件的简写方式

文件阅读器Javascript

2 个答案: