相較於Facebook掛掉, Cloudflare掛掉比較嚴重吧!

Facebook 於台北時間今天(2021/10/5)凌晨服務異常, 導致旗下服務大規模(除了 facebook, 還有 instagram, whatsapp 等, 連帶 facebook login相依)無法使用, 用戶深受影響. (已於 5:00左右恢復, 原因為DNS)

不過比起 Facebook 異常, 若是 Cloudflare 異常, 我覺得才是更嚴重的吧, 除了大量的網路流量在其架構承載外, 也有大量的 DNS 在其上代管而被查詢.

(圖片引用自: https://downdetector.com/status/facebook/)

由上面的圖表可見異常的狀況與恢復的狀況.

其實之前Cloudflare 也有故障過的狀況, 可以看到:

看起來這些服務都對大家影響甚鉅啊..

繼續閱讀:

你怎麼看呢? 什麼服務影響你最大呢? 我的話應該會是 Google 的gmail 了吧!!

分類
手機大未來

如何於手機開啟Facebook APP指定粉絲團、活動、社團、個人頁的方式

在網頁上或是APP裡, 想要於行動設備開啟 Facebook APP的指定粉絲團、活動、社團、個人頁, 要如何進行呢?

可以使用 fb:// 的 intent protocol, 以下為簡單說明:

粉絲專頁, 以 facebook 本身官方的粉絲專頁為例, https://www.facebook.com/facebook/, 我們先找出它的 fan page id: 20531316728, 可以使用工具: https://lookup-id.com/

接下來我們需要實作判定 android 或 iOS 來決定啟動的方式, Android 如下:

fb://page/20531316728

iOS 如下:

fb://page?id=20531316728

大家可以試看看, 若是社團呢? 一樣, 先找出社團代碼, 以這個社團為例: https://www.facebook.com/groups/facebook360community/
, 找出它的 groupid 為: 241193586214590, 然後使用以下網址:

Android: fb://group/241193586214590

iOS: fb://group?id=241193586214590

當然, 像是活動, 或是個人頁, 也都可以使用對應的 event / profile 來進行操作, 很方便也很直覺, 另外最重要的一點, 記得若是有 id 的狀況下, 直接使用:

https://facebook.com/[id]

也會直接到對應的粉絲團、活動、社團、個人頁哦.

參考資料:

https://stackoverflow.com/questions/4810803/open-facebook-page-from-android-app
https://stackoverflow.com/questions/47794033/open-link-to-facebook-group-in-facebook-app-on-android

 

 

Cloudflare新功能Access

Cloudflare 的強大功能再出新服務 Access, 之前在 Beta 後, 最近上線正式版本了, 而且非常棒的是同時 5人以下是免費的(不過仍需要註冊信用卡或 Paypal, 不過不用擔心, 因為人數是自訂, 超過5人時, 第6人是無法使用的).

Cloudflare Access 服務提供了強化存取權限的功能, 不僅能有效降低管理端的負擔, 也能方便存取敏感性資料的後端, 舉例來說, 以往可能是走 VPN 的方式, 使用特定內部 IP 來存取特定服務的地方, 可以直接不用 VPN 改走外部 IP (當然必須是固定的, 或一個 Range), 以白名單方式存取外, 還能更容易用 email 驗證方式, 或是第三方像是 facebook / google 等登入授權方式進行.

如此一來, 可以更容易, 更彈性地管理敏感性資料的後端, 即使不在白名單的 IP 內也可以透過 Email 驗證(使用 email 收 token 方式), 或第三方登入方式進行驗證.

最基本的設定方式如下:

特定 URL, 於 policy 1 設定一個白名單群的 ip, 使用 bypass 方式, 而另一個 policy 2 則是設定特定 email 允許存取 (allow), 如此一來, 在存取特定 URL 時, 若在白名單 IP 就直接進入, 而在外部 IP 時, 則會出現 Cloudflare 的登入畫面如下:

輸入 email 後, 若是在名單內的 email , 則會寄出認證碼, 若不是則不會寄出哦, 用戶是等不到任何通知與錯誤訊息的(但 cloudflare 會有記錄可以查 login pass 與 login denied), 輸入認證碼後, 即可順利進入指定 url 進行操作:

存取記錄如下:

如此一來, 在白名單 IP 內, 或是不在白名單 IP 內的用戶都可以透過更安全更快速的存取方式來進行特定 URL 的存取了.

真的很方便好用, 快去試看看.

官方文件: https://blog.cloudflare.com/cloudflare-access-now-teams-of-any-size-can-turn-off-their-vpn/

分類
好用軟體

Facebook直播即時投票畫面產生器

相信大家已經看過許多 Facebook 直播上有投票票數的畫面吧, 想要自己做直播, 也想要加入與網友互動投票票數的畫面要怎麼做呢? 網路上有一些介紹的文章, 不過還是用產生器做最快.

於是就寫了一個產生器來進行這種畫面產生, 連結如下:

http://sample.diary.tw/fblive-vote/

操作說明,

取得直播 id:

首先要開 Facebook 的直播(該直播必須在塗鴨牆上已公開了, 才能取得 id), 開好之後, 到已發行直播的介面上, 把滑鼠移動到發行直播的時間, 如下:

(以上圖片引用擷圖自: https://www.facebook.com/setnews/videos/1208775819207004/ 若原內容已移除請見諒.)

也就是把滑鼠移到那個”4小時”的上面, 下方會出現連結, 把連結最後的數字記下來, 也就是你的直播影片 id (postid), 也就是 1208775819207004

然後到產生器介面上填入該 id, 下面的背景色與背景圖可依需要填入, 最後的 6個互動投票會使用哪些, 說明文字是什麼, 以上面三立新聞為例, 可以填入如下內容:

按下 submit 即可產出連結, 再連到該畫面可得:

這個數字會隨著網友的投票而跳動, 也就是直播的來源之一, 操作方式在 OBS 壓縮器上, 新增一來源為 BrowserSource, 填入上面的網址, 即可將這個動態的結果秀在壓縮器上, 送出直播畫面的結果. (預設的 BrowserSource 為 800×600, 產生器的畫面是 1280×720, 記得要調整一下:

為你的 facebook 直播來點更有趣的互動吧.

投票選項若為2, 3 則為一行平均分配, 若為 4就會是像上面一樣上2下2, 若為 5則是上2下3的方式, 若為 6, 則為上3下3.

另外若是需要在 OBS 中, 背景內容能夠透明, 則將 bgcolor 與 bgimage 留空, 然後在 OBS 中, 的 BrowserSource 下方 CSS 部分調整 background-color: rgba(0, 0, 0, 0) 如下:

之後把這個 BrowserSource 放在最上層, 下面的圖層也都會透出來, 就可以做到透明圖層的效果了. 如下:

效果還蠻不錯的.

繼續閱讀:

如何使用第三方壓縮器在Facebook個人帳號上進行直播 https://diary.tw/archives/1620
皮克直播使用 obs 教學 http://tw.pikolive.com/liveteach/facebook
國外的操作教學 https://socialwall.me/en/capture-stream-in-real-time-facebook-live-reactions/
Facebook直播也能投票 心情計數這樣玩! https://www.saydigi.com/2016/11/facebook-live-reactions.html

分類
好用軟體

如何使用第三方壓縮器在Facebook個人帳號上進行直播

Facebook 上直播很有趣, 而且可以更快速地傳播, 但目前支援第三方壓縮器的功能只在粉絲團上有, 個人帳號沒有. 為什麼要用第三方壓縮器(encoder)呢? 主要是希望有更好的品質, 或是直接應用在玩遊戲的畫面直播, 像是 OBS (https://obsproject.com/), XSplit (https://www.xsplit.com/), Wirecast (付費工具, http://www.telestream.net/wirecast/overview.htm) 等工具.

然後目前 Facebook 介面上, 只有粉絲團有這個功能, 個人帳號只能用手機發起一個直播, 要如何進行這個部分呢, 可以使用 facebook api 來完成, 參考這裡:

https://developers.facebook.com/docs/videos/live-video/exploring-live#golivedialog

當然, 要實作這個需要寫個小程式的網頁來達成, 這裡實作了這個功能, 方便大家來使用, 請連結:

http://sample.diary.tw/fblive-with-3rd-encoder/

只需要點擊上面按鈕, 就可以進行設定程序了, 最後可以拿到 rtmp 用的 url 與金鑰, 就可以放到第三方的壓縮器進行直播.

OBS 輸入 rtmp 後直播操作介紹:
https://obsproject.com/forum/resources/how-to-stream-to-facebook-live.391/
https://axiang.cc/archives/22392

分類
程式技術

Facebook Avatar – 大頭圖取得

可以利用 Facebook 的 Graph API 進行即可.

facebook avatar api:
http://graph.facebook.com/[user-id]/picture default: 50×50

http://graph.facebook.com/[user-id]/picture?height=100&width=100 for 100×100

其中的 [user-id] 直接拿驗證後的 fbid 值即可, 原始的 fbid 也是可以正常使用的, 另外有設定自訂名稱的亦可.

參考資料: https://developers.facebook.com/docs/graph-api/reference/v2.2/user/picture?locale=zh_TW

例如:

http://graph.facebook.com/4/picture
http://graph.facebook.com/zuck/picture
http://graph.facebook.com/4/picture?height=300&width=300

分類
程式技術

使用Facebook FQL查詢留言資料

用 Facebook 的網頁/網站很多, 應該是已經過了大流行的階段, 但是使用 Facebook 的地方還是很多, 如何利用程式將公開性的 Facebook 資料找查出來, 有方便好用的工具可供應用, 就是使用 FQL 查詢. 這裡介紹一般常用在網頁上留言的資料, Comment Plugin, 查找留言資訊.

先來看這篇: https://developers.facebook.com/docs/reference/fql/comment

這篇介紹 FQL 的 comment 資料查找方式, 我們以這個網頁作為例子:
http://sample.diary.tw/18/maps.htm

這裡裝了 Facebook 的 comment plugin, 那我們要查找該頁中 comment 的資料要怎麼查找呢? 首先要先找到該 comment 的 object_id, 該 id 可以利用這頁來找:
https://developers.facebook.com/tools/debug

將上面的 http://sample.diary.tw/18/maps.htm 輸入後, 按下[除錯]鈕, 在最下面的網址可以得到該 comment 的 object_id 為: 10150561101545602, 這個就是在 FQL 中, 查詢 comment 的 object_id. (在 Facebook 中, 會給定的各 object id)

再來就要下 FQL 查找資料了, 語法如下:

SELECT id, text, time, fromid FROM comment WHERE object_id='10150561101545602'

問題是從哪裡下呢? 從這裡 Graph API Explorer:
https://developers.facebook.com/tools/explorer
(若無法使用, 會引導登入 Facebook, 使用 Graph API Explorer需要登入 Facebook)

再將中間原來預設為 Graph API 的功能切到 FQL Query, 接下來把上面的查詢指令輸入, 就會得到目前的留言資料, 以 json 的方式來顯示.
接下來的使用, 相信大家就應該容易多了, 就是解析 json 把資料取出來即可.

那如何使用呢? 在程式中如何呼叫這個查詢, 而不是用 Graph API Explorer, 有沒有看到瀏覽器上方的 url 已經變了, 如下:
https://developers.facebook.com/tools/explorer?fql=SELECT%20id%2C%20text%2C%20time%2C%20fromid%20FROM%20comment%20WHERE%20object_id%3D%2710150561101545602%27
也就是說, 其實就是把查詢放到 url 中的 q 參數即可, 但使用上, 前面的 Graph API Explorer 得改成如下:
https://graph.facebook.com/fql?q=SELECT%20id%2C%20text%2C%20time%2C%20fromid%20FROM%20comment%20WHERE%20object_id%3D%2710150561101545602%27
使用 Graph FQL 查詢即可, 這是不用登入就可以使用的, 也就是說, 在程式中只需要透過 webget 等方法, 就可以取得到內容.

應該會有人問, 這個查詢結果, 其中的 text 是留言沒錯, 但沒有人名, 大頭圖, 那怎麼辦, 很簡單啊, 就再回 FQL 查詢就可以了, 不過若是有 100篇留言就要查 100次耶, 或是 smart 一點, 100篇留言, 共 30 個人在留, 那也需要做 30次的 user 查詢, 怎麼想都很難處理, 所以接下來要介紹的是多重查詢.

多重查詢, 有點像是 SQL 中的子查詢, 在面對這種 FQL 查詢時, 可以利用的技巧, 我們將查詢改一下, 改為如下:

{
"comments": "SELECT id, text, time, fromid FROM comment WHERE object_id='10150561101545602'",
"commenters": "SELECT uid, name, pic_square FROM user WHERE uid IN (SELECT fromid FROM #comments)"
}

對, 正如你看到的, 使用一個 #comments 代替前一個查詢結果, 並代入下一個查詢, 利用 json 格式, 將多重查詢放到 FQL 中, 就可以一次查詢把留言和人帶回來, 忘了說, user FQL 參考資料在這裡:
https://developers.facebook.com/docs/reference/fql/user

第二個查詢中的 uid, name, pic_square 就是常用的使用者代碼, 名稱, 大頭圖資訊.
查詢回傳結果就會有兩個 fql_resulte_set, 分別就是 comments, commenters, 如下:

中間略…
就把留言和留言者一次查回來了.

再來, 如何利用程式 parse json 的回傳結果, 就不用多說了吧, 應該就簡單多了, 快去實做看看吧.

Facebook在Alexa上超越Google

最近的 Alexa 流量有排行變動了, 久居第一的 Google 於 8/2, 8/3間的到訪量被 Facebook 超越了, 真的有意思呢, 來看看圖表:

(圖表資料引用自 http://www.alexa.com/)

其他的前幾名不動, 不過拉開時間看一下,

(圖表資料引用自 http://www.alexa.com/)

似乎前面的到訪規則有些調整, 無論如何, 這個網路排行榜, 對應的網路世界競爭, 真的很激烈呢!

分類
blog服務

利用facebook的comments做網頁的留言功能

利用 facebook 的 social plugins 中的 comments 來做網頁的留言是很方便的, 使用的方式很簡單, 只需要到 facebook 的 developer 網站取得產生的程式碼即可, 連結在此:

http://developers.facebook.com/docs/reference/plugins/comments/

其實程式碼的內容也很容易理解, 如下:

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:comments href="example.com" num_posts="2" width="500"></fb:comments>

其中的 div fb-root 是放留言的地方, 而後面的 script 才是程式的重點, 而最後的 fb:comments 則是一些參數, 其中的 href 就是留言的網址, 而 num_posts 則是在網頁上要出現最後幾則留言, width 就是這個 div 要給定的寬度.

可以參考這頁顯示的結果: http://sample.diary.tw/flickrset/ 這樣就能方便大家利用 facebook 來討論這個網頁了, 真是方便又好用的 plugin 啊.

[2011/4/15]
放好了之後一直覺得怪怪的, 因為都是英文的介面, 雖然功能及留言內容都不影響, 但其實是因為這個 facebook comments 有語系的關係, 要調整的部分很單純, 就是原來引用的 js url中有出現 en_US 改為 zh_TW 即可, 這樣一來, 介面就會變成是繁體中文了, sample 頁上也做了調整了, 可以再連去看看囉.

不過有趣的是上方的那個讚的功能, 由於沒有語系的影響, 所以在中文用戶下就會出現中文, 英文用戶下自動也會出現英文, 就沒有語系的問題了. 該”讚”的 social plugin 的語法可以由這裡取得: http://developers.facebook.com/docs/reference/plugins/like/ , 除了讚-即like外, 還有推-recommend 可供選擇應用.

Alexa世界大站

好一陣子沒有在看 Alexa 排行榜了, 發現 YAHOO 掉到第4名了, 猜了一下, 去年 Google 才擠下 yahoo (LINK), 後面應該還有 facebook 和 youtube 也擠下 yahoo, 於是到 ALEXA 排行榜查看, 果然 (Alexa Top 500 Global Sites), 名次如下:

  1. Google.com
  2. Facebook.com
  3. Youtube.com
  4. Yahoo.com
  5. Live.com
  6. Wikipedia.org
  7. Blogger.com
  8. Baidu.com
  9. Msn.com
  10. Qq.com

再來看看走勢圖, 以下列出前5名的比較:
Reach:

看得出來, Reach的部分 Facebook 成長驚人啊.
再來是 PageViews:

有持續成長的只有 google 及 facebook, 而 yahoo 是下挫的十分嚴重.
再來看看停留時間:

Facebook 更是一支獨秀, 而 youtube 也是因為影音的關係, 所以停留時間也長.
最後就是 RANK 的部分:

yahoo 從 2009年初被 google 擠到第二名後, 在 2009 暑假又被 facebook 追過來到第三名, 而 facebook 也在 2009/6左右超過 youtube 來到第三後, 再超越 yahoo 到第二名. 看這個名次的競爭真激烈啊.

不過也看得出來, facebook 的力量真是很驚人呢!