it-swarm-tr.com

FB Open Graph og: görüntü çekmiyor görüntü (muhtemelen https?)

İlk olarak - bu yok bunun yinelenen bir sorun olduğuna inanıyorum. SO 'da aynı veya benzer sorunları kapsamlı bir şekilde aradım ve sormadan önce sorun gidermenin niteliği nedeniyle, bu sorunun benzersiz olduğuna inanıyorum. 

Facebook og:image dosyalarımı kavrayamıyor ve her zamanki çözümü denedim. https://... ile bir ilgisi olabileceğini düşünmeye başladım.

  • http://developers.facebook.com/tools/debug adresini kontrol ettim ve sıfır uyarı ya da hata yaptım.
  • Bağladığımız görüntüleri "og:image" da buluyor, ancak boş görünüyorlar. Ancak, resimlere tıkladığımızda, onlar DO'YOR ve bu onlara doğrudan geliyor.
  • Bir görüntüyü gösterir - https olmayan bir sunucuda barındırılan görüntü.
  • Kare görüntüleri, JPEG'leri, PNG'leri, daha büyük boyutları ve daha küçük boyutları denedik. Görüntüleri public_html içine yerleştirdik. Sıfır geliyor.
  • Önbellekleme hatası değildir, çünkü metaya başka bir og:image eklediğimizde FB's linter bunu bulur ve okur. Bir önizleme gösteriyor. Önizleme boş. Aldığımız only istisnası, bu web sitesinde olmayan resimler içindir.
  • Belki cpanel veya .htaccess üzerinde görüntülerin görünmesini engelleyen bir sızıntı önleme olduğunu düşündük, bu yüzden kontrol ettik. Orada değildi. Tamamen farklı bir sunucuda hızlı bir < img src="[remote file]" > yaptık bile ve görüntü iyi görünüyor. 
  • Belki de bunun og:type ya da başka bir meta etiketi olan başka bir tuhaflık olduğunu düşündük. Hepsini tek tek çıkardık ve kontrol ettik. Değişiklik yok. Sadece uyarılar. 
  • Farklı bir web sitesinde aynı kod herhangi bir sorun olmadan gösterir. 
  • Belki görüntü çekmediğini düşündük çünkü birden fazla ürün için aynı ürün sayfalarını kullanıyoruz (get değerini temel alarak değiştiriyoruz, yani, "details.php? İd = xxx") ama yine de tek bir resmi çekiyor (farklı bir URL'den).
  • og:image veya image_src öğelerini kapalı bırakmak, FB herhangi bir görüntü bulamaz.

İpimin ucundayım. Ben ve başkalarının buna ne kadar zaman harcadığını söyleseydim, şok olurdunuz. Sorun şu ki bu bir çevrimiçi mağaza. Kesinlikle, kesinlikle görüntülere sahip olamayız. Zorundayız. On tane daha sitemiz var ... Bu og:image problemleri olan tek site. Aynı zamanda https'daki tek kişi bu, belki de sorunun bu olduğunu düşündük. Ancak bunun için web'de hiçbir yerde emsal bulamıyoruz. 

Bunlar meta-etiketler:

<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">

İsterseniz, işte üzerinde çalıştığımız ürün sayfalarımızdan birine bir link. [Bu, sitemizin arama sonuçlarına girmesini engellemeye çalışmak için bağlantı kısaltıldı]: http://rockn.ro/114

DÜZENLE ---- 

"Facebook'un gördüğü şeyleri gör" kazıyıcı aracını kullanarak şunları gördük: 

"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"
      }
   ],

Bulunan tüm bağlantıları tek bir sayfa için test ettik. Hepsi tamamen geçerli görsellerdi. 

EDIT 2 ----

Bir test denedik ve NONSECURE web sitesine bir alt alan adı ekledik (bu görüntüler aslında facebook üzerinden görülebilir). Alt etki alanı http: // img. [Nonsecuresite] .com. Daha sonra tüm görüntüleri ana alt etki alanı klasörüne koyduk ve bunlara başvurduk. Bu görüntüleri FB'ye çekmezdi. Bununla birlikte, güvenli olmayan ana etki alanında referans alınan tüm görüntüleri yine de çeker. 

POSTA ÇALIŞMASI

