Cara membagikan Image-Url ke Facebook, twitter dan Instagram di React JS

Saya memiliki halaman tempat Pengguna dapat mengunggah gambarnya dan mengeditnya dengan menggunakan satu Api.

Sekarang menggunakan gambar yang diterima, dalam format url, perlu dibagikan di media sosial seperti Facebook, Twitter dan Instagram.

Berikut adalah Url yang digunakan untuk pengalihan media sosial:

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- Belum menemukannya

Hal yang Dicoba: Mencoba menambahkan {imageUrl} yang disimpan dalam status ke tag meta secara dinamis menggunakan createElement dan setAttribute di komponenDidMount, yang tidak memperbarui gambar ini di facebook tetapi dapat menambahkan gambar ini di og:image di tag head->meta. Mohon berikan saya beberapa solusi. Ini akan sangat membantu.

           <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 sumber
comment
Jika Anda ingin mencoba paket npm, cobalah paket 'react-share'.   -  person pritam    schedule 20.01.2020

Jawaban (1)


arrow_upward
3
arrow_downward

Jawaban yang saya terapkan adalah sebagai berikut. Asumsikan URL Facebook adalah

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

Anda dapat menambahkan URL gambar dinamis ke atribut imageurl dan crawler facebook akan menuju ke https:example.com/imageurl=https://imageurl.url.com. Kemudian, Anda harus mengekstrak parameter kueri dan menambahkan imageurl-URI, dan terakhir mengembalikannya dari getInitialProps jika Anda menggunakan JS BERIKUTNYA.

Apapun ekstrak URI dari imageurl dapat saya tambahkan ke tag meta og:image.

person Amrutha VS    schedule 21.02.2020