2018年11月24日 星期六

LINE Developer Day 2018 東京豐盛技術之旅(下)

早上keynote的迴響和疑惑還停留在腦海裡,沒想到一下就來到了中午,中午最讓人期待的當然就是與CTO的round table。

As a LINE API Experts,受邀參加一年一度的Developer Day是一種福利,但更有意義的則是和CTO以及其他技術主管的Round table,畢竟能夠面對面進行溝通,並且得知更多未來的發展方向與具體資訊。

先前提到過,LINE在這幾年的時間內迅速擴充,如今除了即時通訊軟體,更涉足了Fintech, 區塊鏈, 與AI等多重領域。尤其是AI這部分,關於bot engine與OCR、NLP、speech regnition…LINE都有著自己的實作,這似乎讓人有些不解,在眾多的雲端服務環繞之下,為何LINE選擇自己開發這些技術呢? 為何不使用現成的工具呢?

除此之外,我們也發現,LINE在各國推展服務的速度與順序上,有著相當大的時間差異,未來這部分是否會有統一的時程呢? 說到這部分,我們也發現比起泰國和印尼,台灣的發展速度算是來的快上很多的,這點讓來自其他國家的LAE們頗為羨慕。

不僅發展策略,還有許多關於技術上的討論,諸如,LAE大夥兒也提到,在開發Liff應用的過程中,由於WebView是崁入在LINE App裡面的,因此很難Debug,這個部分是否有好的建議呢? (沒想到還真的有,容後再跟大家介紹)

而最讓人期待的當然是,LINE API Experts是否有類似Early Access Program之類的方案,能夠較其他開發人員更早知道API的釋出與更新呢? 這些放在心裡的問題,肯定要一次問個夠…

凡此總總,都在兩場的round table有著相當深入的討論,由於LAE們是從不同國家來的,你不難發現,比起泰國、印尼、甚至日本當地的LAE,台灣代表團們可是火力全開,卯足了勁提出了一個又一個的問題,大概會議中有一半時間在回答我們這一票台灣去的LAE提出的種種問題,也算是不枉此行了。

有一個小動作我蠻佩服的,CTO和API Experts聚會結束之後,依照慣例要來張照片,但人那麼多照相隊伍該怎麼排呢? 正當大家杵在那兒不知道該怎麼動作的時候,CTO直接站出來蹲在最前面,不是站著唷,就直接蹲下來讓API Experts能夠站在身後拍照,這應該是我看過唯一一張公司女性CTO帶頭蹲著陪訪客拍照的照片,氣度非凡!

問飽了問題之後,其實早已經過了用餐時間,round table是利用中午時間舉行的,所以LINE工作人員們估計是還沒吃過午餐就陪著我們這一群充滿問題的LAE們,等到round table結束,他們也得繼續忙後面的行程了。

但Evan怕我們餓著,特別幫我們留了中午的餐盒,這餐盒的水平相當高,是兩層的便當,菜餚放的『深不見底』。基本上我敢說這絕對是我參加過的技術研討會中檔次最高的餐盒(沒有之一)。不多說,直接看圖片就好:

下午的時間過很快,天氣也冷得很快,你會看到在戶外的人群們也紛紛穿上了厚重的大衣,夜裡的八芳園其實有另一種令人驚喜的美,如果有機會到東京,這個地方真的可以特別來瞧瞧。

隨著聚會的結束,接下來就是令人期待的懇親會(這三個字是日文,可以用google翻譯一下,就知道它的意思了)。經過了一整天的技術轟炸,接下來的時間是一個可以好好放鬆的時候了…

你來到了上百人聚集的場合,怎麼可能桌上空空如也呢?

不僅各種飲品一應俱全,更讓人驚豔的是,這邊還有熊大牌啤酒:

人都來到日本,能沒有清酒嗎?

你沒看錯,一大桶的清酒,喝清酒的木碗,也別有一番風味呢!

有酒有肉才是正常,現切牛排也是吃到飽的啦。除此之外,整個會場的四周有著各式各樣的佳餚,源源不絕的供應著,各式各樣的餐點數量也太高估我們這些技術宅的胃了…

酒足飯飽之後,這一群來自台灣的我們,也留下了2018年底一個難忘回憶的剪影。
(從大夥手上的酒瓶和臉上的滿足感你大概不難想像這個盛會有多讓人印象深刻吧…)

等等,要走了嗎? 八芳園的夜景其實頗讓人想多留下來散散步,咦?

