Pertama - saya tidak percaya ini adalah masalah duplikat. Saya telah mencari masalah yang sama atau serupa pada SO secara luas, dan karena sifat pemecahan masalah sebelum bertanya, saya percaya masalah ini unik.
Facebook tidak dapat memahami og:image
file saya dan saya telah mencoba setiap solusi yang biasa. Saya mulai berpikir itu mungkin ada hubungannya denganhttps://...
- Saya telah memeriksa http://developers.facebook.com/tools/debug dan tidak memiliki peringatan atau kesalahan.
- Itu menemukan gambar yang kami tautkan di "
og:image
", tetapi gambar itu muncul kosong. Ketika kita mengklik gambar, mereka memang ada dan dibutuhkan langsung ke mereka. - Ini TIDAK menunjukkan satu gambar - gambar yang di-host di server non-https.
- Kami telah mencoba gambar persegi, jpeg, png, ukuran lebih besar dan ukuran lebih kecil. Kami telah meletakkan gambar di public_html. Nol muncul.
- Ini bukan kesalahan caching, karena ketika kita menambahkan yang lain
og:image
ke meta, FB's linter menemukan dan membacanya. Itu TIDAK menunjukkan pratinjau. Pratinjau kosong. Satu- satunya pengecualian yang kami dapatkan adalah untuk gambar yang tidak ada di situs web ini. - Kami pikir mungkin ada beberapa anti-pelindian
cpanel
atau.htaccess
yang mencegah gambar muncul, jadi kami memeriksa. Tidak ada. Kami bahkan melakukan quick< img src="[remote file]" >
pada server yang sama sekali berbeda dan gambar muncul dengan baik. - Kami pikir mungkin itu
og:type
keanehan lain dengan tag meta lain. Kami menghapus semuanya, satu per satu dan memeriksanya. Tidak ada perubahan. Hanya peringatan. - Kode yang sama di situs web yang berbeda muncul tanpa masalah.
- Kami pikir mungkin itu tidak menarik gambar karena kami menggunakan halaman produk yang sama untuk beberapa produk (mengubahnya berdasarkan nilai get, yaitu, "details.php? Id = xxx") tetapi masih menarik dalam satu gambar (dari url yang berbeda).
- Membiarkan apapun
og:image
atau image_src tidak aktif, FB tidak menemukan gambar.
Saya berada di ujung tali saya. Jika saya mengatakan berapa banyak waktu yang saya dan orang lain habiskan untuk ini, Anda akan terkejut. Masalahnya adalah bahwa ini adalah toko online. Kami benar-benar, secara positif TIDAK TIDAK dapat memiliki gambar. Kita harus. Kami memiliki sepuluh atau lebih situs lain ... Ini adalah satu-satunya yang og:image
bermasalah. Ini juga satu-satunya https
, jadi kami pikir mungkin itu masalahnya. Tetapi kami tidak dapat menemukan preseden apa pun di web untuk itu.
Ini adalah meta-tag:
<meta property="og:title" content="[The product name]" />
<meta property="og:description" content="[the product description]" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-art-black.png" />
<meta property="og:image" content="http://www.[ADIFFERENTwebsite].com/wp-content/uploads/2011/06/ARS-Header-Shine2.png" />
<meta property="og:image" content="https://www.[ourwebsite].com/images/ARShopHeader.png" />
<meta property="og:image" content="http://www.[ourwebsite].com/overdriven-blues-music-tshirt-art-black.JPG" />
<meta property="og:type" content="product"/>
<meta property="og:url" content="https://www.[ourwebsite].com/apparel-details.php?i=10047" />
<meta property="og:site_name" content="[our site name]" />
<meta property="fb:admins" content="[FB-USER-ID-NUMBER]"/>
<meta name="title" content="[The product name]" />
<meta name="description" content="[The product description]" />
<link rel="image_src" href="https://www.[ourwebsite].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />
<meta name="keywords" content="[four typical keywords]">
<meta name="robots" content="noarchive">
Jika Anda menginginkannya, inilah tautan ke salah satu halaman produk kami yang sedang kami kerjakan. [Tautan disingkat untuk mencoba mengekang ini masuk ke hasil pencarian untuk situs kami]: http://rockn.ro/114
Sunting ----
Dengan menggunakan alat scraper "lihat apa yang dilihat facebook", kami dapat melihat yang berikut:
"image": [
{
"url": "https://www.[httpSwebsite].com/images/shirts/soul-man-soul-music-tshirt-details-safari.png"
},
{
"url": "https://www.[httpSwebsite].com/images/shirts/soul-man-soul-music-tshirt-art-safari.png"
},
{
"url": "http://www.[theotherNONSECUREwebsite].com/wp-content/uploads/2011/06/ARS-Header-Shine2.png"
}
],
Kami menguji semua tautan yang ditemukan untuk satu halaman. Semua itu adalah gambar yang benar-benar valid.
EDIT 2 ----
Kami mencoba tes dan menambahkan subdomain ke situs web NONSECURE (dari mana gambar benar-benar terlihat melalui facebook). Subdomain adalah http: // img. [Nonsecuresite] .com. Kami kemudian memasukkan semua gambar ke folder subdomain utama dan mereferensikannya. Itu tidak akan menarik gambar-gambar itu ke FB. Namun, masih akan menarik gambar yang dirujuk pada domain utama nonsecure.
WORKAROUND POSTED ----
Berkat Keegan, kita sekarang tahu bahwa ini adalah bug di Facebook. Untuk mengatasinya, kami menempatkan subdomain di situs web NON-HTTPS yang berbeda dan membuang semua gambar di dalamnya. Kami mereferensikan http://img.otherdomain.com/[like-image.jpg]
gambar koordinasi di og:image
setiap halaman produk. Kami kemudian harus melalui FB Linter dan menjalankan tautan SETIAP untuk menyegarkan data OG. Ini berhasil, tetapi solusinya adalah solusi band-bantuan, dan jika https
masalah ini diperbaiki dan kami kembali menggunakan domain https alami, FB akan men-cache gambar dari situs web yang berbeda, masalah rumit. Semoga informasi ini membantu menyelamatkan orang lain dari kehilangan 32 jam pengkodean dalam hidup mereka .
sumber
og:type: og_products:product
untuk mengetik situs web dan melihat apakah gambar dapat diambil.Jawaban:
Saya mengalami masalah yang sama dan melaporkannya sebagai bug di situs pengembang Facebook. Tampaknya cukup jelas bahwa
og:image
URI menggunakan HTTP berfungsi dengan baik dan URI menggunakan HTTPS tidak. Mereka sekarang telah mengakui bahwa mereka "melihat ke dalam ini."Pembaruan: Pada tahun 2020, bug tersebut tidak lagi terlihat di sistem tiket Facebook. Mereka tidak pernah menanggapi dan saya tidak percaya perilaku ini telah berubah. Namun, menentukan HTTPS URI
og:image:secure
tampaknya berfungsi dengan baik.sumber
Beberapa properti dapat memiliki metadata tambahan yang menyertainya. Ini ditentukan dengan cara yang sama seperti metadata lain dengan
property
dancontent
, tetapiproperty
akan memiliki tambahan:The
og:image
properti memiliki beberapa terstruktur sifat opsional:og:image:url
- Identik dengan og: gambar.og:image:secure_url
- URL alternatif untuk digunakan jika halaman web membutuhkan HTTPS.og:image:type
- Jenis MIME untuk gambar ini.og:image:width
- Jumlah piksel lebar.og:image:height
- Jumlah piksel tinggi.Contoh gambar lengkap:
Jadi, Anda perlu mengubah
og:image
properti untuk URL HTTPS Andaog:image:secure_url
Ex:
TAG META HTTPS UNTUK GAMBAR:
TAG META HTTP UNTUK GAMBAR:
Sumber: http://ogp.me/#struktur <- Anda dapat mengunjungi situs ini untuk informasi lebih lanjut.
Semoga ini bisa membantu Anda.
Sunting: Jangan lupa untuk melakukan ping ke server facebook setelah memperbarui kode Anda - URL Linter
sumber
See exactly what our scraper sees for your URL
klik padanya dan lihat apakah itu menunjukkan sumber lengkap tautan Anda atau pengupasan. apa pun. Jika salahcharset
diatur, maka scraper tidak akan dapat mengikis untuk beberapa alasan (saya telah menjawab pertanyaan serupa beberapa waktu lalu dengan masalah ini). Jadi pastikan semua hal ini benar.og:image
Tag dapat berupa HTTPS (yang dilakukan oleh StackExchange, YouTube, WordPress.com, Amazon, dll.) Ini agak membuat Anda bertanya-tanya untuk apaog:image:secure_url
sebenarnya?Saya tidak tahu, apakah itu hanya dengan saya tetapi bagi saya
og:image
tidak bekerja dan itu mengambil logo situs saya, meskipun debugger facebook menunjukkan gambar yang benar.Tetapi berubah
og:image
menjadiog:image:url
bekerja untuk saya. Semoga ini bisa membantu orang lain menghadapi masalah serupa.sumber
og:image:url
identik denganog:image
".Dapatkan di sini dari Google tetapi ini tidak banyak membantu saya. Ternyata ada rasio aspek minimum 3: 1 yang diperlukan untuk logo. Milik saya hampir 4: 1. Saya menggunakan Gimp untuk memotongnya tepat 3: 1 dan voila - logo saya sekarang ditampilkan di FB.
sumber
tl; dr - bersabarlah
Saya berakhir di sini karena saya melihat gambar kosong disajikan dari situs https. Masalahnya sangat berbeda:
[ https://developers.facebook.com/docs/sharing/best-practices/#precaching]
Saat pengujian, butuh Facebook sekitar 10 menit untuk akhirnya menampilkan gambar yang diberikan. Jadi ketika saya sedang menggaruk-garuk kepala dan melemparkan tag og acak di facebook (dan mencurigai masalah https yang disebutkan di sini), yang harus saya lakukan adalah menunggu.
Karena ini mungkin benar-benar menghentikan orang untuk membagikan tautan Anda untuk pertama kalinya, FB menyarankan dua cara untuk menghindari perilaku ini: a) menjalankan Debugger OG di semua tautan Anda: gambar akan di-cache dan siap untuk dibagikan setelah ~ 10 menit atau b ) menetapkan og: gambar: lebar dan og: gambar: tinggi. (Baca lebih lanjut di tautan di atas)
Masih bertanya-tanya apa yang membuat mereka begitu lama ...
sumber
og:image:width
danog:image:height
data saya tidak termasuk, maka Facebook harus memproses gambar setelah menggosoknya agar sesuai dengan dimensi mereka. Gambar juga akan dipotong, yang mungkin tidak diinginkan. Untuk detailnya, lihat: developers.facebook.com/docs/sharing/best-practices/#imagesSaya memiliki kesalahan yang sama dan tidak ada yang sebelumnya telah membantu, jadi saya mencoba mengikuti dokumentasi asli dari Open Graph Protocol dan saya menambahkan atribut awalan ke tag html saya dan semuanya menjadi luar biasa.
sumber
Saya punya masalah serupa. Saya menghapus properti = "og: image: secure_url" dan sekarang akan menggosok hanya dengan og: image. Terkadang, lebih sedikit lebih banyak
sumber
Saya menemukan skenario lain yang dapat menyebabkan masalah ini. Saya melewati semua langkah yang dijelaskan dalam pertanyaan dan jawaban, masih ada masalah.
Saya memeriksa gambar saya dan menemukan bahwa beberapa posting saya memiliki gambar thumbnail yang terlalu besar
og:image
dalam kisaran beberapa ribu piksel dan beberapa megabita.Ini terjadi karena migrasi baru-baru ini dari WP ke Jekyll, saya mengoptimalkan gambar saya dengan tegukan, tetapi menggunakan gambar asli di og: gambar secara tidak sengaja.
Facebook memberi kami rekomendasi berikut sampai hari ini :
Jadi ada batas atas 8MB.
sumber
Seperti yang saya tidak sengaja temukan, gambar kosong transparan datang dengan tajuk respons yang menunjukkan kemungkinan penyebab masalah.
https://external-ams3-1.xx.fbcdn.net/safe_image.php?d=...&url=...
)x-error-detail
tajuk respons dengan penjelasanSebagai contoh, dalam kasus saya itu
Invalid image extension for URL: https://[mydomain]/[myfilename].jpg
Masalah sebenarnya dalam kasus saya terkait dengan prerender.io .
Ternyata, jika gambar diminta melalui prerender, itu dikonversi ke HTML. Sesuatu seperti ini:
Entah itu bug dalam prerender itu sendiri, atau itu seharusnya dikonfigurasi dalam proxy Anda untuk tidak menggunakan prerender untuk
*.jpg
permintaan (bahkan jika mereka diminta oleh Facebook bot).Sangat sulit untuk memperhatikan hal ini, karena prerender hanya digunakan pada header agen-pengguna tertentu.
sumber
Saya mengalami masalah yang sama dan kemudian saya perhatikan bahwa saya memiliki domain yang berbeda untuk
og:url
Setelah saya memastikan bahwa domain itu sama untuk
og:url
danog:image
itu berhasil.Semoga ini membantu.
sumber
Dalam kasus saya masalahnya adalah tidak menyediakan CA Root Certificate . Saya menemukan jawabannya setelah menggunakan: https://www.ssllabs.com/ssltest/analyze.html untuk menganalisis konfigurasi SSL.
sumber
Gejala serupa (Facebook dkk tidak mengambil dengan benar: gambar dan aset lainnya di atas https) dapat terjadi ketika sertifikat https situs tidak sepenuhnya patuh.
Sertifikat https situs Anda mungkin tampak valid (kunci hijau di peramban dan semua), tetapi sertifikat itu tidak akan mengorek dengan benar jika tidak ada sertifikat perantara atau rantai. Hal ini dapat menyebabkan banyak waktu yang terbuang memeriksa dan memeriksa ulang semua berbagai cache dan tag meta.
Mungkin bukan masalah Anda, tetapi bisa jadi orang lain dengan gejala yang sama (seperti saya). Ada banyak cara untuk memeriksa sertifikat Anda - yang kebetulan saya gunakan: https://www.sslshopper.com/ssl-checker.html
sumber
Saya mengambil
http://
dari sayaog:image
dan menggantinya dengan hanya tuawww.
lalu mulai bekerja dengan baik.Anda dapat menggunakan alat ini, oleh Facebook untuk mengatur ulang cache pengikis gambar Anda dan menguji URL apa yang ditariknya untuk gambar demo.
sumber
Saya dapat melihat bahwa Debugger mengambil 4
og:image
tag dari URL Anda.Gambar pertama adalah yang terbesar dan karenanya membutuhkan waktu paling lama untuk dimuat. Coba menyusutkan gambar pertama ke bawah atau ubah urutan untuk menampilkan gambar yang lebih kecil terlebih dahulu.
sumber
Selain itu, masalah ini juga terjadi ketika Anda menambahkan cerita yang dibuat pengguna (di mana Anda tidak menggunakan og: image). Sebagai contoh:
Di atas hanya akan berfungsi dengan http dan tidak dengan https. Jika Anda menggunakan https, Anda akan mendapatkan kesalahan yang mengatakan: Gambar terlampir () gagal diunggah
sumber
Jangan lupa menyegarkan server melalui:
Debugger Facebook
Dan klik "Kumpulkan info baru"
sumber
Punya masalah yang sama hari ini, yang membantu saya menyelesaikan Debugger Berbagi . Tampaknya Facebook tidak dapat (saat ini) memahami gambar dengan metadata XMP yang disematkan. Ketika saya mengganti gambar pada artikel kami dengan versi tanpa metadata XMP, dan menggores ulang halaman (menggunakan Sharing Debugger), masalahnya hilang. Editor heks akan membantu Anda melihat apakah gambar Anda mengandung metadata XMP atau tidak.
sumber
Dalam kasus saya, tampaknya perayap hanya memiliki bug. Saya sudah mencoba:
Tak satu pun dari ini bekerja. Ini menghabiskan waktu seminggu. Dan tiba-tiba entah dari mana rasanya berhasil kembali.
Inilah penelitian saya, jika seseorang memenuhi masalah ini lagi:
Juga, ada lebih banyak checker selain Object Debugger Facebook yang dapat Anda periksa: OpenGraphCheck.com , Tester Grafik Terbuka Abhinay Rathore , Kode Tanam Iframely , Validator Kartu | Pengembang Twitter .
sumber
OK ... Saya menyadari utas ini sudah tua dan penuh sesak, tetapi kalau-kalau ada yang datang seperti saya berjuang untuk mendapatkan og mereka: tag gambar untuk berfungsi langsung di Facebook, inilah trik yang bekerja untuk saya:
JANGAN gunakan tautan ini:
https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fwww.google.com
untuk mengatasi masalah Anda. Atau jika Anda melakukannya, segera gulir ke bawah dan klik pada Scrape VIA API.
https://developers.facebook.com/tools/explorer/?method=POST&path=%3Fscrape%3Dtrue%26id%3Dhttps%3A%2F%2Fwww.google.com&version=v5.0
Ada kesalahan yang ditampilkan di alat explorer yang TIDAK ditampilkan di alat "debug". Gila !!! (dalam kasus saya, spasi dalam nama file gambar mengetuk gambar saya secara diam-diam di alat debug, tapi itu menunjukkan kesalahan dalam alat explorer).
sumber
Saya menemukan alasan lain untuk gambar tidak ditampilkan pada kartu FB. Selain itu, dengan menggunakan alat scraper FB untuk men-debug tag meta og , saya bisa mengonfirmasi semua tag yang diperlukan di mana ada di halaman WordPress saya, namun saya akan mendapatkan kesalahan pengunduhan file berikut,
Saya memiliki perasaan yang samar-samar bahwa format gambar memiliki masalah, tautan ke gambar berfungsi, tetapi pesan tersebut tampaknya mengindikasikan sesuatu yang salah dengan pengkodean konten.
Setelah banyak pencarian, saya akhirnya melihat ekstensi php yang diperlukan untuk server WordPress , dan menyadari modul pho-exif tidak diinstal. Modul exif menulis metadata exif ke semua gambar yang diunggah. Akibatnya gambar yang digunakan dalam tag gambar FB og tidak memiliki metadata exif yang terkait dengannya.
Setelah modul exif diaktifkan, WordPress memungkinkan metifata exif diatur ulang untuk suatu gambar (Pustaka media-> pilih dan gambar-> Edit lebih detail-> Metadata peta exif) dan gambar sekarang muncul di kartu FB seperti yang diharapkan.
sumber
Dari apa yang saya amati, saya melihat bahwa ketika situs web Anda bersifat publik dan meskipun url gambarnya adalah https, itu berfungsi dengan baik.
sumber
Bagi saya ini berhasil:
sumber
Setelah beberapa jam menguji dan mencoba berbagai hal ...
Saya memecahkan masalah ini sesederhana mungkin. Saya perhatikan bahwa mereka menggunakan "halaman pengujian" di dalam Halaman Pengembang Facebook yang hanya berisi tag "og" dan beberapa teks dalam tag tubuh yang merujuk tag og ini.
Jadi apa yang telah saya lakukan?
Saya membuat tampilan kedua di aplikasi saya, berisi hal-hal yang sama yang mereka gunakan.
Dan bagaimana saya tahu Facebook mengakses halaman saya sehingga saya dapat mengubah tampilan? Mereka memiliki Agen Pengguna unik: "facebookexternalhit / 1.1"
sumber
Setelah Anda memperbarui tag meta, pastikan tautan konten (gambar) adalah jalur absolut dan buka di sini
https://developers.facebook.com/tools/debug/sharing
masukkan tautan situs Anda dan klikscrape again
di halaman berikutnyasumber