Facebook 无需 JavaScript 即可分享链接

发布于 2025-01-01 16:26:50 字数 317 浏览 4 评论 0原文

以下链接用于在 Twitter 上共享页面:

http://twitter.com/share

是否有类似的选项Facebook 不需要 JavaScript?

我知道 http://facebook.com/sharer.php,但这需要一个 get 参数手动插入(我不会这样做),或使用 JavaScript(这不适合我的情况)。

The following link is for sharing a page on Twitter:

http://twitter.com/share

Is there a similar option for Facebook that doesn't require JavaScript?

I know about http://facebook.com/sharer.php, but that requires a get parameter to be inserted manually (which I'm not going to do), or with JavaScript (which doesn't fit my situation).

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

扫码二维码加入Web技术交流群

发布评论

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

评论(11

自此以后,行同陌路 2025-01-08 16:26:50

您可以使用

<a href="https://www.facebook.com/sharer/sharer.php?u=#url" target="_blank">
    Share
</a>

“当前没有共享选项”,而不将当前 url 作为参数传递。您可以使用间接的方式来实现此目的。

  1. 创建一个服务器端页面,例如:“/sharer.aspx”
  2. 每当您需要共享功能时链接此页面。
  3. 在“sharer.aspx”中获取引用网址,并将用户重定向到“https://www.facebook.com/sharer/sharer.php?u={referer}”

示例 ASP .Net 代码:

public partial class Sharer : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        var referer = Request.UrlReferrer.ToString();

        if(string.IsNullOrEmpty(referer))
        {
            // some error logic
            return;
        }

        Response.Clear();
        Response.Redirect("https://www.facebook.com/sharer/sharer.php?u=" + HttpUtility.UrlEncode(referer));
        Response.End();
    }
}

You could use

<a href="https://www.facebook.com/sharer/sharer.php?u=#url" target="_blank">
    Share
</a>

Currently there is no sharing option without passing current url as a parameter. You can use an indirect way to achieve this.

  1. Create a server side page for example: "/sharer.aspx"
  2. Link this page whenever you want the share functionality.
  3. In the "sharer.aspx" get the refering url, and redirect user to "https://www.facebook.com/sharer/sharer.php?u={referer}"

Example ASP .Net code:

public partial class Sharer : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        var referer = Request.UrlReferrer.ToString();

        if(string.IsNullOrEmpty(referer))
        {
            // some error logic
            return;
        }

        Response.Clear();
        Response.Redirect("https://www.facebook.com/sharer/sharer.php?u=" + HttpUtility.UrlEncode(referer));
        Response.End();
    }
}
jJeQQOZ5 2025-01-08 16:26:50

Ps 2:正如 Justin 所指出的,请查看 Facebook 的新共享对话框。将把答案保留给后代。这个答案已过时


简短的回答,是的,Facebook 有一个类似的选项,不需要 javascript(好吧,有一些最小的内联 JS 不是强制性的,请参阅注释)。

Ps:onclick 部分仅帮助您稍微自定义弹出窗口,但代码工作不需要...没有它也可以正常工作.

Facebook

<a href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Facebook">
</a>

Twitter

<a href="https://twitter.com/share?url=URLENCODED_URL&via=TWITTER_HANDLE&text=TEXT"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Twitter">
</a>

Ps 2: As pointed out by Justin, check out Facebook's new Share Dialog. Will leave the answer as is for posterity. This answer is obsolete


