如何使用JavaScript为vCard添加照片和详细联系信息

document.addEventListener("DOMContentLoaded", function() {
    var saveBtn = document.getElementById("save-btn");

    saveBtn.addEventListener("click", function() {
        // 定义联系人信息，包括更多详细信息和照片URL
        var contact = {
            name: "John Smith",
            phone: "555-555-5555",
            email: "john.smith@example.com",
            organization: "Acme Corporation",
            title: "Senior Developer",
            address: {
                street: "123 Main St",
                city: "Anytown",
                state: "CA",
                zip: "90210",
                country: "USA"
            },
            photoUrl: "https://example.com/path/to/your/profile_photo.jpg" // 替换为实际照片URL
            // 或者，如果您想使用Base64编码的图片：
            // photoBase64: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDA..."
        };

        // 构建vCard字符串
        // 建议使用vCard 4.0，因为它更现代且支持更丰富的属性和编码
        var vcard = "BEGIN:VCARD\n";
        vcard += "VERSION:4.0\n"; // 指定vCard版本

        vcard += "FN:" + contact.name + "\n";
        vcard += "TEL;TYPE=work,voice:" + contact.phone + "\n";
        vcard += "EMAIL:" + contact.email + "\n";

        // 添加更多详细信息
        if (contact.organization) {
            vcard += "ORG:" + contact.organization + "\n";
        }
        if (contact.title) {
            vcard += "TITLE:" + contact.title + "\n";
        }
        if (contact.address) {
            // ADR格式: ;;;Street;City;State;Zip;Country
            // 注意：vCard 4.0 推荐使用 LABEL 参数来提供格式化的地址
            // ADR;TYPE=work;LABEL="123 Main St\nAnytown, CA 90210\nUSA":;;123 Main St;Anytown;CA;90210;USA
            vcard += "ADR;TYPE=work:;;" + contact.address.street + ";" +
                     contact.address.city + ";" + contact.address.state + ";" +
                     contact.address.zip + ";" + contact.address.country + "\n";
        }

        // 添加照片
        if (contact.photoUrl) {
            // 使用URI链接照片 (vCard 4.0 语法)
            vcard += "PHOTO;MEDIATYPE=image/jpeg:" + contact.photoUrl + "\n";
        } else if (contact.photoBase64) {
            // 使用Base64编码嵌入照片 (vCard 4.0 语法)
            // 确保 photoBase64 字符串不包含 "data:image/jpeg;base64," 前缀，只包含实际的Base64数据
            const base64Data = contact.photoBase64.split(',')[1] || contact.photoBase64;
            vcard += "PHOTO;ENCODING=BASE64;TYPE=JPEG:" + base64Data + "\n";
        }

        vcard += "END:VCARD";

        // 创建Blob对象并下载vCard文件
        var blob = new Blob([vcard], {
            type: "text/vcard;charset=utf-8"
        });
        var url = URL.createObjectURL(blob);

        const newLink = document.createElement('a');
        newLink.download = contact.name.replace(/\s/g, "_") + ".vcf"; // 替换空格以确保文件名有效
        newLink.textContent = "Download " + contact.name + " vCard"; // 更好的链接文本
        newLink.href = url;

        // 模拟点击下载
        newLink.click();

        // 释放URL对象
        URL.revokeObjectURL(url);
    });
});

<button id="save-btn">保存联系人</button>