Convert PEM and DER Certificate Formats in Browser Convert between PEM and DER certificate/key formats.

The conversion process from PEM to DER involves several steps, starting with the removal of headers and footers using a regular expression that matches strings like -----BEGIN CERTIFICATE----- and -----END CERTIFICATE----. The input string is then Base64-decoded using the atob function, which returns a binary string. This binary data is converted to hexadecimal format by iterating over each character in the string, obtaining its ASCII code with charCodeAt, converting it to a hexadecimal string with toString(16), and padding it with zeros if necessary. The resulting hex string is then output as the DER representation.

In the opposite direction, from DER to PEM, the process begins by removing any whitespace characters from the input hex string. It then creates an array of bytes using Uint8Array and populates it by parsing each pair of hexadecimal digits into a byte value with parseInt. These bytes are converted back into a binary string with String.fromCharCode, which is then Base64-encoded using btoa. The encoded string is formatted according to RFC 7468 by splitting it into lines of up to 64 characters and adding the appropriate PEM headers and footers, such as -----BEGIN CERTIFICATE----- and -----END CERTIFICATE----, depending on the label specified by the user.

Both conversion paths rely heavily on JavaScript's built-in functions for string manipulation, such as replace, match, and substring, as well as its support for binary data through Uint8Array. The use of React state management with useState allows the tool to dynamically update its output based on changes to the input or mode selection. When converting from DER to PEM, users can specify a custom label that will be used in the output headers, providing flexibility when working with different types of certificates or cryptographic data.