英文:
How can I add photo and details to vCard using JavaScript?
问题
我想使用JS向联系人vcard添加图像和更多详细信息。就像一个业务页面，当人们查看页面时，他们可以通过id="save-btn"保存我的联系方式，我想添加的不仅仅是姓名、电话和电子邮件。
这段代码运行良好，但我不知道如何向vcard添加照片和其他详细信息，比如公司、职位、位置等。
var saveBtn = document.getElementById("save-btn");
saveBtn.addEventListener("click", function() {
// 从网站获取联系信息
var contact = {
name: "John Smith",
phone: "555-555-5555",
email: "john@example.com"
// 这里可以添加更多信息，比如公司、职位、位置等
};
// 创建一个vcard文件
var vcard = "BEGIN:VCARD\nVERSION:4.0\nFN:" + contact.name + "\nTEL;TYPE=work,voice:" + contact.phone + "\nEMAIL:" + contact.email + "\nEND:VCARD";
var blob = new Blob([vcard], {
type: "text/vcard"
});
var url = URL.createObjectURL(blob);
const newLink = document.createElement('a');
newLink.download = contact.name + ".vcf";
newLink.textContent = contact.name;
newLink.href = url;
newLink.click();
});
通过save-btn从HTML页面保存vcard。
<button id="save-btn">保存联系方式</button>
英文:
I want to add an image and more details to the contact vcard using JS. it's like a business page when people see the page they can save my contact through id="save-btn", And I want to add more than Name, phone, email.
The code working fine, but I don't know how to add photo and other details to the vcard, Like company, job, location, and more.
var saveBtn = document.getElementById("save-btn");
saveBtn.addEventListener("click", function() {
// Get the contact information from the website
var contact = {
name: "John Smith",
phone: "555-555-5555",
email: "john@example.com"
};
// create a vcard file
var vcard = "BEGIN:VCARD\nVERSION:4.0\nFN:" + contact.name + "\nTEL;TYPE=work,voice:" + contact.phone + "\nEMAIL:" + contact.email + "\nEND:VCARD";
var blob = new Blob([vcard], {
type: "text/vcard"
});
var url = URL.createObjectURL(blob);
const newLink = document.createElement('a');
newLink.download = contact.name + ".vcf";
newLink.textContent = contact.name;
newLink.href = url;
newLink.click();
});
Save the vcard from html page through save-btn.
<button id="save-btn">Save Contact</button>
答案1
得分: 1
以下是VCF文件的格式：
https://en.wikipedia.org/wiki/VCard
您可以将PHOTO属性设置为图像，请查看"Properties"部分以了解在VCF文件中可以设置的所有可用属性。
照片属性示例：
版本：值
2.1：PHOTO;JPEG:http://example.com/photo.jpg
2.1：PHOTO;JPEG;ENCODING=BASE64:[base64-data]
3.0：PHOTO;TYPE=JPEG;VALUE=URI:http://example.com/photo.jpg
3.0：PHOTO;TYPE=JPEG;ENCODING=b:[base64-data]
4.0：PHOTO;MEDIATYPE=image/jpeg:http://example.com/photo.jpg
4.0：PHOTO;ENCODING=BASE64;TYPE=JPEG:[base64-data]
英文:
Here is the format of VCF files:
https://en.wikipedia.org/wiki/VCard
You can set PHOTO property as image, see Properties section to know all the available properties that you can set in a VCF file.
Example of photo property:
version: value
2.1: PHOTO;JPEG:http://example.com/photo.jpg
2.1: PHOTO;JPEG;ENCODING=BASE64:[base64-data]
3.0: PHOTO;TYPE=JPEG;VALUE=URI:http://example.com/photo.jpg
3.0: PHOTO;TYPE=JPEG;ENCODING=b:[base64-data]
4.0: PHOTO;MEDIATYPE=image/jpeg:http://example.com/photo.jpg
4.0: PHOTO;ENCODING=BASE64;TYPE=JPEG:[base64-data]
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论