Блог

Я предоставил все мета-теги и свойства 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 amp; 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 (  lt;Helmetgt;  lt;titlegt;{title}lt;/titlegt;  lt;meta charset="utf-8" /gt;  lt;meta http-equiv="X-UA-Compatible" content="IE=edge" /gt;  lt;meta name="csrf_token" content="" /gt;  lt;meta property="type" content="website" /gt;  lt;meta property="url" content="http://localhost:3000" /gt;  lt;meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/gt;  lt;meta name="msapplication-TileColor" content="#ffffff" /gt;  lt;meta name="msapplication-TileImage" content="/ms-icon-144x144.png" /gt;  lt;meta name="theme-color" content="#ffffff" /gt;  lt;meta name="_token" content="" /gt;  lt;meta name="robots" content="noodp" /gt;  lt;meta property="title" content={title} /gt;  lt;meta property="quote" content={quote} /gt;  lt;meta name="description" content={description} /gt;  lt;meta property="image" content={image} /gt;  lt;meta property="og:locale" content="en_US" /gt;  lt;meta property="og:type" content="website" /gt;  lt;meta property="og:title" content={title} /gt;  lt;meta property="og:quote" content={quote} /gt;  lt;meta property="og:hashtag" content={hashtag} /gt;  lt;meta property="og:image" content={image} /gt;  lt;meta content="image/*" property="og:image:type" /gt;  lt;meta property="og:url" content={currentUrl} /gt;  lt;meta property="og:site_name" content="CampersTribe" /gt;  lt;meta property="og:description" content={description} /gt;   lt;meta property="fb:app_id" content="350501876869766"/gt;  lt;/Helmetgt; ); }  

Share.js

 const Share=()=gt;{ return( lt;gt; lt;HelmetMetaData image="https://firebasestorage.googleapis.com/v0/b/fb-20-8a602.appspot.com/o/posts/Screenshot (5).png?alt=mediaamp;token=6423c7cf-9fa8-499b-b241-42ec51f58a19" gt;lt;/HelmetMetaDatagt;   lt;FacebookShareButton url={"https://firebasestorage.googleapis.com/v0/b/fb-20-8a602.appspot.com/o/posts/Screenshot (5).png?alt=mediaamp;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} gt; lt;FacebookIcon size={32} round /gt; lt;/FacebookShareButtongt; lt;/gt; ) }