创建应用

接入

使用Hello.js接入

使用Hello.js简化接入，facebook和twitter接入方法一样。

Hello.js（http://adodson.com/hello.js/）是一个客户端JavaScript SDK，用于OAuth2认证Web服务以及请求它们的REST Api。

HelloJS标准化了路径，并响应常见的API，比如说Google Data Services、Facebook Graph以及Windows Live Connect。它们是模块，所以这个列表还在增长中。

// 初始化,配置应用idhello.init({facebook: FACEBOOK_CLIENT_ID,windows: WINDOWS_CLIENT_ID}, {redirect_uri:redirect.html})// 登录hello.on(auth.login, function(auth){// 登录成功后，获取用户信息（fb、tw的用户数据有区别）hello( auth.network ).api( /me ).then(function (res) {console.log(res)})})

Facebook登录后获取的用户信息

{email: "XX@gmail.com",first_name: "XX",id: "123456",last_name: "XX",name: "XX",picture: "url",thumbnail: "url"}

Twitter登录后获取的用户信息

{"id": 123456,"id_str": "123456","name": "XX","screen_name": "XX","location": "","description": "xx","url": "url","entities": {"description": {"urls": []}},"protected": false,"followers_count": 0,"friends_count": 0,"listed_count": 0,"created_at": "Fri Mar 08 03:36:20 +0000 2022","favourites_count": 0,"utc_offset": null,"time_zone": null,"geo_enabled": false,"verified": false,"statuses_count": 0,"lang": "en","contributors_enabled": false,"is_translator": false,"is_translation_enabled": false,"profile_background_color": "F5F8FA","profile_background_image_url": null,"profile_background_image_url_https": null,"profile_background_tile": false,"profile_image_url": "url","profile_image_url_https": "url","profile_link_color": "1DA1F2","profile_sidebar_border_color": "C0DEED","profile_sidebar_fill_color": "DDEEF6","profile_text_color": "333333","profile_use_background_image": true,"has_extended_profile": false,"default_profile": true,"default_profile_image": true,"following": false,"follow_request_sent": false,"notifications": false,"translator_type": "none","suspended": false,"needs_phone_verification": false,"first_name": "XX","last_name": "","thumbnail": "url"}

Facebook分享

触发分享：

<a href="javascript:void(0)" @click="fbShare">facebook 分享</a>fbShare () {let sharePath = // 分享出去之后别人打开的链接let title = // 分享标题window.open(https://www.facebook.com/sharer/sharer.php?u= + encodeURIComponent(sharePath) + &t= + encodeURIComponent(title), _blank, toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450, top=100, left=350)}

分享信息设置：

分享出去的样式包含图片，标题，简介

这些信息不是分享的时候设置的，是爬虫直接爬的分享链接页面head中预先设置好的分享信息，head配置如下

<meta property="og:locale" content="en-US"><meta property="og:type" content="website"><meta property="og:title" content="realme Holi Game"><meta property="og:image" content="xx.jpg"><meta property="og:description" content="hello world">

Twitter分享

触发分享：

<a href="javascript:void(0)" @click="twShare">Twitter 分享</a>twShare () {let content =window.open(`https://twitter.com/share?text=${encodeURIComponent(data.title)}&url=${encodeURIComponent(urlStr)}`, _blank, toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=600, height=450, top=100, left=350)}

分享信息设置：

分享出去的样式包含图片，标题，简介

这些信息不是分享的时候设置的，是爬虫直接爬的分享链接页面head中预先设置好的分享信息，head配置如下

<meta name="twitter:title" content="realme Holi Game"><meta name="twitter:description" content="content"><meta name="twitter:image" content="xx.jpg"><meta name="twitter:card" content="summary">