Facebook 喜欢和 Twitter 推文按钮导致跨域问题答案

【问题标题】：Facebook like and Twitter tweet buttons causing Cross Domain IssuesFacebook 喜欢和 Twitter 推文按钮导致跨域问题
【发布时间】：2011-09-19 23:30:59
【问题描述】：

我同时使用 twitter 推文按钮和 facebook like 按钮

<a href="http://twitter.com/share" 
   class="twitter-share-button"
   data-url="http://example.com"
   data-text="some text"
   data-count="horizontal"
   data-via="someone">Tweet
</a>
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like 
   class="fbShare" 
   href="http://example.com" 
   font="" send="true" 
   layout="button_count" 
   show_faces="false">
</fb:like>

但是他们俩都在吐出跨域错误，不是一两个，而是连续不断。

实际错误（有替换）是

不安全的 JavaScript 尝试访问带有 URL 的框架 https://www.facebook.com/plugins/like.php?channel_url=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%3Fversion%3D3%23cb%3Df3cde04b84%26origin%3Dhttp%253A%252F%252Fexample.com%252Ff20b9fb1fc%26relation%3Dparent.parent%26transport%3Dpostmessage&href=http%253A%252F%252Fexample.com%252F&layout=button_count&locale=en_US&node_type=link&sdk=joey&send=true&show_faces=false&width=150 从带有 URL 的框架 http://example.com/。域，协议和端口必须匹配。

不安全的 JavaScript 尝试访问带有 URL 的框架 http://platform0.twitter.com/widgets/tweet_button.html?_=1308700896075&count=horizontal&id=twitter_tweet_button_0&lang=en&original_referer=http%3A%2F%2Fexample.com%2F&text=some text&url=http%3A%2F%2Fexample.com%2F&via=某人从带有 URL 的框架 http://example.com/。域，协议和端口必须匹配。

【问题讨论】：

您是否尝试过只在页面上显示其中一个并查看它是否可能只是导致此问题的一个？
确定您在页面上没有尝试枚举所有 iframe 并访问它们的其他插件吗？我以前见过这种情况。
你能给你的页面链接吗？我也许能帮上忙

标签： javascript facebook twitter sdk cross-domain

【解决方案1】：

我知道这个问题太老了。但是由于 Twitter 的那个问题仍然有效，作为 BK 回答的后续，我创建了一个自定义推文按钮，它看起来与 Twitter 的 JS API 完全相同，但不使用它并且仍然包括共享计数！因此，对于那些感兴趣的人，我将其上传到了我的 GitHub。

演示：http://fiddle.jshell.net/eyecatchup/Th6P2/2/show/
代码：https://github.com/eyecatchup/tweetbutton

【讨论】：

【解决方案2】：

这似乎是 Twitter 按钮代码的错误，您可能希望使用 Twitter 登录。它似乎试图遍历页面上的每个 dom 对象，并且无法访问 Facebook iframe 对象。例如，如果您还添加了 Google +1 按钮，它现在会抛出一条额外的类似消息，但针对的是与 Google 相关的网址。

功能似乎没有受到影响，所以我会忽略它。任何使用此 Tweet 按钮的站点以及来自不同服务器的另一个 iframe（例如 Facebook/G+ 按钮）也会遇到相同的问题（例如尝试mashable.com 上的任何页面）。如果您不想忽略它，您可以删除 Twitter javascript 引用并创建一个自定义 Tweet 按钮，如其Tweet button page 中所述，使用 javascript 弹出此 url 格式：http://twitter.com/share?url=http%3A%2F%2Fdev.twitter.com%2Fpages%2Ftweet-button，这样做的缺点是推文计数不会显示在您的页面上。

【讨论】：