How to Generate vCard (VCF) Contact Files in Node.js ?

Let’s say you wanted to have a simple, well-supported way of exporting contacts. Maybe this is because you’re creating a CRM app, building an email client, or anything else that needs to support and export contact items. There is an easy solution for this: VCF files. A contact can be created, edited, and exported as a vCard (or ‘VCF’) file for use on other devices. VCF files are useful for transferring contacts across different systems and provide a consistent file format for representing contacts and a wide array of potential properties.

In this article, we will explain how to generate your own VCF contact files in Node.js.

Project Setup and Module Installation:

Step 1: Create a Node.js app and name it ‘project’ using the following command:

mkdir Project && cd Project
npm init -y

Step 2: Install the dependency modules using the following command:

npm i vcards-js axios

Step 3: create vcard.js file using the following command:

touch vcard.js

Project Structure: Here’s the initial directory for this project:

Initial project directory

Step 4: To create a single vCard, set some basic properties, and save it to the file vcard.js:

vcard.js

let vCardsJS = require('vcards-js');

// This is your vCard instance, that
// represents a single contact file
let vCard = vCardsJS();

// Set contact properties
vCard.firstName = "James";
vCard.middleName = "Daniel";
vCard.lastName = "Smith";
vCard.organization = "GeeksforGeeks";
vCard.title = "Technical Writer";
vCard.email = "james@example.com";
vCard.cellPhone = "+1 (123) 456-789";

// Save contact to VCF file
vCard.saveToFile(`james.vcf`);

Step 5: To add a custom profile photo to your vCard, you’ll need to convert the profile photo to Base64 and then set it using the Base64 data format. This example fetches a placeholder image from a URL, converts that fetched image to Base64, and then sets the profile photo to that image in the vCard. Base64 is a very robust format, so it’s very possible to convert a local image or image from a file upload to Base64 and then set the vCard profile photo from there. Here’s how you can convert uploaded images to Base64 on the browser.

For setting a custom birthday, simply set the birthday property to a plain JavaScript Date object representing the contact’s birthday.

Create the following file with the name vcard.js:

vcard.js

let vCardsJS = require('vcards-js');
let axios = require('axios');

(async () => {

  // This is your vCard instance, which
  // represents a single contact file
  let vCard = vCardsJS();

  // Set contact properties
  vCard.firstName = "James";
  vCard.lastName = "Smith";

  // Add a profile photo by fetching from a URL
  let image = await axios.get("https://via.placeholder.com/300",
                             {responseType: 'arraybuffer'});
  // Convert image to base 64
  let imageBase64 = Buffer.from(image.data).toString('base64');

  // Set vCard photo to the base 64 value of the image
  vCard.photo.embedFromString(imageBase64, 'image/jpeg');

  // Set birthday using a JavaScript date object
  vCard.birthday = new Date("July 17, 2004");

  // Save contact to VCF file
  vCard.saveToFile(`james-with-photo-and-birthday.vcf`);
})();

Step to run the application: To run this program, run the following command:

node vcard.js

Output: The output and result of our program is a new vCard created in the project directory, with the following contents:

BEGIN:VCARD
VERSION:3.0
FN;CHARSET=UTF-8:James Smith
N;CHARSET=UTF-8:Smith;James;;;
BDAY:20040717
PHOTO;ENCODING=b;TYPE=image/jpeg:iVBORw0KGgoAAAANSUhEUgAAASwAAAEsBAMAAACLU5NGAAAAG1BMVEXMzMyWlpacnJyqqqrFxcWxsbGjo6O3t7e+vr6He3KoAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAD90lEQVR4nO3cwW+bSBQH4AcGw5HnJDhHaN3dHO1su9ojNGnPtrUb7dFuIiVHnEo5263Uv3vfGwab1myVA5DV6vcpgeD35HmeGYbJxUQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD/zOb3N5BRexlu9/Jo+NCQFl/HbWrRK7s6Amcdy3jCfaftyOT/OmsnLxSFqkzu04Ns1Z+RxPOMtUc63fH6U5HP8O5/uo1Vyh9IJhTylwSjz0pV0y4Tex0dJ7iij3ck+WiV3J9RPvVhRLgO5O5V+KOSl7MesnXSRH++jNrlDAWurEW0i6ZOz8jI9mlwaDXkftckd8nXEdgnNVjI2sf6Q+VvLSMiMHJnupHC0j9rkrmlL87Lhs7JK86oM1fowVFq0jdrkjn2QKbMuTEvD8aGsfCQ9th9PbzHeR21yt1KWkUq3et+Tq4tDHpnXfZ67+7Zdltu1itrkbrEuRWVLWdmwHbl0shlXSQ7LLVtFbXLXZUmLphHOHK3IsWVtTg6Lk6PFV1Gb3G1Z9I1Xjb015NpSHq7jfntL7reoaW7JhD+pJQ2537llVuyGO1Em17iWJMt7f3ei/zeZcdGlKLDr1saW5XPV9F9bM2pV1CZ3yDxDZFx0HZcF0z+s8rpwVcuWPo5k1KqoTe7QwD58mp6Js/PUTn4tVEatx2ei3lAzu4M4t3uErQl5PN3YOb84NR+gitrkDnl8J51QNO23hjLH7SqQxxnp0trbfotmo9t0RE27U9k9hFw2PuBfLnVD0d/u9KMs8hNq2svrxFqXJXprZtmg9riXp5v0jTRI4afyn5lv1X8+gRaQ22XA/zT6sxatkgEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD65tjf/5gXLYtHb/8l8kNZkVw5zEwjIjei8ru7rtJ7/YqcO3ISorTFsiLvt+eXZY7xlp5sWd6b7KscrpeZ80DBus2y6D1dviY3C+QP/9WUnGWkp8GrhZa1fE3DQiK1ssYrurdlDeblwZ86TzTctFuWf/dxPihy+kw31+/IuTOnm2v98I6EwoTe1cuKLsLEluVm5cFLHHf7pc2JKIPoZl4STpfFHzSRfnEyc5pQrmVJiO7l13yRHpdlPQ0LW5ZTHSInWN23WZZMedMJycUq0aa1FT1F1dyK6MugoHpvuY903Fv0a9Jqb+n7apesHlY0KSvRU6233CV9V5Z/RsdzixbzlsvSuUXL4nFOT9mVtq2nw9yiYPx9WebCHGt3IrW7yOnby51IuyzPKEgv9M31dLgTKUgayioH+oqrdavlsp5hWPTb3jM9vnQBjZyLl64AAP43/gHVSaMe2vmdiAAAAABJRU5ErkJggg==
REV:2022-02-27T19:04:38.635Z
END:VCARD

This vCard is stored as the file james-with-photo-and-birthday.vcf, as specified in the code.

Conclusion: vCards and VCF files can be integral to any contacts-based application you may build. With vcards-js, it’s very simple to generate and save vCard/VCF files in Node.