In this article I will explain with an example, how to read vCard (.VCF) Contact Card file and import its information in ASP.Net Core MVC.
This article makes use of Thought Project vCard Library for reading vCard in ASP.Net Core MVC.
VCF Contact Cards
A vCard file is a standard for electronic business cards. vCards are used for storing and sharing Contact Information such as name, email, phone numbers, address and etc.
Downloading Thought Project vCard package
You will need to install the Thought Project vCard package using the following command.
Install-Package Thought.vCards -Version 1.0.9
vCard File Location
The vCard file is present inside the vCards Folder (Directory) of wwwroot Folder (Directory).
Model
The Model class consists of following properties.
public class ContactModel
{
public string Name { get; set; }
public string Organization { get; set; }
public string Title { get; set; }
public string MobileNumber { get; set; }
public string HomeNumber { get; set; }
public string WorkNumber { get; set; }
public string EmailAddress { get; set; }
public string Website { get; set; }
public string ImageUrl { get; set; }
}
Namepsaces
You will need to import the following namespaces.
using System.IO;
using Thought.vCards;
using Microsoft.AspNetCore.Hosting;
Controller
The Controller consists of following Action method.
Action method for handling GET operation
Inside this action method, the path of the vCard is read into a vCard class object from the wwwroot path using IWebHostEnvironment interface.
An object of ContactModel class is created and the vCard information such as Name, Organization, Phone Numbers, Email Addresses, Websites, Photo and etc. of the contact is read and set to it.
Information such as Phone Numbers, Email Addresses and Websites is checked for null and if it is not null then the details are set to the ContactModel class object.
For Photo, a check is performed if Photo is present then BYTE array is converted to Base64 string and assigned to the ImageUrl property of the HTML Image element.
Finally, the ContactModel class object is returned to the View.
public class HomeController : Controller
{
private IWebHostEnvironment Environment;
public HomeController(IWebHostEnvironment _environment)
{
this.Environment = _environment;
}
public IActionResult Index()
{
string path = Path.Combine(this.Environment.WebRootPath, "vCards\\Mudassar Khan.vcf");
vCard card = new vCard(path);
ContactModel contact = new ContactModel();
//Read Name.
contact.Name = card.FormattedName;
//Read Organization.
contact.Organization = card.Organization;
//Read Title.
contact.Title = card.Title;
//Read Mobile Number.
if (card.Phones.GetFirstChoice(vCardPhoneTypes.Cellular) != null)
{
contact.MobileNumber = card.Phones.GetFirstChoice(vCardPhoneTypes.Cellular).FullNumber;
}
//Read Home Number.
if (card.Phones.GetFirstChoice(vCardPhoneTypes.Home) != null)
{
contact.HomeNumber = card.Phones.GetFirstChoice(vCardPhoneTypes.Home).FullNumber;
}
//Read Work Number.
if (card.Phones.GetFirstChoice(vCardPhoneTypes.Work) != null)
{
contact.WorkNumber = card.Phones.GetFirstChoice(vCardPhoneTypes.Work).FullNumber;
}
//Read Email Address.
if (card.EmailAddresses.GetFirstChoice(vCardEmailAddressType.Internet) != null)
{
contact.EmailAddress = card.EmailAddresses.GetFirstChoice(vCardEmailAddressType.Internet).Address;
}
//Read Website URL.
if (card.Websites.GetFirstChoice(vCardWebsiteTypes.Personal) != null)
{
contact.Website = card.Websites.GetFirstChoice(vCardWebsiteTypes.Personal).Url;
}
//Read Image.
if (card.Photos.Count > 0)
{
contact.ImageUrl = "data:image/ png;base64," + Convert.ToBase64String(card.Photos[0].GetBytes());
}
return View(contact);
}
}
View
Inside the View, in the very first line ContactModel is declared as Model for the View.
The View consists of an HTML Table, which consists of an HTML Image element and some Labels for displaying the imported information from the vCard file.
@model Read_Import_VCF_Contact_Card_MVC_Core.Models.ContactModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="10" valign="top">
<img src="@Model.ImageUrl" />
</td>
</tr>
<tr>
<td style="width: 150px">Name:</td>
<td>@Model.Name</td>
</tr>
<tr>
<td style="width: 150px">Company Name:</td>
<td>@Model.Organization</td>
</tr>
<tr>
<td>Mobile Number:</td>
<td>@Model.MobileNumber</td>
</tr>
<tr>
<td>Title:</td>
<td>@Model.Title</td>
</tr>
<tr>
<td>Home Number:</td>
<td>@Model.HomeNumber</td>
</tr>
<tr>
<td>Work Number:</td>
<td>@Model.WorkNumber</td>
</tr>
<tr>
<td>Email Address:</td>
<td>@Model.EmailAddress</td>
</tr>
<tr>
<td>Website:</td>
<td>@Model.Website</td>
</tr>
</table>
</body>
</html>
Screenshot
Demo
Downloads