Как поделиться Image-Url с Facebook, Twitter и Instagram в React JS

У меня есть страница, на которой пользователь может загрузить свое изображение и отредактировать его с помощью одного API.

Теперь, используя полученное изображение в формате URL, необходимо поделиться в социальных сетях, таких как Facebook, Twitter и Instagram.

Ниже приведены URL-адреса, используемые для перенаправления социальных сетей:

Facebook - https://www.facebook.com/sharer.php?u= $ {window.location.href}? imageurl = $ {imageUrl} Twitter- https://twitter.com/intent/tweet?url= $ {window.location.href}? imageurl = $ {imageUrl} Instagram - еще не нашел

Вещи пробовали: Пытался добавить {imageUrl}, который хранится в состоянии, в метатеги динамически, используя createElement и setAttribute в componentDidMount, который не обновлял это изображение в facebook, но мог добавить это изображение в og: image в мета-тегах head->. Пожалуйста, дайте мне какое-нибудь решение. Это было бы большим подспорьем.

           <a
            data-pgaction-redirection="0"
            target="_blank"
            rel="noopener noreferrer"
            title={title}
            href=`{https://www.facebook.com/sharer.php?u=${window.location.href}? 
            imageurl=${this.state.imageUrl}}`
          >
           Facebook
          </a>

reactjs javascript share twitter instagram
person Amrutha VS    schedule 20.01.2020    source источник
comment
Если вы готовы попробовать пакет npm, попробуйте пакет «response-share».   -  person pritam    schedule 20.01.2020

Ответы (1)


arrow_upward
3
arrow_downward

Ответ, который я реализовал, следующий. Предположим, что URL-адрес Facebook

https://www.facebook.com/sharer.php?u=https:example.com?imageurl=${this.state.imageUrl}}

Вы можете добавить URL динамического изображения к атрибуту imageurl, и поисковые роботы facebook перейдут к https:example.com/imageurl=https://imageurl.url.com. Затем вы должны извлечь параметры запроса и добавить imageurl-URI и, наконец, вернуть его из getInitialProps, если вы используете NEXT JS.

Независимо от того, какой URI извлечения из imageurl я могу добавить в метатег og:image.

person Amrutha VS    schedule 21.02.2020