如何在不使用 URL 的情况下在 facebook 上分享我的新闻

Posted 2023-02-24

【中文标题】如何在不使用 URL 的情况下在 facebook 上分享我的新闻

【英文标题】：How can I share my news in facebook without using an URL

【发布时间】：2014-08-07 16:35:45

【问题描述】：

我正在尝试在我的项目中加入一个按钮，该按钮允许人们在 facebook 上分享文章。

我希望在 facebook 分享窗口中出现用户点击分享的新闻标题和图片。

但是我没有成功，因为在这个项目中，我展示了每条新闻的摘要，每条新闻都有一个“阅读全文”链接和一个“分享”链接。

问题是，当我点击“阅读全文”时，我的全文在一个没有任何网址的花式框中打开...所以这是我的困难，我如何在没有网址的情况下在 facebook 上分享我的新闻？

我真的很难理解如何在 Facebook 上分享每条新闻，因为我的新闻没有网址。

你有什么方法可以实现我的目标吗？

这是我的 php：

//while exist news records in database

while ($result = $readNews->fetch(PDO::FETCH_ASSOC))
    echo '<article class="news">';
        echo '<img class="img" src="'.BASE.'/uploads/news/'.$result['thumb'].'"/> ';
        echo '<h2>'.$result['title'].'<br /></h2>';
        echo '<span>'$result['date']).'</strong></span>';
        echo '<p>'.$result['content].'
            <a  id="'.$result['id_news'].'" 
            class="fancybox" href="#window_fancybox'.$result['id_news'].'">
            See full article </a>
        </p>';  

        //my share link
        echo '<a title="share" class="share" href="'.BASE.'">Share</a>';

        //When I click in "See full article"
        // it will open a fancybox with full article 
        echo '<div id="window_fancybox'.$result['id_news'].'" class="modal">';
        echo '<h2>'.$resultt['title'].'</h2>';
        echo '<span>'.$result['date'].'</span><br />';
        echo '<img class="img" src="'.BASE.'/uploads/news/'.$result['thumb'].'"/>';
        echo '<p>'.$result['content'].'</p>';
        echo '<span class="close_fancy">Close modal</span>';
        echo '</div>';
    echo '</article>';

这是我要在 facebook 上分享的脚本：

$('.share').click(function()
    urlshare = $(this).attr('href');
    alert(urlshare);
    window.open('http://www.facebook.com/sharer.php?u=' +urlshare,'My website',"width=500,height=400,status=yes,toolbar=no,menubar=no,location=no");
    return false;
)

您可以在此处查看我的示例：（我的 fancybox 共享窗口全白打开）

http://ei-test.netau.net/#fancybox_window1

【问题讨论】：

您不能共享单个新闻，如果这些新闻没有每个单独的 URL - URL 中简单的客户端哈希部分是不够的。

【参考方案1】：

自己没有测试过，但我是这样理解的：

当悬停时（也可能在点击时）查看全文应该会出现一个以#window_fancybox_SOMETHING_ 结尾的网址。

这是您需要提供给 facebook 的网址。

【讨论】：

感谢您的回答。你说得对，Waog，当我将鼠标悬停在“查看全文”时，会出现这个网址：localhost/website/#window_fancybox74（如果是fancybox 74 的新闻）。但我没有成功在我的 jQuery 脚本中提供这个 url！

这个 url 中的 localhost 部分意味着，他的网站不是托管在全球可访问的服务器上，而是仅托管在您的本地 PC 上。您不能向 facebook 提供本地 URL，因为除了您之外没有人可以看到它们。您需要学习如何托管服务器。

感谢您的回答沃格。我现在才回复，因为我正在寻找一个免费的主机，只是为了测试我在 facebook 上的分享。但是不起作用，当我单击“共享”链接时，它会打开一个带有 facebook 图标的窗口，但该窗口完全是白色的，什么也没有出现。你明白为什么会发生这种情况吗？

不完全是。如果您将鼠标悬停在 share 链接上，您可以发布出现的 URL 吗？

感谢您的回答沃格。出现的网址是这样的：ei-test.netau.net/#fancybox_window1

【参考方案2】：

试试这个，我知道这是一个糟糕的补丁，但它可以工作:)

$(document).ready(function() 
    var popupURL = location.href.split("#");
    if(popupURL.length > 1) 
        var action = popupURL[popupURL.length-1];
        $('a.fancybox[href="#'+action+'"]').trigger("click");
    
);

