logo标签列表

我该如何在Facebook发布后关闭弹出窗口？

javascriptjqueryfacebooksdkdialog
8
在我们的博客上，有一个链接，用户可以将我们的文章发布到他们的时间轴上。弹出窗口会打开，用户会发布到Facebook，然后弹出窗口会停留在那里并重定向到“www.oursite.com”。当用户完成发布或单击取消按钮时，我们该如何关闭弹出窗口？根据这个问题的说法，这是不可能做到的，但赫芬顿邮报已经解决了这个问题，但是通过查看他们的代码，我们无法理解它。例如，在这里的Facebook分享按钮将打开一个弹出窗口，然后在您发布文章或取消时关闭。
以下是我们目前拥有的内容：
FB.init({appId: "90210", status: true, cookie: true});

      function postToFeed() {

        // calling the API ...
        var obj = {
          method: 'feed',
          redirect_uri: 'http://www.oursite.com/',
          link: 'http://www.oursite.com/',
          picture: 'http://www.oursite.com/png.png',
          name: 'Some title',
          caption: '',
          description: ''
        };

        function callback(response){
           window.close(); // doesn't do anything
          //document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
        }

        FB.ui(obj, callback);
      }

我们尝试在回调函数中添加window.close();（还尝试了self.close();），尝试将redirect_uri留空（或完全省略，但这是必需的）。
也许这个答案可以帮到你：https://dev59.com/jknSa4cB1Zd3GeqPSO_x#2520861 - Eich
8个回答
17

看起来接受的答案不再有效，因为Facebook现在会剥离哈希后面的任何内容，并将其替换为post_id = xxxxx。

解决方案＃1（如果您相信Facebook不会在不久的将来更改此操作）：

if(window.location.search.indexOf('post_id')==1) window.close();

解决方法 #2（如果你想更加确保不受更改的影响并且不介意有第二个文件）: 创建一个名为closewindow.html的新HTML文件：

<html><body><script>window.close()</script></body></html>

并在重定向中链接到它。

15

重定向到http://oursite.com/#close_window。然后在您网站的主页上，包含类似于以下内容：

if (window.location.hash == '#close_window') window.close();。

Chrome不允许关闭由其他脚本打开的窗口。 - levi
8
经过一整天的研究，我有一个非常好的解决方案想要分享。与使用FB.ui()的SDK相反，我发现可以通过手动打开自己的弹出窗口到https://www.facebook.com/dialog/feed来完全避免使用它。这样做时，redirect_uri按预期工作。只要您要求用户单击按钮以使对话框弹出，就不会触发任何弹出窗口拦截器。
我认为这段代码没有任何妥协，如果有什么问题，它比实际的SDK更容易使用。
我的JavaScript代码（您可以将其保存为FacebookFeedDialog.js）如下：
/* by Steven Yang, Feb 2015, originally for www.mathscore.com.  This code is free for anybody to use as long as you include this comment.  */
function FacebookFeedDialog(appID, linkTarget, redirectTarget) {
  this.mParams = {
    app_id: appID,
    link: linkTarget,
    redirect_uri: redirectTarget,
    display: "popup"
  }
};

/* Common params include:
   name - the title that appears in bold font
   description - the text that appears below the title
   picture - complete URL path to the image on the left of the dialog
   caption - replaces the link text
*/
FacebookFeedDialog.prototype.addParam = function(key, value) {
  this.mParams[key] = value;
};

FacebookFeedDialog.prototype.open = function() {

  var url = 'https://www.facebook.com/dialog/feed?' + encodeCGIArgs(this.mParams);
  popup(url, 'feedDialog', 700, 400);
};

/* Takes a param object like this:
   { arg1: "value1", arg2: "value2" }
   and converts into CGI args like this:
   arg1=value1&arg2=value2

   The values and args will be properly URI encoded
*/
function encodeCGIArgs(paramObject) {

  var result = '';

  for (var key in paramObject) {
    if (result)
      result += '&';
    result += encodeURIComponent(key) + '=' + encodeURIComponent(paramObject[key]);
  }

  return result;
}

function popup(mylink,windowname,width,height) {
  if (!window.focus) return;
  var href;
  if (typeof(mylink) == 'string')
    href=mylink;
  else
    href=mylink.href;
  if (!windowname)
    windowname='mywindow';
  if (!width)
    width=600;
  if (!height)
    height=350;
  window.open(href, windowname, 'resizable=yes,width='+width+',height='+height+',scrollbars=yes');
}

以下是使用上述Javascript代码的示例HTML文件：
<HTML>
<BODY>
<SCRIPT type="text/javascript" src="FacebookFeedDialog.js"></SCRIPT>
<SCRIPT>
var dialog = new FacebookFeedDialog(yourAppIDGoesHere,yourDestinationURLGoesHere,yourCloseWindowURLGoesHere);
dialog.addParam('name','This is my title');
dialog.addParam('description','This is the description');
dialog.addParam('picture',yourImageURLGoesHere);
dialog.addParam('caption','This is the caption');
</SCRIPT>

<A href="javascript:dialog.open()">Open facebook dialog</A>
</BODY>
</HTML>

你的 closeWindow html 文件可以看起来像这样：

<SCRIPT>
window.close();
</SCRIPT>
谢谢，兄弟！我折腾了几个小时，你提供的完美解决方案真是救了我的一天！！ - Martijn de Milliano
被欣赏是一件很好的事情！ - Steven
4
3

更新： 将此脚本添加到您的重定向页面中：

if (document.referrer == "https://www.facebook.com/" && (window.location.href.indexOf('post_id=') != -1 || window.location.hash == '#_=_')) {
    window.close();
}
2

只需从url中删除redirect_uri参数。

例如这里。

这个在最近有人用过吗（2017年7月）？当我点击“这里”时，我可以发布，但窗口不会关闭，它只是停留在https://www.facebook.com/dialog/return/close#_= _ - Brendan White
1
这不是对原问题的直接回答，但它可能有助于其他人到达此处。
有一种更强大的方法可以让您在共享成功完成时对源页面采取操作：
在源页面中：
var shareWindow;

function openShareWindow() {
  // See https://developers.facebook.com/docs/sharing/reference/share-dialog
  shareWindow = window.open('https://www.facebook.com/dialog/share?app_id=...&display=popup&redirect_uri=...');
}

function shareCompleted() {
  if (shareWindow) {
    shareWindow.close();
    shareWindow = null;

    // The share was successful, so do something interesting here...
  }
}

在您设置为redirect_uri的页面上，我通常将其映射到类似于http://myserver.com/share/close的内容：
window.opener.shareCompleted();

现在，您可以放心，共享窗口将关闭，如果需要，在原始页面上执行操作。
注意：对于此工作，必须在根窗口命名空间中提供shareCompleted。如果您正在封装所有JavaScript，那么请确保：
window.shareCompleted = shareCompleted;
0
<script>if (window.location.hash.indexOf("#close_window") != -1) window.close();</script>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接