Keegan sayesinde artık bunun Facebook'ta bir hata olduğunu biliyoruz. Çözüm için, farklı NON-HTTPS web sitesine bir alt etki alanı yerleştirdik ve içindeki tüm resimleri yerleştik. Her ürün sayfasında, http://img.otherdomain.com/[like-image.jpg] içindeki koordinat og:image görüntüsüne başvurduk. Daha sonra FB Linter'i gözden geçirip OG verisini yenilemek için HERKES linkini kullanmak zorunda kaldık. Bu işe yaradı, ancak çözüm bir yara bandı çözüm çözümü ve eğer https sorunu çözülürse ve doğal https alanını kullanmaya geri dönersek, FB görüntüleri karmaşık hale getiren farklı bir web sitesinden önbellekleme yapacaktır. Umarım bu bilgi, başka birinin 32 kodlama saatini onların hayatını kaybetmesinden kurtarmaya yardımcı olur. 

274
Cyprus106

Aynı sorunu yaşadım ve bunu Facebook geliştirici sitesinde bir hata olarak bildirdim. Og: HTTP kullanan görüntü URI'leri gayet iyi görünüyor ve HTTPS kullanan URI'lar çalışmıyor. Şimdi "buna bakıyorlar" olduğunu kabul ettiler.

Hata burada görülebilir: https://developers.facebook.com/bugs/260628274003812

78
Keegan Quinn

Bazı özelliklerde eklenmiş meta veriler olabilir. Bunlar property ve content öğelerine sahip diğer meta verilerle aynı şekilde belirtilir, ancak property dosyasının ekstra değeri olacaktır:

og:image özelliği, isteğe bağlı yapılandırılmış bazı özelliklere sahiptir:

  • og:image:url - Og: image ile aynıdır. 
  • og:image:secure_url - Web sayfası HTTPS gerektiriyorsa kullanılacak bir
  • og:image:type - Bu görüntü için A MIME tipi. 
  • og:image:width - Geniş piksel sayısı.
  • og:image:height - Yüksek piksel sayısı.

Tam görüntü örneği:

<meta property="og:image" content="http://example.com/ogp.jpg" />
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" /> 
<meta property="og:image:type" content="image/jpeg" /> 
<meta property="og:image:width" content="400" /> 
<meta property="og:image:height" content="300" />

Bu yüzden HTTPS URL'leriniz için og:image özelliğini og:image:secure_url olarak değiştirmeniz gerekir.

Ör:

HTTPS META ETİKETİ ETİKETİ:

<meta property="og:image:secure_url" content="https://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />

RESİM İÇİN HTTP META ETİKETİ:

<meta property="og:image" content="http://www.[YOUR SITE].com/images/shirts/overdriven-blues-music-tshirt-details-black.png" />

Kaynak: http://ogp.me/#structured <- Daha fazla bilgi için bu siteyi ziyaret edebilirsiniz.

Umarım bu size yardımcı olur.

EDIT: Kodlarınızı güncelledikten sonra facebook sunucularına ping atmayı unutmayın - URL Linter

121
Syed I.R

Bilmiyorum, sadece benimle olursam ama benim için og:image çalışmıyor ve facebook debugger doğru resmi gösterse de site logomu seçiyor.

Ancak, og:imageog:image:url olarak değiştirmek benim için çalıştı. Umarım bu, benzer sorunla karşı karşıya kalan başka kimseye yardım eder.

13
lalit

Google’dan geldim ama bu bana pek yardımcı olmadı. Logo için gerekli olan minimum boy oranı 3: 1 olduğu ortaya çıktı. Benimki neredeyse 4: 1 idi. Gimp'i tam olarak 3: 1 oranında kırpmak için kullandım ve işte - logom şimdi FB'de gösteriliyor.

8
priiiiit

tl; dr - sabırlı olun

Buraya geldim çünkü https sitesinden boş görüntüler geliyordu. Sorun olsa da oldukça farklıydı:

İçerik ilk kez paylaşıldığında, Facebook tarayıcısı meta verileri çizer ve paylaşılan URL’den önbelleğe alır. Tarayıcı, oluşturulmadan önce bir resmi en az bir kez görmek zorundadır. Bu, bir içeriği paylaşan ilk kişinin işlenmiş bir görüntüyü görmeyeceği anlamına gelir

[ https://developers.facebook.com/docs/sharing/best-practices/#precaching]

Test yapılırken, oluşturulan görüntüyü göstermek için facebook yaklaşık 10 dakika aldı. Bu yüzden kafamı çizip facebook'a rastgele og etiketleri fırlatırken (ve burada belirtilen https probleminden şüpheleniyordum), tek yapmam gereken beklemekti.

Bu, insanların bağlantılarınızı ilk kez paylaşmasını gerçekten engelleyebileceğinden, FB bu davranışı atlatmanın iki yolunu önerir: A) OG Debugger'ı tüm bağlantılarınızda çalıştırmak: görüntü önbelleğe alınacak ve ~ 10'dan sonra paylaşıma hazır dakika veya b) og: image: width ve og: image: height değerini belirtir. (Yukarıdaki linke bakınız)

