使用JavaScript将本地映像转换为base64

我正在用html，javascript做一个项目。 我有一个将image转换为base64的函数，请参见下面的代码

function getBase64Image()
{
    p = document.getElementById("picField").value;
    img.setAttribute('src', p);
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0);
    var dataURL = canvas.toDataURL("image/png");
    var r = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
    base64 = r;
    alert(base64);
}

但问题是当我部署我的网站时， 意味着当我将html文件放在iis上时，它不工作，意味着在本地文件系统中它显示完整的Base64格式，如iVb。。。。， 但在iis上，它只将base64代码作为“base”。

---

所以我不知道为什么它不能在iis上工作，所以请帮助我并给我发送一个html文件，该文件也能在iis上工作。

我敢肯定你有问题

当您在IIS上运行页面时，它在不同于本地的上下文中运行：它不是在

文件：//

URL上运行，而是在

http://

上运行

您试图做的是获取本地图像文件并将其加载到远程站点的画布中。出于安全原因，使用传统JavaScript是不可能的。（我甚至不确定这在本地是如何工作的——据我理解，这不应该。但无论如何。）

您需要使用允许JavaScript直接访问本地文件的。我会看看能否找出一些相关的问题

更新：这将有助于：

---

这是客户端代码，不应该与IIS有任何关系。您可能有一个同源策略问题。什么类型的字段是document.getElementById（“picField”），其中的URL是什么样子的？当然，相同的html文件清楚地显示base64字符串，但是当放在iis上时，它不会显示，为什么？恐怕这不起作用。我很惊讶它能在本地工作。您使用的浏览器是什么？可能与我们解决问题的方法重复？请帮忙ME@Raja请参阅答案中的链接。你需要在这里使用一个稍微不同的概念。对不起，我不能这样做，这是针对mozilla的，没有工作IE@Raja是的，在IE中还不行。也许在IE10中。。。您必须在IE中提供一个版本，在Firefox/Chrome中提供另一个版本。我没有这方面的实际经验，所以我不能再帮上忙了，我现在没有时间亲自尝试