Short answer, yes there's a similar option for Facebook, that doesn't require javascript (well, there's some minimal inline JS that is not compulsory, see note).

Ps: The onclick part only helps you customise the popup a little bit but is not required for the code to work ... it will work just fine without it.

Facebook

<a href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Facebook">
</a>

Twitter

<a href="https://twitter.com/share?url=URLENCODED_URL&via=TWITTER_HANDLE&text=TEXT"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"
   target="_blank" title="Share on Twitter">
</a>
神魇的王 2025-01-08 16:26:50

您可以在代码中包含 JavaScript 并且仍然支持非 JavaScript 用户。

如果用户在没有启用 JavaScript 的情况下单击以下任何链接,它只会打开一个新选项卡:

<!-- Remember to change URL_HERE, TITLE_HERE and TWITTER_HANDLE_HERE -->
<a href="http://www.facebook.com/sharer/sharer.php?u=URL_HERE&t=TITLE_HERE" target="_blank" class="share-popup">Share on Facebook</a>
<a href="http://www.twitter.com/intent/tweet?url=URL_HERE&via=TWITTER_HANDLE_HERE&text=TITLE_HERE" target="_blank" class="share-popup">Share on Twitter</a>
<a href="http://plus.google.com/share?url=URL_HERE" target="_blank" class="share-popup">Share on Googleplus</a>

因为它们包含 share-popup 类,所以我们可以轻松地在 jQuery 中引用它们,并更改窗口大小为了适应我们分享的领域:

$(".share-popup").click(function(){
    var window_size = "width=585,height=511";
    var url = this.href;
    var domain = url.split("/")[2];
    switch(domain) {
        case "www.facebook.com":
            window_size = "width=585,height=368";
            break;
        case "www.twitter.com":
            window_size = "width=585,height=261";
            break;
        case "plus.google.com":
            window_size = "width=517,height=511";
            break;
    }
    window.open(url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,' + window_size);
    return false;
});

不再有丑陋的内联 JavaScript,或无数的窗口大小更改。而且它仍然支持非 JavaScript 用户。

It is possible to include JavaScript in your code and still support non-JavaScript users.

If a user clicks any of the following links without JavaScript enabled, it will simply open a new tab:

<!-- Remember to change URL_HERE, TITLE_HERE and TWITTER_HANDLE_HERE -->
<a href="http://www.facebook.com/sharer/sharer.php?u=URL_HERE&t=TITLE_HERE" target="_blank" class="share-popup">Share on Facebook</a>
<a href="http://www.twitter.com/intent/tweet?url=URL_HERE&via=TWITTER_HANDLE_HERE&text=TITLE_HERE" target="_blank" class="share-popup">Share on Twitter</a>
<a href="http://plus.google.com/share?url=URL_HERE" target="_blank" class="share-popup">Share on Googleplus</a>

Because they contain the share-popup class, we can easily reference these in jQuery, and change the window size to suit the domain we are sharing from:

$(".share-popup").click(function(){
    var window_size = "width=585,height=511";
    var url = this.href;
    var domain = url.split("/")[2];
    switch(domain) {
        case "www.facebook.com":
            window_size = "width=585,height=368";
            break;
        case "www.twitter.com":
            window_size = "width=585,height=261";
            break;
        case "plus.google.com":
            window_size = "width=517,height=511";
            break;
    }
    window.open(url, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,' + window_size);
    return false;
});

No more ugly inline JavaScript, or countless window sizing alterations. And it still supports non-JavaScript users.

め七分饶幸 2025-01-08 16:26:50

尝试这些链接类型实际上对我有用。

https://www.facebook.com/sharer.php?u=YOUR_URL_HERE
https://twitter.com/intent/tweet?url=YOUR_URL_HERE
https://plus.google.com/share?url=YOUR_URL_HERE
https://www.linkedin.com/shareArticle?mini=true&url=YOUR_URL_HERE

Try these link types actually works for me.

https://www.facebook.com/sharer.php?u=YOUR_URL_HERE
https://twitter.com/intent/tweet?url=YOUR_URL_HERE
https://plus.google.com/share?url=YOUR_URL_HERE
https://www.linkedin.com/shareArticle?mini=true&url=YOUR_URL_HERE
萌︼了一个春 2025-01-08 16:26:50

我知道这是一个旧线程,但我必须为一个项目做类似的事情,我想分享 2019 年的解决方案。

新的 dialog API 无需任何 JavaScript 即可获取参数并使用。

参数为:

  • app_id (必需)
  • href 您希望共享的页面的 URL,如果没有通过,将使用当前 URL。
  • hashtag 必须具有 # 符号,例如 #amsterdam
  • quote 文本才能与链接共享

您可以创建一个没有任何 javascript 的 href,所以曾经。

<a href="https://www.facebook.com/dialog/feed?&app_id=APP_ID&link=URI&display=popup"e=TEXT&hashtag=#HASHTAG" target="_blank">Share</a>

需要考虑的一件事是,Facebook 正在使用 Open Graph,以防您的 OG 标签如果设置不正确,您可能无法得到您想要的结果。

I know it's an old thread, but I had to do something like that for a project and I wanted to share the 2019 solution.

The new dialog API can get params and be used without any javascript.

The params are:

  • app_id (Required)
  • href The URL of the page you wish to share, in case none has passed will use the current URL.
  • hashtag have to have the # symbol for example #amsterdam
  • quote text to be shared with the link

You can create an href without any javascript what so ever.

<a href="https://www.facebook.com/dialog/feed?&app_id=APP_ID&link=URI&display=popup"e=TEXT&hashtag=#HASHTAG" target="_blank">Share</a>

One thing to consider is that Facebook is using Open Graph so in case your OG tags are not set properly you might not get the results you wish for.

二智少女猫性小仙女 2025-01-08 16:26:50

您可以使用 Feed URL“直接 URL”选项,如 Feed 对话框 页面中所述:

您还可以通过显式将用户定向到 /dialog/feed 端点来打开 Feed 对话框:

  https://www.facebook.com/dialog/feed?  
  app_id=123050457758183&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=http://www.example.com/response`

看起来他们不再在文档中的任何地方提到“共享”;这已被添加到您的 Feed 的概念所取代。

You can use the Feed URL "Direct URL" option, as described on the Feed Dialog page:

You can also bring up a Feed Dialog by explicitly directing the user to the /dialog/feed endpoint:

  https://www.facebook.com/dialog/feed?  
  app_id=123050457758183&
  link=https://developers.facebook.com/docs/reference/dialogs/&
  picture=http://fbrell.com/f8.jpg&
  name=Facebook%20Dialogs&
  caption=Reference%20Documentation&
  description=Using%20Dialogs%20to%20interact%20with%20users.&
  redirect_uri=http://www.example.com/response`

Looks like they no longer mention "sharing" anywhere in their docs; this has been replaced with the concept of adding to your Feed.

堇色安年 2025-01-08 16:26:50

其中很多答案不再适用,所以这是我的:

使用 中描述的共享对话框Facebook 开发页面

示例:

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

但是您必须输入注册的 app_id、href 和重定向 uri。

Lots of these answers no longer apply, so here's mine:

Use the Share Dialog described at the Facebook Dev Page.

Example:

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

But you have to put in your registered app_id, the href, and a redirect uri.

篱下浅笙歌 2025-01-08 16:26:50

http://facebook.com/sharer.php 已弃用

您有几个选项(使用 iframe 版本) ):

http://developers.facebook.com/docs/reference/plugins/like/ < /一>

<一href="http://developers.facebook.com/docs/reference/plugins/send/" rel="nofollow">http://developers.facebook.com/docs/reference/plugins/send/

https://developers.facebook.com/docs/reference/plugins/like-框/

奶茶白久 2025-01-08 16:26:50

对于那些希望使用 javascript 但不想使用 Facebook javascript 库的人:

<a id="shareFB" href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"   target="_blank" title="Share on Facebook">Share on Facebook</a>
<script type="text/javascript">document.getElementById("shareFB").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=" + document.URL);</script>

即使禁用 javascript,也可以工作,但如果启用 javascript,则会显示一个带有共享预览的弹出窗口。

无需使用任何 Facebook js 间谍软件,即可节省一键点击 :)

For those that wish to use javascript but do not want to use the Facebook javascript library:

<a id="shareFB" href="https://www.facebook.com/sharer/sharer.php?u=URLENCODED_URL&t=TITLE"
   onclick="javascript:window.open(this.href, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false;"   target="_blank" title="Share on Facebook">Share on Facebook</a>
<script type="text/javascript">document.getElementById("shareFB").setAttribute("href", "https://www.facebook.com/sharer/sharer.php?u=" + document.URL);</script>

Works even if javascript is disabled, but gives you a popup window with share preview if javascript is enabled.

Saves one needles click while not using any Facebook js spyware :)

