Facebook Like iframe忽略我指定的href

我有JavaScript計算和注入HTML到我的DOM爲Facebook「Like」功能。我需要指定一個「規範」URL，因爲實際的URL並不反映已經完成的所有DOM操作（由Web「頁面」上的用戶活動驅動）。Facebook Like iframe忽略我指定的href

唉，Facebook的代碼並未使用我提供的URL，而是使用了window.location值（其中有#hash方面影響頁面的顯示，但服務器無法訪問）。無論如何...爲什麼FB的代碼忽略了我給它的URL？

我這樣生成HTML：

var html = '<iframe src="http://www.facebook.com/plugins/like.php?href=' 
      + encodeURI(url) + 
      '&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=recommend&amp;font=arial&amp;colorscheme=light" style="border:none; overflow:hidden; width:270px; height:26px;" allowTransparency="true" frameborder="0" scrolling="no"></iframe>'

來源

2010-05-29 Zhami

encodeURI是這裏的錯誤的方法。它只對完全無效的字符進行編碼;它只留下可能在URL中但具有特殊含義的字符。所以：

'?par1='+encodeURI('http://example/scr?par2=2&par3=3')

結束爲：

'?par1=http://example/scr?par2=2&par3=3'

和&字符作爲一個參數分隔符爲外 URL內一個內部的，過早地結束你傳遞給URL參數Facebook的。

對於查詢參數名稱/值或路徑部分，正確的功能是encodeURIComponent()。

此外，您通過不在屬性值中轉義＆符號創建無效的HTML。如果您必須在一個字符串（*）創建HTML您將需要一個HTML編碼器：

function encodeHtml(s) { 
    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/"/g, '&quot;'); 
} 

var fburl= (
    'http://www.facebook.com/plugins/like.php'+ 
    '?action=recommend&href='+encodeURIComponent(url)+ 
    '&layout=standard&show_faces=false&width=100&font=arial&colorscheme=light' 
); 
var html= (
    '<iframe src="'+encodeHtml(fburl)+'" ' 
    'allowTransparency="true" frameborder="0" scrolling="no" '+ 
    'style="border:none; overflow:hidden; width:270px; height:26px;">'+ 
    '</iframe>' 
);

（*：和通常我會盡量避免這種情況，寧願使用DOM方法來創建元素的含量，因爲那麼您不必擔心HTML轉義。）

來源

2010-05-29 17:22:25 bobince

感謝您分享您的見解。我確實使用DOM方法將HTML「注入」到DOM中。我相信我的麻煩來源是不使用encodeURIComponent（）來生成fburl。 – Zhami 2010-05-31 13:30:12

（我正在考慮像'createElement'這樣的DOM方法和'iframe.src = fburl;'等屬性，但是'encodeURI'的名字有點誤導。） – bobince 2010-05-31 14:03:40

Facebook Like iframe忽略我指定的href

回答

相關問題