像未显示在用户墙上的操作 [英] Like action not showing on users wall

问题描述

我花了几天时间尝试解决此问题，但未成功.问题是，当用户单击喜欢"按钮时，它并不表示他们喜欢墙上的任何东西.虽然代码可以在我在localhost的测试设置上正常运行，但在生产环境中却无法正常工作.

I've spent several days attempting to resolve this issue without success. The issue is that when a user clicks on a like button it does not indicate that they like anything on their wall. While the code works correctly on my test setup at localhost, it does not work in production.

我的客户正在使用用于Wordpress的图片库插件以及一个名为FancyBox的灯箱插件，以在用户单击缩略图时显示较大版本的图像.他已经要求我在每个花哨盒中添加一个类似Facebook的按钮.

My client is using an image gallery plugin for wordpress along with a lightbox plugin known as FancyBox to show larger versions of images when a user clicks on the thumbnail. He has asked me to add a facebook like button to each fancybox.

由于Fanyboxes是动态生成的，所以每当渲染fancybox时，我都会生成一个新的like button iframe. 喜欢"按钮iframe使用的URL对于用户单击的图片而言是唯一的.该代码将& photo =/location/of/photo.jpg添加到图库URL.然后，整个自定义URL会通过encodeURIComponent()传递并传递到iframe.

Since fanyboxes are dynamically generated, I generate a new like button iframe whenever a fancybox is rendered. The URL used by the like button iframe is unique to the picture clicked on by the user. The code adds &photo=/location/of/photo.jpg to the gallery URL. Then the entire custom URL is passed through encodeURIComponent() and handed to the iframe.

这是用于生成iframe的代码段

Here is the code snippet used to generate the iframe

var currentURL = document.URL,  
    currentIMG = $("#fancybox-img").attr("src").split("http://www.downsplash.com").pop();  
if (currentURL.match("&photo=")) {  
    var currentURL = currentURL.split("&photo=").shift();
};
var thisURL = encodeURIComponent(currentURL + "&photo=" + currentIMG);
<span id="fancybox-title-over">
    <div id="facebook-like" style="display:inline-block;">
        <iframe src="//www.facebook.com/plugins/like.php?href=" + thisURL + "&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=true&amp;action=like&amp;colorscheme=dark&amp;font&amp;height=21&amp;appId=314592468583405" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowTransparency="true"></iframe>  
    </div>
</span>

此处是在生产环境中运行的代码的链接.

赞"按钮代码似乎可以顺利运行，它使您可以喜欢和不喜欢照片.唯一的问题是，当喜欢一张照片时，用户墙上什么也没出现.

The like button code seems to work without a hitch, it allows you to like and unlike photos. The only issue is that when a photo is liked, nothing appears on the users wall.

注意:

1. 仅使用基本URL而不使用 自定义& photo =/location/of/photo.jpg
2. 在本地主机上测试此代码时，它确实会发布到Facebook.

1. Everything works correctly when using just the base URL without the custom &photo=/location/of/photo.jpg
2. When testing this code on localhost it DOES post to facebook.

我不确定为什么这些喜欢的消息没有出现在用户的Facebook墙上.有人有什么想法吗?

I'm not sure why these likes are not showing up on the users facebook wall. Does anyone have any ideas?

推荐答案

生产代码 Heera 指出可以正常使用，但是当Facebook向用户发布墙时，它发布了投资组合的URL，其中不包括& photo =/location/of/photo.jpg.之所以发生这种情况，是因为标头中有一个Open Graph元标记，该标记向Facebook提供了产品组合URL，仅此而已.

As pointed out by Heera, the production code IS working but when Facebook posts to the users wall it posts the URL of the portfolio NOT including the &photo=/location/of/photo.jpg. This is happening because there is an Open Graph meta tag in the header that feeds Facebook the portfolio URL and nothing more.

<meta property="og:url" content="http://www.downsplash.com/?portfolio=portraits">

由于我已经喜欢作品集URL，因此我无法在墙上看到任何帖子.事实证明，"Simple Facebook Connect"和"Tweet，Like，Google +和Share"插件会将此打开的图形标记自动添加到标头中.这也解释了为什么我的代码可以在我的本地主机测试站点上运行的原因，因为当我喜欢一张照片时，Facebook无法扫描本地主机上的开放图形标签.

I was not able to see a post on my wall since I had already liked the portfolio URL. As it turns out, this open graph tag is automatically added to the header by the both the 'Simple Facebook Connect' and 'Tweet, Like, Google+, and Share' plugins. This also explains why my code works on my localhost test site because Facebook could not scan localhost for open graph tags when I liked a photo.

感谢您的帮助！

在我禁用了插件并确保我的打开图形标记正确显示在html之后，我遇到了一个与Facebook缓存给定URL的打开图形标记有关的问题.这导致以前的不正确的URL重定向继续发生.我通过访问 Facebook的开放图谱调试器并输入URL来解决此问题.这将导致Facebook刷新页面的打开图形标记的缓存.

After I disabled the plugins and made sure my open graph tags displayed properly in html, I experienced an issue related to Facebook caching the open graph tags for a given URL. This caused the previous incorrect URL redirection to continue occurring. I resolved this by visiting Facebook's Open Graph Debugger and entering the URL. This causes Facebook to refresh the cache of open graph tags for the page.

这篇关于像未显示在用户墙上的操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！