Eğer kullanıcı sayfayı ve içeriğini göster sevdiğini bakın nasıl Facebook?

SORU

5 HAZİRAN 2011, Pazar

Eğer kullanıcı sayfayı ve içeriğini göster sevdiğini bakın nasıl Facebook?

Facebook iFrame uygulama oluşturmak için çalışıyorum. Uygulama ilk resim göstermek gerekir ve eğer kullanıcı sayfayı beğenirse, bazı içeriğe erişim alacak.

Bu Facebook PhP SDK kullanamam bu nedenle RoR kullanıyorum.

Burada kullanıcı sayfayı beğendi sahip değil, benim iFrame HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<style type="text/css">
body {
width:520px;
margin:0; padding:0; border:0;
font-family: verdana;
background:url(repeat.png) repeat;
margin-bottom:10px;
}
p, h1 {width:450px; margin-left:50px; color:#FFF;}
p {font-size:11px;}
</style>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
</head>
<body>
<div id="container">
<img src="welcome.png" alt="Frontimg">
</div>

Ve, eğer kullanıcı sayfayı sevdim varsa:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<style type="text/css">
body {
width:520px;
margin:0; padding:0; border:0;
font-family: verdana;
background:url(repeat.png) repeat;
margin-bottom:10px;
}
p, h1 {width:450px; margin-left:50px; color:#FFF;}
p {font-size:11px;}
</style>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
</head>
<body>
<div id="container">
<img src="member.png" alt="Frontimg">
<p>You liked this page</p>

CEVAP

11 HAZİRAN 2011, CUMARTESİ

GÜNCELLEME 21/11/2012 @ALL : daha iyi çalışır, böylece örnek güncelledik ve hesaplarına Chris Jacob ve FB en İyi uygulamalar, açıklamalar, örnek here çalışan bir göz alır

Burada söz verdiği gibi selam benim cevabım sadece javascript kullanarak

Sayfa : VÜCUT içerik

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
  FB.init({
    appId  : 'YOUR APP ID',
    status : true, 
    cookie : true, 
    xfbml  : true  
  });
</script>

<div id="container_notlike">
YOU DONT LIKE
</div>

<div id="container_like">
YOU LIKE
</div>

CSS :

body {
width:520px;
margin:0; padding:0; border:0;
font-family: verdana;
background:url(repeat.png) repeat;
margin-bottom:10px;
}
p, h1 {width:450px; margin-left:50px; color:#FFF;}
p {font-size:11px;}

#container_notlike, #container_like {
    display:none
}

Ve sonunda javascript :

$(document).ready(function(){

    FB.login(function(response) {
      if (response.session) {

          var user_id = response.session.uid;
          var page_id = "40796308305"; //coca cola
          var fql_query = "SELECT uid FROM page_fan WHERE page_id = " page_id "and uid=" user_id;
          var the_query = FB.Data.query(fql_query);

          the_query.wait(function(rows) {

              if (rows.length == 1 && rows[0].uid == user_id) {
                  $("#container_like").show();

                  //here you could also do some ajax and get the content for a "liker" instead of simply showing a hidden div in the page.

              } else {
                  $("#container_notlike").show();
                  //and here you could get the content for a non liker in ajax...
              }
          });


      } else {
        // user is not logged in
      }
    });

});

Ne ?

İlk giriş için FB (varsa KULLANICI KİMLİĞİ ve emin kullanıcı zaten giriş yapmış facebook, bypass giriş malzeme ve değiştirin. response.session.uid ile YOUR_USER_İD (sizin rails uygulaması için örnek)

Sonra o yapar FQL sorgu page_fan tablo ve anlamı bu kullanıcı bir fan sayfası döndürür kullanıcı kimliği ve aksi takdirde boş bir dizi döndürür, sonra olduğunu ve bağlı olarak sonuçları göstermek onun bir div.

Burada çalışan bir demo var ayrıca : http://jsfiddle.net/dwarfy/X4bn6/

Örnek olarak coca cola sayfa kullanarak, git dene the coca cola page farklı/ve yeniden çalıştırın

Nihayet bazı ilgili dokümanlar :

FQL page_fan table

FBJS FB.Data.query

Eğer herhangi bir sorunuz varsa çekinmeyin ..

Şerefe

GÜNCELLEME 2

Birisi tarafından söylenen, DV çalışması için javascript versiyonu için gereklidir, ANCAK kolayca (sadece belge için kullanılır.bu kaldırmak olabilir gibi hazır ve Göster/Gizle).

Belge için.hazır, fonksiyon olarak kodunuzu sarın ve body onload="your_function" falan gibi daha karmaşık kullanabilirsiniz : Javascript - How to detect if document has loaded (IE 7/Firefox 3) belge yerine kadar hazır.

Ve gösteri için " gibi bir şey kullanabilirsin şeyler gizlemek : document.getElementById("container_like").style.display = "none" or "block" ve daha güvenilir bir çapraz tarayıcı teknikleri görmek için buraya tıklayınız : http://www.webmasterworld.com/forum91/441.htm

Ama bir WordPress kullanmak çok kolay :)

GÜNCELLEME

Aşağıda burada yayınlanan yorum "" facebook içini görüntülemek için getirir. TUVAL URL için facebook POST signed_request çözmek için bazı ruby kod nispeten

Eylem denetleyici :

decoded_request = Canvas.parse_signed_request(params[:signed_request])

Ve sonra deşifre istek ve ekran bir kontrol meselesi sayfasını veya başka bir .. (bu konuda emin Değilim, ruby ile rahat değilim)

decoded_request['page']['liked']

Ve burada ilgili Tuval Sınıfı (fbgraph ruby library) :

 class Canvas

    class << self
      def parse_signed_request(secret_id,request)
        encoded_sig, payload = request.split('.', 2)
        sig = ""
        urldecode64(encoded_sig).each_byte { |b|
          sig << "x" % b
        }
        data = JSON.parse(urldecode64(payload))
          if data['algorithm'].to_s.upcase != 'HMAC-SHA256'
          raise "Bad signature algorithm: %s" % data['algorithm']
        end
        expected_sig = OpenSSL::HMAC.hexdigest('sha256', secret_id, payload)
        if expected_sig != sig
          raise "Bad signature"
        end
        data
      end

      private

      def urldecode64(str)
        encoded_str = str.gsub('-',' ').gsub('_','/')
        encoded_str  = '=' while !(encoded_str.size % 4).zero?
        Base64.decode64(encoded_str)
      end
    end  

 end