0

我已经提供了所有元标记和 og 属性以使用 react share 在社交网站上共享图像。问题是图像没有预览。我试图在 facebook 共享调试器中进行调试。在调试器中，图像是预览。那么如何修复这个问题。我尝试了很多，但无法修复。在此先感谢。

meta 和 og 属性是

import React from "react";
import { Helmet } from "react-helmet";
// import { useLocation } from "react-router-dom";
export default function HelmetMetaData(props) {
   let currentUrl="http://localhost:3000"
   let quote = props.quote !== undefined ? props.quote : "";
   let title = props.title !== undefined ? props.title : "CampersTribe - World is yours to explore";
   let image = props.image !== undefined ? props.image : "https://storage.googleapis.com/cmperstribe_storage_usha/Banner/IMG_3640.JPG";
   let description = props.description !== undefined ? props.description  : "CampersTribe lets you experience the camping culture. We discover the hidden gems in the nearby to help you connect with nature & yourself by learning in the woods, on the riverbank under the open sky." +
"Trust us, its million dollars experience to ride away from city life, pitch a tent, do campfire and endless talk!" +
"So, join us on this voyage, and explore the beauty and miracle of being yourself!";
   let hashtag = props.hashtag !== undefined ? props.hashtag : "#camperstribe";
return (
 <Helmet>
     <title>{title}</title>
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="csrf_token" content="" />
     <meta property="type" content="website" />
     <meta property="url" content="http://localhost:3000" />
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
     <meta name="msapplication-TileColor" content="#ffffff" />
     <meta name="msapplication-TileImage" content="/ms-icon-144x144.png" />
     <meta name="theme-color" content="#ffffff" />
     <meta name="_token" content="" />
     <meta name="robots" content="noodp" />
     <meta property="title" content={title} />
     <meta property="quote" content={quote} />
     <meta name="description" content={description} />
     <meta property="image" content={image} />
     <meta property="og:locale" content="en_US" />
     <meta property="og:type" content="website" />
     <meta property="og:title" content={title} />
     <meta property="og:quote" content={quote} />
     <meta property="og:hashtag" content={hashtag} />
     <meta property="og:image" content={image} />
     <meta content="image/*" property="og:image:type" />
     <meta property="og:url" content={currentUrl} />
     <meta property="og:site_name" content="CampersTribe" />
     <meta property="og:description" content={description} /> 
     <meta property="fb:app_id" content="350501876869766"/>
        </Helmet>
);
}

分享.js

const Share=()=>{
return(
<>
<HelmetMetaData image="https://firebasestorage.googleapis.com/v0/b/fb-20-8a602.appspot.com/o/posts%2FScreenshot%20(5).png?alt=media&token=6423c7cf-9fa8-499b-b241-42ec51f58a19" ></HelmetMetaData> 
 <FacebookShareButton
url={"https://firebasestorage.googleapis.com/v0/b/fb-20-8a602.appspot.com/o/posts%2FScreenshot%20(5).png?alt=media&token=6423c7cf-9fa8-499b-b241-42ec51f58a19"}
// quote={session.user.name}
// hashtag={"#"+session.user.email.split('@')[0]}
description={"aiueo"}
className="Demo__some-network__share-button"
beforeOnClick={clickEvent}
>
<FacebookIcon size={32} round />
</FacebookShareButton>
</>
)
}
4

0 回答 0