前端集合 - 关注前端技术和互联网免费资源

关注前端技术和互联网免费资源

分类儿

页面儿

搜索儿

前端集合 RSS订阅
Home » 经验记录 » JavaScript: Base64 数据分片切割

JavaScript: Base64 数据分片切割

发布者:前端集合 // 发布时间:2025-04-12 11:45:00 // 分类:经验记录 // 访问: 74 次 // 热度:

在网上找了很多 base64 切割分片的方法,都有各种各样的问题,最后结合各种方案和测试,得到一个较为完美的方案,未发现bug:

实现

export default {
    /**
     * @param {string} baseStr - base64 字符
     * @param {number} sizeByte - 分片目标字节大小
     * @returns {string[]} 返回切割后 base64 字符串数组
     */
    split(baseStr, sizeByte) {
        if (!baseStr) return [];

        // 计算base64字符数,确保是4的倍数
        let base64Size = Math.ceil((sizeByte * 4) / 3);
        base64Size = Math.ceil(base64Size / 4) * 4;

        let result = [];
        let matches = baseStr.match(/^data:(\w+\/\w+);base64,(.+)$/);
        let prefix = '';
        let lastData = baseStr;

        // 处理data URL格式
        if (matches) {
            prefix = matches[1];
            lastData = matches[2];
        }

        for (let i = 0; i < lastData.length; i += base64Size) {
            let part = lastData.slice(i, i + base64Size);

            // 如果不是最后一块,确保长度是4的倍数
            if (i + base64Size < lastData.length) {
                while (part.length % 4 !== 0) {
                    part += '=';
                }
            }

            // 如果是data URL格式,添加前缀
            if (matches && i === 0) {
                part = `data:${prefix};base64,${part}`;
            }

            result.push(part);
        }

        return result;
    },

    /**
     * 按兆字节(MB)大小分割 base64 字符串
     * @param {string} baseStr - base64
     * @param {number} mbSize - 分片目标字节大小
     * @returns {string[]} 返回切割后 base64 字符串数组
     */
    cut(baseStr, mbSize) {
        if (!baseStr || mbSize <= 0) return [];

        // 计算目标字节大小
        const targetByte = mbSize * 1024 * 1024;

        // base64 编码会将 3 字节数据编码为 4 字节
        // 因此需要调整分片大小以适应 base64 编码
        const base64PartSize = Math.floor(targetByte * 3 / 4);

        return this.split(baseStr, base64PartSize);
    }
}

调用

// 按 1 兆进行分片切割
cut('data:image/png;base64,/9j/4AAQSkZJRgABAQAAA...', 1)

Tags: base64, base64分片, base64切割, base64分片上传, base64切割上传

Mac OS idleassetd 进程占用大量网络流量怎么办?>>  << 3月底
Top