使用 Ajax 更新 facebook Like 按钮

发布于 2024-12-09 15:41:27 字数 583 浏览 0 评论 0原文

我刚刚完成了一个 100% 基于 ajax 的小网站。但是我在更新 facebook Like 按钮的链接时遇到了问题。

我简单地使用了 facebook 生成的代码并且我包含了图形元标记。当用户按下按钮时，它会加载一个新的 youtube 视频，我

<meta property="og:url" content="http://www.mySite.com/"/>

使用 jQuery 更新元标记，如下所示：

$("meta[property=og:url]").attr("content", nUrl);

nUrl 是包含新的随机选择视频的新页面 url。

当我点击“Like”时，它只是抓取点击“Like”，它只是抓取原始的 og:url 元标记内容，现在是 ajax 设置的新内容。如何使用 javascript 更新点赞按钮 url？我所做的有什么问题？谢谢

原文

I just finished a small website 100% based on ajax.But i have a problem in updating the links of the facebook Like buttons.

I used simply the facebook generated code and i included the graph meta tags. when the users presses a button it loads a new youtube video, i update the meta tag

<meta property="og:url" content="http://www.mySite.com/"/>

using jQuery this way :

$("meta[property=og:url]").attr("content", nUrl);

nUrl is the new page url that contains the new randomly selected video.

When i hit "Like" it simply grab hit "Like" it simply grab the original og:url meta tag content and now the new on set by ajax.
How to update with javascript the like button url ? What is wrong in what i did ?
Thank you

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

扛刀软妹 2024-12-16 15:41:27

因此，我为其他有相同问题的人解决了我的问题：
将其添加到您的网站：

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:og="http://ogp.me/ns#"
  xmlns:fb="http://www.facebook.com/2008/fbml" >

这会将 fbml 添加到您的站点。然后使用 FBML 版本的 Like 按钮（或评论系统，或其他），就像我使用的那样：

<span id="fbLike"><fb:like href="http://www.your-site.com?v=1" send="false" layout="button_count" width="80" show_faces="true"></fb:like></span>

现在，每次用户执行 Ajax 操作时都有一个新的 facebook Like 按钮，只需将此 jquery 代码添加到您所在的位置即可在客户端代码中处理此操作：

var nUrl = "http://www.your-site.com?v="+toPlayId.substring(1);
$( '#fbLike' ).html('<fb:like href="'+nUrl+'" send="false" layout="button_count" width="80" show_faces="true" />');
        if (typeof FB  != "undefined"){
        FB.XFBML.parse(document.getElementById('fbLike'));}

基本上只需用新按钮替换按钮所在的位置即可。
nUrl 是您希望新按钮指向的新链接。
您不需要真正的新 URL，只需在 url 中添加一个参数，以便您的 ajax 知道在找到该参数时要显示什么。
就这样。

So here's what i did to solve my problem for other people who have the same:
Add this to your site :

<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:og="http://ogp.me/ns#"
  xmlns:fb="http://www.facebook.com/2008/fbml" >

This will add the fbml to your site. Then use the FBML version of the like button (or comment system, or whatever), for like i used this :

<span id="fbLike"><fb:like href="http://www.your-site.com?v=1" send="false" layout="button_count" width="80" show_faces="true"></fb:like></span>

Now to have a new facebook like button each time the user make an Ajax action, just add this jquery code to where ever you handle this action in your client-side code:

var nUrl = "http://www.your-site.com?v="+toPlayId.substring(1);
$( '#fbLike' ).html('<fb:like href="'+nUrl+'" send="false" layout="button_count" width="80" show_faces="true" />');
        if (typeof FB  != "undefined"){
        FB.XFBML.parse(document.getElementById('fbLike'));}

You basically just replace the where your button is with a new one.
nUrl is the new link you want your new button to point to.
You don't need a real new URL just add a parameter to the url so that your ajax knows what to display when he finds the parameter.
That's all.

回复收藏 0 原文

对你的占有欲 2024-12-16 15:41:27

不要使用 AJAX 或 javascript 修改元标记。设置服务器端脚本以在第一次时正确设置它们。

当您在 Facebook 上点赞/分享某个 URL 时，Facebook 会向该 URL 发出 HTTP 请求并解析它看到的元标记。

回复收藏 0 原文

执手闯天涯 2024-12-16 15:41:27

您无法使用 Javascript 更新 OG 标签。 Facebook 将向您的服务器发出服务器端请求，并且该请求必须返回代表该对象的 OG 标签。

您需要为网站上的每个对象创建一个 URL - 类似于：

http://www.yoursite.com/video/VIDEO_ID

当您的视频页内内容通过 Ajax 进行更改时，您将呈现一个新的“点赞”按钮，该按钮指向这样的 URL。在没有 JS 的情况下点击这个 URL 应该会呈现正确的 OG 标签 - 这就是 Facebook 看到你的页面的方式。然后，您可以添加 JavaScript 重定向 (window.top.location = NEW URL) 以将用户重定向到基于 ajax 的视频播放器。

You cannot update the OG tag with Javascript. Facebook will make a serverside request to your server and this must return OG tags which represent that object.

You'll need to create a URL for every object on your site - something like:

http://www.yoursite.com/video/VIDEO_ID

As your video in-page changes with Ajax, you render a new like button which points at a URL like this. Hitting this URL without JS should render the correct OG tags - this is how Facebook will see your page. You can then add a javascript redirect (window.top.location = NEW URL) to redirect the user into ajax-based video player.

回复收藏 0 原文

~没有更多了~