1. 首页
  2. 首页

facebook分享那点事儿按钮和自定义文字[关闭]

假如应用面向国外用户,那涉及到分享的就不免使用到Facebook、twitter这些平台。它们各有各的文档和使用方法,需要一个个的去对接,可以说是很费劲了。

近来使用到了海外的分享SDK,在这里记载一下碰到的问题。

差别的交际平台

要集成交际分享,海外轻易想到的就是下面这几个:

  • Facebook:感觉最大最久长的,像国内的QQ和空间
  • Twitter:国外的微博,注册开发者比较麻烦,要填写一堆工具,等候考核
  • Tumblr:轻博客,UI雅观,发图片视频文字等,一度成为福利聚集地
  • Instagram:分享图片,感觉比较火,如今是Facebook的

时间有限,Twitter就没有去注册了,Tumblr也没去理解。对于安卓来说,集成谷歌的工具比较方便,然而谷歌的Google plus已经下线了。就看了下Facebook和Instag的分享集成。

SDK集成——Android

不得不说真是大的科技公司,Google和Facebook的文档写的很具体,基本上看着文档就能完成所需要的功能对接。对比之下,新浪微博那么多用户,网站也算是跟着与时俱进了,但一打开开发者平台,那个网页好像停顿在多年之前一样平常。

Facebook的入门文档 Getting Started Android SDK 已经具体描述了怎样在A!ndroid Studio中参加依靠并完成需要的设置,连设置署名的下令都给你写好了。只需使用对应的下令声称key,填入开发者平台,SDK就能正常调用SDK功能了。

我这里分享需要的是分享一个网页链接,分享出去看到的盼望是一张图片,标题和描述,用户点击能条转到指定的地点。

分享示例

看了Instagram的文档后发现,Instagram已经取消了图片的分享接口,使用SDK并不能设置一张图片,因此放弃了Instagram的分享。

和微信微博等分享网页差别,Facebook设置这些信息不是通过SDK传入参数,而是使用的 图谱API ,像分享的图片,网页,标题等,可以在网页 <head> 标签内添加 对应的 <meta> 标签来描述这些信息,Facebook会主动去剖析这些数据。

具体的meta标签这里有文档讲明: https://developers.facebook.com/docs/sharing/webmasters#markup

由于分享的目的地点是基于 Vue 之类的前端框架做的,这样的问题是页面在前端渲染,会导致Facebook无法剖析到对应的meta信息,由于它不会去帮你实行js来渲染页面。因此只有放了一个后端渲染的页面专门用于Facebook的分享剖析使用,页面的内容如下:

<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="https://www.facebook.com/2008/fbml" xmlns:og="http://ogp.me/ns#"> <head> <meta charset="UTF-8" /> <title>Share</title> <meta property="og:title" content="分享标题" /> <meta property="og:description" content="分享描述" /> <meta property="og:image" content="分享图片" /> <meta property="og:url" content="" /> <meta property="og:type" content="website" /> <meta property="fb:app_id" content="appid" /> <meta content="1000" property="og:image:width" /> <meta content="666" property="og:image:height" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/> </head> <body> Content </body> </html>

这里的参数都好明白,让人感到迷惑的是 og:url ,乍一看到这个属性,想到的就是它和别的的属性一样,会被Facebook剖析之后用于分享条转的目的地点,那这样就可以设置另一个真正的目的地点。然而设置好之后在 分享调试器 中测试时,却总是提示返回了404错误。

这里让人狐疑了好久,明明填进去的地点是可以访问的,为啥工具调试就说404呢?并且剖析到的图片标题都不是这里填写的。最后才发现, 假如填了这个 og:url ,Facebook就会忽略当前页面,而去抓取这个url里的meta信息! 怎么,和想的不一样额。

以是只能把它写成的当前页面的地点,也可以不填,默认就是当前页面地点,但在调试工具里会有告诫,提示缺少这个属性。

但这样一来,用户访问到的也是这个页面,只幸亏这个页面上加上了主动条转,条转到真正的分享的页面去,而对于Facebook来说,它不实行js,也不条转,就能获取到这个页面设置的分享信息。还要留意Facebook抓取信息之后是会缓存的,假如信息频繁更新,最好把分享链接加上时间戳之类的,让它能重新抓取。

微博&微信

