无需登录 数据私有 本地保存

网页元数据查看器 - Open Graph/Twitter Card

11
0
0
0

网页元数据查看器

检测 Open Graph / Twitter Card / SEO 元标签，预览社交媒体分享效果

快速体验：

正在获取网页元数据...

Facebook / Open Graph 预览
—
—
—
Twitter Card 预览
—
—
—
📋 关键标签检查
📊 Open Graph 标签详情
属性 内容
暂无数据
🐦 Twitter Card 标签详情
属性 内容
暂无数据
🔍 其他SEO元标签
名称 内容
暂无数据
📝 原始Meta标签 (共 0 个)

输入网页URL开始检测

查看网页在社交媒体上的分享预览效果

常见问题

Open Graph (OG) 是由 Facebook 于2010年推出的开放图谱协议，它通过 <meta property="og:xxx"> 标签让网页在社交媒体上被分享时能展示丰富的预览卡片（包含标题、描述、缩略图等）。如今已被 LinkedIn、Slack、Discord、WhatsApp、Telegram 等几乎所有主流平台广泛采用。没有 OG 标签的网页在分享时可能只显示一个裸露的链接，严重影响点击率和用户体验。

Twitter Card 是 Twitter/X 平台专用的元数据标准，使用 twitter: 前缀。虽然 Twitter 在2018年后也支持回退读取 OG 标签（当 twitter 标签缺失时），但为了精确控制在不同平台上的展示效果，强烈建议同时设置两套标签。特别是 twitter:card 决定了卡片类型（summary / summary_large_image / player），而 OG 没有这个区分。最佳实践是让两者共存，且内容保持一致。

Facebook 推荐 1200×630 像素（比例 1.91:1），这是最通用的尺寸，在绝大多数平台都能良好展示。Twitter summary_large_image 推荐 1200×675（比例 16:9）。格式方面，JPEG 和 PNG 均可，文件大小建议不超过 5MB（Facebook）或 1MB（Twitter）。务必使用绝对URL而非相对路径，否则平台可能无法正确抓取图片。另外，图片内容中文字占比不宜过大，避免被平台裁切后信息丢失。

常见原因包括：① 缓存问题——Facebook/Twitter 会缓存抓取结果，修改后需使用官方调试工具手动刷新（Facebook Sharing Debugger、Twitter Card Validator）；② 标签位置——OG标签必须在 <head> 中，且建议放在所有JS/CSS之前；③ 图片URL不是绝对路径或无法公开访问；④ 服务器响应过慢（超过10秒）导致爬虫超时；⑤ robots.txt 或 X-Robots-Tag 阻止了爬虫访问。使用本工具可以快速检查标签是否正确嵌入，然后配合官方调试工具刷新缓存。

最常见的 og:type 值包括：website（通用网站/首页）、article（文章/博客，Facebook会特别展示作者和发布时间）、product（商品页，可配合 product:price 等标签）、video.movie（视频内容）、profile（个人主页）、book（书籍）、music.album（音乐专辑）。正确设置 type 能让平台更好地理解页面内容类型，从而给予更精准的展示和推荐。如果不确定，使用 website 即可。

本工具通过 CORS 代理服务获取目标网页的原始 HTML，然后在浏览器端使用 DOMParser 解析 <meta> 标签。由于浏览器的同源策略限制，直接从客户端抓取其他域名会失败，因此依赖代理中转。如果您需要更高的稳定性，可以在自己的服务器上部署后端代理（如 Cloudflare Workers、Node.js 等），然后修改本工具的代理地址。
🔧 相关工具