如何从Javascript中任何图像类型的base64字符串中剥离数据：图像部分

Posted 2023-03-23

【中文标题】如何从Javascript中任何图像类型的base64字符串中剥离数据：图像部分

【英文标题】：How can I strip the data:image part from a base64 string of any image type in Javascript

【发布时间】：2016-12-02 15:36:59

【问题描述】：

我目前正在执行以下操作以在 javascript 中解码 base64 图像：

    var strImage = "";
    strImage = strToReplace.replace("data:image/jpeg;base64,", "");
    strImage = strToReplace.replace("data:image/png;base64,", "");
    strImage = strToReplace.replace("data:image/gif;base64,", "");
    strImage = strToReplace.replace("data:image/bmp;base64,", "");

正如您在上面看到的，我们接受四种最标准的图像类型（jpeg、png、gif、bmp）；

但是，其中一些图像非常大，用替换扫描每张图像 4-5 次似乎是一种可怕的浪费，而且效率极低。

有没有一种方法可以可靠地一次性剥离 base64 图像字符串的 data:image 部分？

也许通过检测字符串中的第一个逗号？

提前致谢。

【参考方案1】：

你可以使用正则表达式：

var strImage = strToReplace.replace(/^data:image\/[a-z]+;base64,/, "");

---

^ 表示 在字符串的开头 data:image 表示 数据：图像 \/ 表示 / [a-z]+ 表示 a 和 z 之间的一个或多个字符 ;base64, 表示 ;base64,

【讨论】：

我不知道性能是否更好，但逻辑上我会说“是”（替换和正则表达式搜索整个字符串中的匹配项，indexof 在第一个字符上中断等于它是参数），也许我会做一些性能测试：var strImage = strToReplace.Substring(strToReplace.IndexOf(',')+1);

strToReplace.replace(/^data:image\/\w+;base64,/, "")

【参考方案2】：

var solution = string.split("base64,")[1];

在“base64”处拆分变量字符串，而不是取第二部分。

【讨论】：

我不明白为什么这么多公认的答案都有古怪的正则表达式解决方案。这很容易理解并且执行得非常快。有什么缺点吗？

@JoshuaOhana 如果编码字符串中还有另一个“base64”...否则我不知道...

【参考方案3】：

这对我有用：

var strImage = strToReplace.split(',')[1];

【参考方案4】：

我遇到了这个问题，正在寻找一种去除任何标题的方法。所以只想分享这个：

Regex.Replace(strToReplace, @"^.+?(;base64),", string.Empty))

从一个优秀的answer 那里得到这个，它描述了如何：

尽可能少地匹配任何字符，直到找到“abc”，不计算“abc”。

【讨论】：

我喜欢这个替换答案，因为它不仅可以处理任何文件类型，而且如果您传递了一个 不是 以数据为前缀的 base64 字符串，它也不会出错： file.base64.replace(/^.+?(;base64),/, '')

【参考方案5】：

使用这个正则表达式

/[data:image\/[a-z]*;[a-z0-9]*,.*]/gm

【参考方案6】：

您可以使用startWith，这样您就不必扫描所有对象。它的性能应该会好很多

【参考方案7】：

这对我有用 Swift 5：

let ourBase64String:String = "base64 string"
let base64StringArray:[String] = ourBase64String.components(separatedBy: "base64,")
if(attachmentArray.count > 0)
   print(attachmentArray[1])