【讨论】：

感谢您的回答 Dharmesh Patel。我试图使用你的代码，但我没有成功。当我点击我的“分享”链接时，什么也没有发生：S

那是因为您删除了共享代码，保留脚本以在 facebook 上共享并添加我的代码，这样当用户来自 facebook 时，这不会显示白色花式框

还注意到在您的代码中您忘记了 <script type="text/javascript> 中的引号将其替换为 <script type="text/javascript">

感谢您的帮助 Dharmesh Patel，但当我点击“分享”时，我的 Facebook 窗口仍然是白色的

如果我在 Internet Explorer 中进行测试，而不是白色窗口，我的窗口会出现以下错误：“错误 HTTP 500 内部服务器错误”

【参考方案3】：

我想知道的事情，你使用 netau 主机或类似的东西吗？这些域及其子域由 facebook 保护。当你在https://www.facebook.com/sharer/sharer.php?u= 中使用它时，它会给出空白页。如果你知道的话，我写这些行是为了提醒你。

而且，如果您使用的是有效的 url 并且不受 facebook 的保护，那么您想要的没有什么大问题。你不会得到那个空白页。但是你的想法中的问题点是facebook从你的页面的html中获取标题、描述和图像“新闻缩略图”，所以当每个人点击分享按钮时，都会得到相同的标题、描述和缩略图。因此，为了处理这个问题，我建议在单个页面的幕后制作一个小脚本来处理它。如果这有意义，请告诉我，我很乐意提供帮助。

【参考方案4】：

转到 facebook 开发者页面并创建一个应用程序并将其添加到您页面的正文中

<div id="fb-root">
</div>
<script>        (function (d, s, id) 
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=YOUR_APP_ID&version=v2.0";
        fjs.parentNode.insertBefore(js, fjs);
     (document, 'script', 'facebook-jssdk'));
</script>

将 YOUR_APP_ID 替换为您从 facebook 获得的 appid

然后在你想要分享按钮的地方添加这个..

<div class="fb-like" data-layout="standard" data-action="like" data-show-faces="false"
                data-share="true" >

为 Facebook 使用的共享图像添加元标记

<meta property="og:image" content="http://www.example.com/images/logo.png" />

【参考方案5】：

您的主机似乎不支持在 Facebook 上分享。在 Facebook 上分享任何链接的简码链接是：

http://www.facebook.com/sharer.php?u= &t= 

其中，u 是 url，t 是页面的 title。

现在，当我尝试通过以下链接在 Facebook 上分享您的文章时：

https://www.facebook.com/sharer/sharer.php?u=http://ei-test.netau.net/&t=United%20FC%20win%20the%20game

什么都没有出现。但是，如果您尝试其他链接，例如：

https://www.facebook.com/sharer/sharer.php?u=http://www.infismash.com/hover-social-buttons-wordpress/&t=United%20FC%20win%20the%20game

它清楚地显示了 Facebook 上的分享选项。

基本上，如果您尝试其他主机，我认为您的问题将得到解决。另外，请记住，许多 Facebook 不支持许多免费托管网站。

由于您想共享个人modal windows，您可以做的是尝试为每个模式窗口指定一个标识符，例如#identifier-1.fancybox-overlay .fancybox-overlay-fixed。查看identifier-1。这个1 将是每个帖子的id。因此，当任何人点击您的链接（如 http://ei-test.netau.net/#identifier-1）时，将打开一个窗口，其中模式处于活动状态。

【参考方案6】：

Facebook sharer.php 已被弃用，您需要使用他们的“共享对话框”，这确实需要在 facebook 上为您的域设置一个 APP ID。

https://www.facebook.com/dialog/share?
app_id=145634995501895
&display=popup
&href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F
&redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

然而，这种方法确实从您提供的 URL 中提取元数据，您可以使用他们的 javascript API 为您的分享提供一个唯一的标题、描述和 url。

参考： https://developers.facebook.com/docs/sharing/reference/share-dialog#redirect https://developers.facebook.com/docs/javascript/quickstart/v2.1

【讨论】：

共享对话框不接受标题、描述、缩略图等附加参数，但会从共享 URL 的 OG 元数据中获取这些值。

是的......就像我在回复中所说的“但是这种方法确实从您提供的 URL 中提取元数据......”