我得到了一个用 CRA 创建的 React 应用程序。在index.html中我得到了一些像这样的元标签:
<meta property="og:image" content="%PUBLIC_URL%/images/logo/logo192.png" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/images/logo/logo192.png" />
两个图像都存在 - 但对于 og:image 标签,找不到图像。
为什么会发生这种情况以及为什么只针对 og:image 标签?
仔细检查 URL,确保图像可公开访问,并检查是否有任何可能阻止图像加载的服务器端问题。 og:image 标签问题通常是验证绝对 URL 是否正确且可访问的问题。由于 apple-touch-icon 使用相对 URL 工作,并且 CRA 处理得很好,因此问题可能在于 og:image 使用的外部 URL。
index.html 元标签示例 以下是您的 index.html 的示例:
<meta property="og:title" content="My React App" />
<meta property="og:description" content="Description of my react app" />
<meta property="og:image" content="https://www.myaddress.io/images/logo/logo1200.png" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/images/logo/logo192.png" />