1、twitter card 是如何定制website分享到twitter以后,在twitter timeline里显示的卡片样式的方式,就跟定制h5分享到朋友圈的卡片样式一样。twitter和微信不太一样,微信分享给好友的卡片定制以及分享到朋友圈的卡片样式定制是通过weixin jssdk,但是twitter里没有jssdk,twitter里分享卡片的样式定制方式,是通过爬虫爬取html文本,解析head里的meta标签实现的,详细参见下方链接:
(1)https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards
(2)https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started
2、通过配置html中的meta标签以后,我的h5链接分享到twitter以后,并没有自动显示分享卡片,只是高亮了一下。twitter card开发有个校验卡片配置是否生效的工具(参见https://cards-dev.twitter.com/validator):校验我的链接得到的信息为:

3 而观察twitter里有卡片的链接,例如https://www.nationalgeographic.com/animals/article/monkey-labor-continues-in-thailands-coconut-market?cmpid=org=ngp::mc=social::src=twitter::cmp=editorial::add=tw20210219animals-monkeylaborthailand::rid=&sf243219838=1,得到的结果为:

4 在twitter社区里发现一个帖子,里面有twitter员工反馈说,ERROR: Fetching the page failed because the fetcher cannot resolve the address 是因为他们的dns服务器访问不了对应的域名导致的:


5 我们更换了好几个国内的域名服务商的域名,都是类似的问题,但是直接使用ip+uri的链接在(参见https://cards-dev.twitter.com/validator)是可以预览卡片的,但是直接把ip+uri的链接发到twitter的推文里,会被当做是普通文本,不会当作链接,更不会启动爬虫系统获取链接里的meta标签来自动显示分享卡片。
6 由此我们猜测,twitter的爬虫系统使用的dns系统识别不了国内的域名,于是去买了一个便宜的境外域名(从新加坡的服务商www.godaddy.com,链接是从简书帖子上看到的),果然生效了,在校验工具(参见https://cards-dev.twitter.com/validator)里可以预览卡片,发到twitter推文里也会自动识别并显示分享卡片。