How can I perform Base64 encoding and decoding in JavaScript, considering different browser support and server-side environments?

Base64 Encoding and Decoding in Client-Side JavaScript

JavaScript offers a range of options for base64 encoding and decoding:

Native Browser Support

Modern browsers such as Firefox, Chrome, Safari, Opera, and IE10 provide native support for base64 encoding. You can use the btoa() function for encoding and atob() for decoding.

Server-Side JavaScript

For server-side JavaScript environments like Node.js, you can utilize Buffers for base64 decoding.

Cross-Browser Libraries

If you need a cross-browser solution, you can leverage existing libraries such as CryptoJS. Alternatively, you can use code like the one provided in the answer:

// Base64 encoding
function encodeBase64(str) {
  var b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
  var o1, o2, o3, h1, h2, h3, h4, bits, i = 0, ac = 0, enc = '';
  while (i < str.length) {
    o1 = str.charCodeAt(i);
    i++;
    if (i < str.length) {
      o2 = str.charCodeAt(i);
      i++;
      if (i < str.length) {
        o3 = str.charCodeAt(i);
        i++;
        bits = o1 << 16 | o2 << 8 | o3;
      } else {
        bits = o1 << 16 | o2 << 8;
      }
    } else {
      bits = o1 << 16;
    }
    h1 = bits >> 18 & 0x3f;
    h2 = bits >> 12 & 0x3f;
    h3 = bits >> 6 & 0x3f;
    h4 = bits & 0x3f;
    enc += b64.charAt(h1) + b64.charAt(h2) + b64.charAt(h3) + b64.charAt(h4);
  }
  if (ac >= 1) {
    enc += b64.charAt(h1) + b64.charAt(h2) + '=';
  }
  if (ac >= 2) {
    enc += b64.charAt(h1) + '=';
  }
  return enc;
}

// Base64 decoding
function decodeBase64(str) {
  var b64 = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=';
  var o1, o2, o3, h1, h2, h3, h4, bits, i = 0, ac = 0, dec = '';
  while (i < str.length) {
    h1 = b64.indexOf(str.charAt(i));
    i++;
    h2 = b64.indexOf(str.charAt(i));
    i++;
    h3 = b64.indexOf(str.charAt(i));
    i++;
    h4 = b64.indexOf(str.charAt(i));
    i++;
    bits = h1 << 18 | h2 << 12 | h3 << 6 | h4;
    o1 = bits >> 16 & 0xff;
    o2 = bits >> 8 & 0xff;
    o3 = bits & 0xff;
    dec += String.fromCharCode(o1);
    if (ac >= 1) {
      dec += String.fromCharCode(o2);
    }
    if (ac >= 2) {
      dec += String.fromCharCode(o3);
    }
  }
  return dec;
}

Note that the provided cross-browser code may require additional testing to ensure compatibility with different browsers. It is advisable to use a reputable library for more reliable cross-browser functionality.

The above is the detailed content of How can I perform Base64 encoding and decoding in JavaScript, considering different browser support and server-side environments?. For more information, please follow other related articles on the PHP Chinese website!