如何从JavaScript FileReader的Base64字符串中去除类型？

Question

我在我的 JavaScript 代码中有以下内容：

var reader = new FileReader();
reader.onloadend = function () {
    alert(reader.result);
};

这向我展示了以下数据：

 data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAAAAABX3VL4AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gYSDCUgSze0AAAAAA5JREFUCNdjrGJgYmAAAAJ0AH4SDHVIAAAAAElFTkSuQmCC

问题是我只想要逗号后面的部分。 我尝试从reader.result.value，reader.result.valueOf()和一些其他组合中获取它，但找不到正确的方法来仅获取从逗号后面开始的base64字符串。 所以另一个想法是简单地剥离逗号及其前面的所有内容，但我有些不确定如何做到这一点。

是否有人有任何想法如何完成此操作？ 欢迎所有提示！

- kramer65

---

var base64result = reader.result.split(',')[1]; 或 var base64result = reader.result.substr(reader.result.indexOf(',') + 1); 的翻译：第一种写法是将 "reader.result" 这个字符串以逗号为分割点进行拆分，然后取得拆分后的第二个部分作为结果赋值给 "base64result" 变量。第二种写法是先在 "reader.result" 字符串中查找逗号的位置，然后从该位置开始取得剩余部分作为结果赋值给 "base64result" 变量。 - Sani Huttunen

Answer 1

以下函数可以实现你想要的结果：

var base64result = reader.result.split(',')[1];

这将字符串拆分为一个字符串数组，第一项（索引0）包含data:image/png;base64，第二项（索引1）包含Base64编码数据。

另一种解决方案是找到逗号的索引，然后简单地切掉逗号前面和包括逗号的所有内容：

var base64result = reader.result.substr(reader.result.indexOf(',') + 1);

请参见JSFiddle。

- Sani Huttunen

---

我们确定在base64字符串本身中不会出现逗号吗？如果是这样，那就非常好的解决方案。 - Max Mazur

好的，我会尽力进行翻译。Base64 编码使用字符 [a-z、A-Z、0-9、+、/] 进行编码，同时用 = 进行填充。更多信息请参见 Base64。 - Sani Huttunen

非常好。非常感谢您的解释。 - Max Mazur

谢谢！在阅读这个答案之前，我使用了这个：var base64result = reader.result.match(/^data:.+\/(.+);base64,(.*)$/)[2]，但是它非常慢。我猜测正则表达式操作的复杂性比字符串分割要高得多。 - sonlexqt

有没有一种简单直接的方法来做这件事？ - Kishore Sahasranaman

Answer 2

let reader: FileReader = new FileReader();
 
 reader.onloaded = (e) => {
    let base64String = reader.result.split(',').pop();
 };

或者

let base64String = /,(.+)/.exec(reader.result)[1];

- Oleh Leskiv

Answer 3

您可以尝试使用;base64,来分割您的数据。

// In here you are getting the data type. Ex - png, jpg, jpeg, etc. You can use this for any further purposes.
var dataType = reader.result.split(';base64,')[0];

// In here you are getting the base64 string and you can use this for your purpose.
var base64result = reader.result.split(';base64,')[1];

- Dushan

Answer 4

您也可以这样做。

var base64=reader.result.replace(/^data:image\/\w+;base64,/, "");

- Nelson Bwogora

---

这是仅针对图像的内容。 - ÄR Âmmãř Żąîñh

Answer 5

你可以使用以下正则表达式来替换任何类型的数据：

const base64 = reader.result.toString().replace(/^data:(.*,)?/, "");

- Ravgeet Dhillon