Hala onları bu kadar uzun süren şeyin ne olduğunu merak ediyorum.

6
panepeter

Aynı hatayı aldım ve önceki hiçbir şeyin faydası olmadı, bu yüzden Open Graph Protokolü dökümantasyonunu izlemeye çalıştım ve html etiketime önek niteliği ekledim ve her şey harika oldu.

<html prefix="og: http://ogp.me/ns#">
4
VoVaVc

Sunucuları şu yoldan yenilemeyi unutmayın: 

Facebook Hata Ayıklayıcı

Ve "Yeni bilgi topla" yı tıklayın

2
Scaraux

Ben de benzer problemler yaşadım. "= Og: image: secure_url" özelliğini kaldırdım ve şimdi sadece og: image ile ovulacak Bazen daha az

1
HappaGirl

Benim durumumda sorun CA Kök Sertifikasını vermeme idi. Kullandıktan sonra anladım: https://www.ssllabs.com/ssltest/analyze.html SSL yapılandırmasını analiz etmek için.

1
instead

Bu soruna neden olabilecek başka bir senaryo keşfettim. Soruda açıklanan tüm adımları ve cevapları okudum, sorun hala devam etti.

Fotoğraflarımı kontrol ettim ve bazı yazılarımın og:image içinde birkaç bin piksel ve birkaç megabayt aralığında çok küçük resimlere sahip olduğunu gördüm. 

Bu, WP 'den Jekyll'e olan son göç nedeniyle oldu, görüntüleri yutturmaca ile optimize ettim, ancak orijinal görüntüleri og olarak kullandım: yanlışlıkla resim. 

Facebook bize şu andan itibaren aşağıdaki önerileri veriyor

En iyi görüntü için en az 1200 x 630 piksel boyutundaki görüntüleri kullanın. yüksek çözünürlüklü cihazlar En azından, bu görüntüleri kullanmalısınız. daha büyük resimli link sayfası yazılarını görüntülemek için 600 x 315 pikseldir . Görüntüler en fazla 8 MB boyutunda olabilir.

Yani 8MB üst sınırı var.

1
Mark

Aynı sorunu yaşadım ve ardından og:url için farklı bir etki alanım olduğunu fark ettim.

Etki alanının og:url ve og:image için aynı olduğundan emin olduktan sonra çalıştı.

Bu yardımcı olur umarım.

1
Darren Hall

Gördüğüm kadarıyla, web siteniz genel olduğunda ve resim URL'si https olsa da gayet iyi çalıştığını gördüm.

0
AK M

Benim için bu çalıştı:

<meta property="og:url" content="http://yoursiteurl" />
    <meta property="og:image" content="link_to_first_image_if_you_want" />
    <meta property="og:image" content="link_to_second_image_if_you_want" />
    <meta property="og:image:type" content="image/jpeg" /> 
    <meta property="og:image:width" content="400" /> 
    <meta property="og:image:height" content="300" />
    <meta property="og:title" content="your title" />
    <meta property="og:description"  content="your text about homepage"/> 
0
Dr.MTR

Ayrıca, bu sorun, kullanıcı tarafından oluşturulan bir hikaye eklediğinizde de oluşur (og: image kullanmıyorsunuz). Örneğin:

POST /me/cookbook:eat?
  recipe=http://www.example.com/recipes/pizza/&
  image[0][url]=http://www.example.com/recipes/pizza/pizza.jpg&
  image[0][user_generated]=true&
  access_token=VALID_ACCESS_TOKEN

Yukarıdakiler yalnızca http ile çalışır ve https ile çalışmaz. Https kullanıyorsanız, şunu söyleyen bir hata alırsınız: Ekli resim () yüklenemedi

0
Aamir Quraishi

Debugger’ın URL’nizden 4 og:image etiketini aldığını görebiliyorum.

İlk görüntü en büyüğüdür ve bu nedenle yüklenmesi en uzun zaman alır. Önce ilk görüntüyü küçültmeyi deneyin veya önce daha küçük bir görüntü göstermek için sırayı değiştirin.

0
Lix

Benim durumumda, tarayıcı sadece bir hata yaşıyormuş gibi görünüyor. Denedim:

  • Yalnızca http’e giden bağlantıları değiştirme
  • Uç beyaz boşluğu kaldırma
  • Tamamen http’e geri dönüyorum
  • Web sitesini yeniden yükleme
  • Bir grup OG eklentisi kurmak (WordPress kullanıyorum)
  • Sunucunun botları engelleyen garip bir yanlış yapılandırması olduğundan şüpheleniliyor (çünkü tüm OG denetleyicileri etiket alamıyor ve sitelerime yapılan diğer istekler kararsız)

