vCard

vCard

在翻阅dottoro的时候，在附录（appendix）的js部分，注意到一个叫vCard的部分，能单独列出来，可能是比较重要的，至少是比较独立的部分，但是以前从未听说或者了解过这一部分，如果有兴趣了解的，继续往下看。

 

vCard 规范容许公开交换个人数据交换 (Personal Data Interchange PDI) 信息。 vCard 规范可作为各种应用或系统之间的交换格式。可能是文件系统，点对点交换的公共电话网络，以有线网络或无线传送的方式，但是一般附加在电子邮件中，电子邮件能转发vCard中人信息。网页上很多用户填写的表格可自动使用vCard。

 

vCard（或称做Versitcard）最早是由Versit联盟于1995年提出的，当时联盟成员包括苹果公司，AT&T科技（后来的朗讯），IBM及西门子。在1996年十二月，格式的拥有权移至因特网邮件联盟（IMC），该联盟是由一些关注因特网电子邮件的公司所组成。vCard标准的2.1版被电子邮件客户端广泛支持。

 

BEGIN:VCARD
VERSION:4.0
N:Gump;Forrest;;;
FN:Forrest Gump
ORG:Bubba Gump Shrimp Co.
TITLE:Shrimp Man
PHOTO;MEDIATYPE=image/gif:http://www.example.com/dir_photos/my_photo.gif
TEL;TYPE=work,voice;VALUE=uri:tel:+1-111-555-1212
TEL;TYPE=home,voice;VALUE=uri:tel:+1-404-555-1212
ADR;TYPE=work;LABEL="100 Waters Edge\nBaytown, LA 30314\nUnited States of America"
  :;;100 Waters Edge;Baytown;LA;30314;United States of America
ADR;TYPE=home;LABEL="42 Plantation St.\nBaytown, LA 30314\nUnited States of America"
 :;;42 Plantation St.;Baytown;LA;30314;United States of America
EMAIL:forrestgump@example.com
REV:20080424T195243Z
END:VCARD