人還沒走到門口,被叫住了,原來還有離開前的伴手禮,這充滿日式風格的包裝,到底裡面有什麼呢? 回飯店一看,三層式的包裝,包含了無線充電器、吸水杯墊、以及小叮噹最愛吃的那個甜點:

除此之外,還有剛才從懇親會現場順手帶回飯店的一些小餅乾,你會發現LINE在IP的使用上毫不手軟 ^_^ :

這三天的日本之旅,讓同行的一夥人都有著豐富的收穫(包含上機前一堆人買了折扣的Clova…和一堆有的沒的電子設備)。

整個聚會當中,LINE提供了最好的環境、令人難忘的內容以及豐盛的佳肴,但真正重要的是,除了all you can eat的美食,all you can ask的round table更讓我印象深刻。

從Keynote中你很難不發現LINE的積極度與企圖心,身為LAE,我大概也開始能慢慢體會為何LINE願意如此開放的面向社群以及開發人員,它和所有的雲端大廠一樣,看到了未來必然的方向和路徑,剩下的就是持續走下去的毅力和企圖心了。

最後,貼一張我在LAE的round table結束後,拿到的一本手冊,裡面的內容我就不多說了,但如果你有緣拿到這本手冊,翻開倒數第二頁,你大概不難發現,如今LINE的整體發展與規劃當中,萬事俱備,只欠東風,剩下的是什麼了…

後記:

這兩篇,我著重在整個技術之旅的行程,後面我會再抽空把剛才提到的一些技術細節,和許多問題的答案,以獨立的文章來介紹,包含liff偵錯的方式、Clova、dApp以及OCR和bot engine,想要知道第一手資訊? 除了鎖定我們的blog,乾脆自己Apply成為LAE(LINE API Experts)是更好的方法唷…

LINE Developer Day 2018 東京豐盛技術之旅(上)

回到台北我沉澱了幾天,直到今天才終於有機會把LINE在本年度位於東京八方園舉辦的LINE Developer Day 2018盛會作一個筆記整理。

我若將整個活動稱之為『奢華豐盛的技術之旅』我想應該一點都不為過。為何寫了又槓掉了奢華二字? 這似乎有點不容易解釋。

因為整個活動的體驗,實在讓我難以用一句話一個形容詞就精準描述。雖說這畢竟是一個技術盛會,講奢華可能有點Over,但在豐盛中卻總讓人覺得有一抹低調的奢華感。別以為只是吃好住好的那種豐盛,身為技術宅對於這種身外之物並沒有太多欲求,那到底特別在何處? 且讓我娓娓道來…

由於身為LINE API Expert,今年LINE邀請我們參加了這三天兩夜的技術之旅,第一天晚上Evan Lin(LINE Technical Evangelist)被我們這群來自台北的API Experts一夥人強押作陪,在下班後被逼著一同前往體驗和牛吃到飽的快感。沒聽錯,和牛吃到飽,聚會還沒開始就已經體驗到第一種『豐盛』了。

怎麼會只有一張照片? 因為其他的都已經在來不及拍照前被餓狼般的API Experts們給吞食了,直到酒足飯飽,上面這盤其實已經有些吃不下了,才『淪落到』被拍照的地步。

但畢竟和牛吃到飽不是重點,只是奢華中的小小點綴,頂著些許微醺回到飯店看著夜景好好放鬆,準備迎接明天正式的活動才是王道:

飯店雖位於新宿鬧區內,然而從房內落地窗俯瞰著窗外東京的夜色,街道上的喧鬧仿佛已被置身度外,只剩下夜色中來來往往的JR列車的身影。

這樣的靜懿讓你很容易入睡。

第二天一早,就是重頭戲的開始了,看到入口處的這尊門牌,你可能會以為我們來到了什麼煮酒論英雄的深山曠野? 不然,其實會場『八芳園』距離地鐵站僅僅幾分鐘路程,雖藏身在市區之中,卻是一座擁有一萬坪面積的日本庭園,內部包含自然形成的丘陵、溪流和百年老樹構造出的靜謐氣氛:

過了上面這座石碑,LINE Developer Day 2018的主視覺立刻映入眼簾:

入園之後的小徑,真的會讓你以為來到了世外桃源,這像是個辦技術大會的地方嗎?
實在讓人驚豔:

為Developers在這種地方舉辦個年度技術盛宴,其實也是我一直很想做,卻始終無法實現的夢想,沒想到這次LINE在日本東京給實現了。把位於技術前線的科技宅們,聚集到這一個充滿日式古意的所在,這中間的對比,正如同這家融合了日韓文化和美式風格的企業一般,不時讓人有些難以捉摸…