Bu eserlerin hiçbiri. Bu bana bir hafta mal oldu. Ve aniden hiçbir yerde yeniden iş gibi görünüyor.

İşte benim araştırmam, eğer birileri bu problemle tekrar karşılaşırsa:

Ayrıca, kontrol etmeniz için Facebook'un Nesne Hata Ayıklayıcısı dışında daha fazla denetleyici var: OpenGraphCheck.com , Abhinay Rathore'un Açık Grafik Test Cihazı , - Iframely'nin Yerleşik Kodları , Kart Doğrulayıcı | Twitter Geliştiricileri .

0
Ooker

Yanlışlıkla bulduğum gibi, saydam boş görüntü sorunun nedenini belirten yanıt başlığı ile birlikte geliyor.

  1. https://developers.facebook.com/tools/debug/og/object/ adresindeki hata ayıklayıcısına gidin.
  2. URL’nizi girin
  3. Alt kısımda, facebook "resminizi" gösteriyor (saydam 1x1 GIF)
    1. Görüntü orijinal görüntünüze bağlı - buna basmanın anlamı yok
    2. Sağa basın ve resmi görüntüleyin (https://external-ams3-1.xx.fbcdn.net/safe_image.php?d=...&url=... gibi bir şey alırsınız)
  4. Firebug/developer araçlarında Net sekmesini açın, gerekirse sayfayı yenileyin
  5. Açıklama ile x-error-detail yanıt başlığını alacaksınız

Örneğin, benim durumumda Invalid image extension for URL: https://[mydomain]/[myfilename].jpg oldu

Davamdaki asıl mesele prerender.io ile ilgiliydi.

Görünüşe göre, eğer görüntü prerender yoluyla talep edilirse, HTML'ye dönüştürülür. Bunun gibi bir şey:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head><meta http-equiv="content-type" content="text/html; charset=utf-8"></head>
<body style="margin: 0px;"><img style="-webkit-user-select: none; cursor: -webkit-zoom-in; " src="https://[yourdomain].com/[yourfilename].jpg" width="1078" height="718"></body>
</html>

Ön sipariğin kendisinde bulunan bir hata ya da vekilinizde *.jpg istekleri için ön sicil kullanmayacak şekilde yapılandırılmış olması gerekiyor (Facebook bot tarafından istense bile).

Öncelik sadece belirli kullanıcı-ajan başlıklarında kullanıldığı için bunu farketmek gerçekten zor.

0
Marius Balčytis

http:// 'dan og:image' u çıkardım ve onu eski düz www. ile değiştirdim, sonra düzgün çalışmaya başladı.

Görüntüyü kazıma önbelleğini sıfırlamak ve demo görüntü için hangi URL'yi çektiğini test etmek için bu aracı Facebook'tan kullanabilirsiniz.

0
Albert Renshaw

Bugün de benzer bir problem vardı, Paylaşma Hata Ayıklayıcısını çözmeme yardım etti. Facebook'un (şu anda) XMP meta verilerinin gömülü olduğu görüntüleri anlamadığı anlaşılıyor. Makalelerimizdeki görüntüleri XMP meta verisi olmayan sürümlerle değiştirdiğimde ve sayfayı tekrar kazıdım (Paylaşım Hata Ayıklayıcısını kullanarak), sorun çözüldü. Onaltılı bir düzenleyici, resminizde XMP meta verileri olup olmadığını görmenize yardımcı olur.

0
Brett Donald

Meta etiketi güncelledikten sonra, içerik (resim) bağlantısının mutlak yol olduğundan emin olun ve herehttps://developers.facebook.com/tools/debug/sharing 'nin sitenize linkini girin ve sonraki sayfada scrape again tıklayın.

0
Thyagu

Sitenin https sertifikası tam olarak uyumlu olmadığında, benzer belirtiler (Facebook ve diğerleri, og: görüntüyü ve https üzerindeki diğer varlıkları doğru şekilde getiremez) ortaya çıkabilir. 

Sitenizin https sertifikası geçerli görünebilir (tarayıcıda ve hepsinde yeşil tuş), ancak bir ara veya zincir sertifikası eksikse doğru şekilde sıyrılmaz. Bu, tüm çeşitli önbellekleri ve meta etiketlerini kontrol edip yeniden denetlemenin birçok boşa harcanmasına neden olabilir. 

Senin problemin olmayabilir, ama diğerlerinin de benzer semptomları olabilir (benimki gibi). Sertifikanızı kontrol etmenin birçok yolu var - kullandığım oldu: https://www.sslshopper.com/ssl-checker.html

0
Lance