聆听风音 2025-01-08 16:26:50

添加到 @rybo111 的解决方案中,LinkedIn 共享如下:

<a href="http://www.linkedin.com/shareArticle?mini=true&url={articleUrl}&title={articleTitle}&summary={articleSummary}&source={articleSource}" target="_blank" class="share-popup">Share on LinkedIn</a>

并将其添加到您的 Javascript 中:

case "www.linkedin.com":
    window_size = "width=570,height=494";
    break;

根据 LinkedIn 文档:https://developer.linkedin.com/docs/share-on-linkedin(请参阅“自定义 Url”部分)

对于任何感兴趣的人,我在 Rails 应用程序中使用了它带有 LinkedIn 徽标,如果有帮助的话,这是我的代码:

<%= link_to image_tag('linkedin.png', size: "50x50"), "http://www.linkedin.com/shareArticle?mini=true&url=#{job_url(@job)}&title=#{full_title(@job.title).html_safe}&summary=#{strip_tags(@job.description)}&source=SOURCE_URL", class: "share-popup" %>

Adding to @rybo111's solution, here's what a LinkedIn share would be:

<a href="http://www.linkedin.com/shareArticle?mini=true&url={articleUrl}&title={articleTitle}&summary={articleSummary}&source={articleSource}" target="_blank" class="share-popup">Share on LinkedIn</a>

and add this to your Javascript:

case "www.linkedin.com":
    window_size = "width=570,height=494";
    break;

As per the LinkedIn documentation: https://developer.linkedin.com/docs/share-on-linkedin (See "Customized Url" section)

For anyone who's interested, I used this in a Rails app with a LinkedIn logo, so here's my code if it might help:

<%= link_to image_tag('linkedin.png', size: "50x50"), "http://www.linkedin.com/shareArticle?mini=true&url=#{job_url(@job)}&title=#{full_title(@job.title).html_safe}&summary=#{strip_tags(@job.description)}&source=SOURCE_URL", class: "share-popup" %>
桃扇骨 2025-01-08 16:26:50

如何分享内容:https://developers.facebook.com/docs/share/

必须选择使用不使用 JS 的已弃用功能,并每天检查,或者遵循使用 JS 的方式并享受乐趣。

How to share content: https://developers.facebook.com/docs/share/

You have to choose use the deprecated function without JS, and check every day, or follow the way use JS and have fun.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文