但環境中的心曠神怡,也讓你對整個聚會充滿著期待,在會場的每一個小角落,不時會出現這個六道藍色d線條的燈籠,對映著『Line Developers』還挺有點意思。

我們來的早了,所以稍微小排了一下隊伍,當天東京戶外的溫度是13度,由於會場空曠處都有煤油燈,所以不會讓人感到太難受的寒意。我看除了台灣之外,大概只有日本人能夠比我們更愛排隊,且排的整整齊齊…

沒多久我們就進入到了會場,會場內的布置依舊是日式的溫暖路線,相較於台北TICC的中規中矩的風格,這邊更像一個溫暖的婚宴場館:

除了CTO將親自上台的keynote之外,整個活動共分有A, B, C, D四個HALL,以及CAFE區,如果你留意,會發現每一個場次的主講人可能來自不同國家,有日本、韓國、泰國…當然也有來自我們台灣的講師 Benny。

除了四個HALL的分場講者,也有CAFE區的Lightning Talks,會場中各處也有這樣的小桌子讓技術專家們可以隨處討論或分享…

除了室內豐富的聚會和分享,人都已經來到了好山好水的八芳園,怎能不體驗一下在小橋流水中寫code的脫俗滋味? 這時候戶外區的咖啡座就是最好的選擇,我得說,一邊寫code,一邊喝著熱咖啡,伴隨著鳥語及溪流聲,確實是一種享受。

你看兩位來自台灣的LAE大神多麼的認真…

(其實,這也是唯一能讓NB和手機充電的地方,所以…座位個個爆滿不在話下)

活動一開始,當然不可錯過LINE美女CTO的Keynote speech,你會發現,原來LINE今年幹了這麼多事情!? 由於不一定所有的成果都發表在台灣,所以你大概不知道在LINE上面除了可以購物、賣票之外,其實也能夠購買保險和旅遊:

別以為這些服務在台灣沒有發表似乎台灣不受重視? 錯了,整個keynote當中,在台灣實現的各種成果至少被提了五六次,印象所及,大概是凌駕所有國家之冠。例如,LINE與一卡通整合的LINE Pay,以及CTBC中國信託與LINE的合作…等。

當然,更少不了台北捷運的beacon典範,這還是會場LINE案例成果發表的展示看板中排名第一個的呢:

除了金融相關的應用,Keynote中,也提到了LINE在AI與區塊鏈上的一些發展。你知道LINE有一個名為Clova的語音智能助理嗎? 其中就大量地使用到了LINE自行開發的AI技術,包含Speech Recognition(語音辨識)與NLP(語意分析)的一些應用:

LINE也正積極的將Clova逐步擴充為可支援其他國家語言的智能助理,同時也在Chatbot Engine與OCR上有不少的著墨:

這些與AI相關的技術,除了被implement到LINE和Clova身上之外,也將會逐步開放給LINE Developers,讓開發人員能夠建構出各種在LINE與Clova周邊的各樣應用:

透過釋出雲端服務,讓開發人員能夠建立出所謂的dApp,來應用上述的AI服務,並且與LINE(即時通訊)和Clova(語音智能助理)整合:


最終為開發人員、合作夥伴、形成一個有價值的Ecosystem:

咦?   等,等等…

寫到這邊先暫停一下,LINE不是一個作IM(即時通訊)的公司嗎? 怎麼現在看起來愈來愈像一家軟體服務或雲端應用公司了?

過去,你可能以為LINE只有一個IM,但現在你發現了,LINE除了涉足了Fintech,也即將有自己的虛擬貨幣與交易所,同時間LINE也建構了雲端智能服務,以及可以做為終端用戶操作介面的語音助理Clova…這…

這些不都是過去軟體界大老(諸如Microsoft, AWS, Google…etc.)在幹的事情嗎?

然後別忘了,LINE早已有自己的OAuth身分驗證機制(Line Login),以及正慢慢成形的各種AI服務…這個態勢是準備要幹嘛呢???

如果你跟我一樣疑惑,那別錯過這篇遊記的下半部

接下來,我想要分享一下我們(LINE API Experts)與CTO和LINE RD的round table談了些什麼,以及剩下的旅程中所帶給我的其他驚喜…

2018年10月31日 星期三

使用Google登入做Web應用程式單一登入身分驗證(SSO)

你本以為今生不會再在.NET WebForm開發的旅途上用到Google Account做網站SSO的身分驗證,但時代的巨輪就是這麼幽默…