国内用到了微博和微信,相比之下,微信的文档也还好,而微博的文档让然感觉比较零星,看到这儿又不知道下一步要怎么做,在哪儿有说明。

微信比较坑的一点是,它只能设置一个署名信息,意味着你只能要么设置测试的版本,要么设置正式的版本署名,极不方便调试。

微博文档里写了分享网页,有设置图片,标题,描述,地点等,并且在唤起微博客户端的时间,在编辑界面表现的都是这样的卡片样式,而分享出去就变成了一个普通的超链接样式。一开始以为是测试版的缘故,后来发现他们别的地方的文档又写了,这个功能被移除了,要表现为卡片,需要对接商务互助,大概就是需要收费之类的。

因此,各个平台都有些坑,后来看到某些集成分享的第三方平台支持微博的卡片表现,也同时支持国内外的各个平台。就使用他们的SDK,就能集成各个平台,相比之下越发方便。假如需要对接多个平台的也可以实验一下。

facebook分享无法设置title

为了给Facebook提供自定义参数,最好共享它的链接,然后Facebook 从您共享的页面主动获取其 Title + Description + Picture 。为了“帮助” facebook API找到那些工具,您可以将以下工具放在您共享的页面的标题中:

<meta property = "og:title" content = "title" /> <meta property = "og:description" content = "description" /> <meta property = "og:image" content = "thumbnail_image" /> 在这里检察

假如页面不受您的控制,请使用 AllisonC 上面共享的内容。

对于弹出模式视图种类的行为:

使用您自己的按钮/链接/文本,然后您可以通过以下方法使用弹出窗口的模式视图种类:

<script type = 'text/javascript' > $ ( '#twitterbtn-link,#facebookbtn-link' ). click ( function ( event ) { var width = 575 , height = 400 , left = ( $ ( window ). width () - width ) / 2 , top = ( $ ( window ). height () - height ) / 2 , url = this . href , opts = 'status=1' + ',width=' + width + ',height=' + height + ',top=' + top + ',left=' + left ; window . open ( url , 'twitter' , opts ); return false ; }); </script>

此中twitterbtn-link和facebookbtn-link都是锚点的ID。

敬爱的开发者小伙伴:我们很兴奋和大家分享一个消息,团队正式启用Mob.com顶级域名,Mob即Mobile缩写,全面转型为移动

察看详情
敬爱的开发者小伙伴:

我们很兴奋和大家分享一个消息,ShareSDK正式启用Mob.com顶级域名,Mob即Mobile缩写,全面转型为移动开发者服务平台,帮助移动开发者快速实现创业梦想!

非常谢谢大家一如既往地支持ShareSDK,为了给您提供更优质的产品体验和服务,我们团队不停地在积极。自从ShareSDK 2013年1月16日上线以来,已经有超越4万款APP在使用我们的服务。在短短1年半的时间内,我们收到各方的反馈和提议,不停地满意开发者的需求。先 后推出了评述和赞,短链服务,Cocos2d-x、Unity3D、JS、ANE 四大开发引擎的专用快速集成组件,本年6月我们还公布了3款全新产品,ShareRec手游录像分享,摆设版统计分析和短信验证码,全部产品完全免费,致 力为开发者提供开发、运营、!推广、红利等全方位支持!

CEO:陈钢强
2014年7月8日

Rank: 1
主题:
帖子:
积分:
0
工程师你好:

我在技能QQ里也问了这个问题,假如收到回答,我会把解决方案增补到这。


如图,我们想自定义 标题,也就是 “APPLINK分享链接跳转”这个文字,

我留意到技术资料里标明:按图片上的意思,这个标题是不可以自定义的


但是我们的分享内容里又出现了 标题,以是我想问这个 网页链接分享,标题可否在SDK里设置,还是说,
我们需要再被分享的网页链接页面做出 标题设置,您是否知道是哪个head标签处置这个?
Rank: 1
主题:
帖子:
积分:
0
沙发

楼主

| 发布于 2016-9-24 16:54:04 |
问题已经解决,sdk里不能对分享标题做出设置。FACEBOOK自己会到网页链接里去抓取内容,抓取的标签是:
<meta property="og:title" content="
有需求的小伙伴可以自己百度一下。
留意,分享链接最好加个随机数,每次都不一样,否则facebook轻易去引用缓存的内容,不能准确表现你想要的标题内容等等。


本文网址: http://www.51iflove.com/p/20201020151153_6418_898260470/home