<?xml version="1.0" encoding="UTF-8"?>
<vcards xmlns="urn:ietf:params:xml:ns:vcard-4.0">
  <vcard>
    <n>
      <surname>Gump</surname><ref>{{cite web|last=Perreault|first=Simon|url=http://tools.ietf.org/html/rfc6351|publisher=Internet Engineering Task Force (IETF)|accessdate=18 September 2013}}</ref> 
      <given>Forrest</given>
    </n>
    <fn><text>Forrest Gump</text></fn>
    <title><text>Shrimp Man</text></title>
    <photo>
        <parameters>
            <mediatype><text>image/gif</text></mediatype>
        </parameters>
        <uri>http://www.example.com/dir_photos/my_photo.gif</uri>
    </photo>
    <tel>
      <parameters>
        <type>
          <text>work</text>
          <text>voice</text>
        </type>
      </parameters>
      <uri>tel:+1-111-555-1212</uri>
    </tel>
    <tel>
      <parameters>
        <type>
          <text>home</text>
          <text>voice</text>
        </type>
      </parameters>
      <uri>tel:+1-404-555-1212</uri>
    </tel>
    <adr>
      <parameters>
        <type><text>work</text></type>
        <label><text>100 Waters Edge
Baytown, LA 30314
United States of America</text></label>
      </parameters>
      <pobox/>
      <ext/>
      <street>100 Waters Edge</street>
      <locality>Baytown</locality>
      <region>LA</region>
      <code>30314</code>
      <country>United States of America</country>
    </adr>
    <adr>
      <parameters>
        <type><text>home</text></type>
        <label><text>100 Waters Edge
Baytown, LA 30314
United States of America</text></label>
      </parameters>
      <pobox/>
      <ext/>
      <street>42 Plantation St.</street>
      <locality>Baytown</locality>
      <region>LA</region>
      <code>30314</code>
      <country>United States of America</country>
    </adr>
    <email><text>forrestgump@example.com</text></email>
    <rev><timestamp>20080424T195243Z</timestamp></rev>
  </vcard>
</vcards>

["vcardstream",
  ["vcard",
    [
      ["version", {}, "text", "4.0"],
      ["n", {}, "text", ["Gump", "Forrest", "", "", ""]],
      ["fn", {}, "text", "Forrest Gump"],
      ["org", {}, "text", "Bubba Gump Shrimp Co"],
      ["title", {} ,"text", "Shrimp Man"],
      ["photo", {"mediatype":"image/gif"}, "uri", "http://www.example.com/dir_photos/my_photo.gif"],
      ["tel", {"type":["work", "voice"]}, "uri", "tel:+1-111-555-1212"],
      ["tel", {"type":["home", "voice"]}, "uri", "tel:+1-404-555-1212"],
      ["adr",
        {"label":"100 Waters Edge\nBaytown, LA 30314\nUnited States of America", "type":"work"},
        "text",
        ["", "", "100 Waters Edge", "Baytown", "LA", "30314", "United States of America"]
      ],
      ["adr",
        {"label":"42 Plantation St.\nBaytown, LA 30314\nUnited States of America", "type":"home"},
        "text",
        ["", "", "42 Plantation St.", "Baytown", "LA", "30314", "United States of America"]
      ],
      ["email", {}, "text", "forrestgump@example.com"],
      ["rev", {}, "timestamp", "2008-04-24T19:52:43Z"]
    ]
  ]
]

<html>
  <head>
    <link rel="profile" href="http://microformats.org/profile/hcard" />
  </head>
  <body>
    <div class="vcard">
      <img class="photo" src="http://www.example.com/dir_photos/my_photo.gif" align="left" />
      <h1 class="fn">Forrest Gump</h1>
      <div class="email">
        <span class="type">Internet</span> Email (<span class="type">pref</span>erred):
        <a class="value" href="mailto:forrestgump@example.com">forrestgump@example.com</a>
      </div>
      <div class="n">
        First Name: <span class="given-name">Forrest</span><br>
        Last Name: <span class="family-name">Gump</span>
      </div>
 
      <div class="label" style="display:none">
        <span class="type">home</span>
        42 Plantation St.<br>Baytown, LA 30314<br>United States of America
      </div>
      <div class="adr">
        <span class="type">Home</span> Address:<br>
        <span class="street-address">42 Plantation St.</span><br>
        <span class="locality">Baytown</span>, <span class="region">LA</span>
        <span class="postal-code">30314</span><br>
        <span class="country-name">United States of America</span>
      </div>
      <div class="tel">
         <abbr class="type" title="voice"></abbr>
         <span class="type">Home</span> Phone: <span class="value">+1-111-555-1212</span>
      </div>
 
      <div>
        Organization: <span class="org">Bubba Gump Shrimp Co.</span><br>
        Title: <span class="title">Shrimp Man</span>
      </div>
 
      <div class="label" style="display:none">
        <span class="type">work</span>
        100 Waters Edge<br>Baytown, LA 30314<br>United States of America
      </div>
      <div class="adr">
        <span class="type">Work</span> Address:<br>
        <span class="street-address">100 Waters Edge</span><br>
        <span class="locality">Baytown</span>, <span class="region">LA</span>
        <span class="postal-code">30314</span><br>
        <span class="country-name">United States of America</span>
      </div>
      <div class="tel">
         <abbr class="type" title="voice"></abbr>
         <span class="type">Work</span> Phone: <span class="value">+1-404-555-1212</span>
      </div>
 
      <em>vCard last updated:</em>
      <time class="rev" datetime="2008-04-24T19:52:43Z">April 24, 2008 at 7:52 PM GMT</time>
    </div>
  </body>
</html>

其中hCard是一种微格式

使得vCard可以被嵌入到HTML页面中。它利用CSS class属性定义每个vCard属性。

像这样<img class="photo" src="http://www.example.com/dir_photos/my_photo.gif" align="left" />，表示属性为photo，值是'http://...'.

所有的vCard必须是以BEGINl:VCARD开始，由END:VCARD结尾，所有的VCARD必须包含VERSION信息。

详细的属性列表，请看这里。

 

说了这么多，对于做前端开发的，比较容易接受的将vCard比作json，和json类似，都是特定的格式，vCard常用于记录个人/企业信息方面，而JSON擅长与后台的数据交互。但是，JSON和vCard之间是可以互相转换的，vcard-json 。

 

在IE中,window.navigator对象中有个成员是userProfile,依赖其特有的方法，调用vCard数据， 参考这里。

虽然只被IE支持，而且IE7以后就废弃了，不妨了解了解。