這一篇很快地談怎麼用C#做Google帳號的SSO(Single Sign On),依照我們前面曾介紹過關於OAuth與SSO的資訊,你應該已經知道用OAuth做網頁SSO需要兩個重要資訊,就是Client ID與Client Secret,在GCP平台上,你可以透過 https://console.cloud.google.com 這網站來建立一個應用程式(專案),建立後第一件事情就會引導你到底下畫面:

要我們選擇? 毫無懸念的我們選擇OAuth用戶端ID,接著會要求你先在OAuth同意畫面上做一些設定。

什麼叫做OAuth同意畫面? 就是那個你的網站要求人家用Google帳號登入時,跟人家要求權限存取他的資訊,請他按下『同意』的那個畫面,而該頁面中的相關資訊就是在底下設定的:

最主要的是設定應用程式名稱,這個畫面設定完之後,底下有幾個按鈕,按下儲存之後(順帶一提,Google要求你正式啟用前要申請驗證,否則只能測試),會跳出底下畫面:

我們的SSO是做給網站用的,上圖A的部分理當選Web應用程式,然後底下B和C你應該樣知道怎麼填,最主要的就是C的redirect_uri,請特別注意,即使是以lcoalhost進行測試的階段,你還是要正確地填寫這個redirect_uri,一般來說測試階段很可能是類似底下這樣localhost的url:

http://localhost:63577/SSOcallback.aspx

這個位置是指,你的用戶完成Google登入後,要導回你網站的哪一頁。完成之後按下建立,我們的目標是拿到底下兩組key:

前置作業完成無誤後,我們要撰寫一個登入頁面,也就是你的網頁要讓Google用戶登入的那個引導頁面,例如我們範例中是:

按下這個按鈕,網頁會被引導到Google做的登入畫面,我們有了剛才建立好的Client ID,要組一個這樣的redirect登入url不難,程式碼如下:

上面這段javascript,從14-22行就是組出將用戶轉向Google登入的url,然後redirect過去,其中19行的client_id,當然就是我們剛才在GCP平台上申請個半天的應用程式Client ID,而redirect_uri當然也非得與剛才我們在GCP後台設定的完全相同不可。

設定完成後,當上面這個頁面被執行後,你應該會發現,只要用戶點選了該按鈕,就被導引到Google登入畫面:

用戶在這個畫面上,可以選擇用已經登入過的Google帳號登入,或是用其他Google帳號,選擇好並完成Google登入與身分驗證之後,瀏覽器會被導回我們一開始在Google後台登記的http://localhost:63577/SSOcallback.aspx頁面,當執行到我們在該頁面早就寫好的程式碼(如後)之後,即可從QueryString取得code(19行),並且呼叫GetTokenFromCode()來換得token(第23行):

取得token之後,你就可以做任何事情了,像是拿token取得用戶的email或照片,底下Button1中的程式碼就是這樣做:

取得後的資料大概長底下這樣:

好啦,就這樣,知道OAuth的原理之後,其實一切都非常簡單。你的網站已經可以輕鬆的讓用戶以Google帳號登入了。

完整source code位於: https://github.com/isdaviddong/GoogleSSO 
注意:測試本範例你必須把default.aspx以及SSOcallback.aspx頁面中的所有ClientID與ClientSecret與redirecr_uri換成你自己申請的,否則將無法正確執行("Unauthorized")。

hope it helps.

--------------------------------------------------------------
如果需要詢問問題或即時取得更多相關訊息,可按這裡加入FB專頁。若這篇文章對您有所幫助,請幫我們分享出去,謝謝您的支持。

2018年10月18日 星期四

如何手動切換到Azure DevOps(VSTS)的新UI?

VSTS最近改名為Azure DevOps,其實對用戶的影響不大,原則上VSTS每季都在更新,所以有新功能不足為奇。

但在這段時間UI上卻大改了一番,這導致先前很多寫的blog和錄製的教學影片有需要調整,但調整非一朝一夕,所以還是得先讓大家知道一下切換新舊UI的方法。

如果你是舊版的UI,大概長得像底下這樣:

至於新版的UI,則是:

某些舊的專案,你進去之後可能還停留在舊版UI,其實你也可以手動切換成新版UI,接換的地方藏在右上角你的頭像底下:

其實,進去之後你會發現,一堆新舊功能的切換都放在這裡:

你可以選擇為整個組織或個人切換(上圖A),至於UI的切換則是在上圖B所標示的位置。如此一來,你就可以隨心所欲地為整個團隊或你個人切換喜歡的UI囉。

Related Posts Plugin for WordPress, Blogger...

熱門文章