Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
GCCP Creator @ COSCUP 2022
Search
LINE Developers Taiwan
PRO
July 30, 2022
Technology
0
6.5k
GCCP Creator @ COSCUP 2022
Event: COSCUP 2022
https://coscup.org/2022/zh-TW/session/P7HXPX
Speaker: Nijia Lin
LINE Developers Taiwan
PRO
July 30, 2022
Tweet
Share
More Decks by LINE Developers Taiwan
See All by LINE Developers Taiwan
Live Activities in LINE
line_developers_tw
PRO
0
9
Neumorphism x Liquid Glass
line_developers_tw
PRO
0
10
猜你喜歡 – 打造高度擴展的個人化電商推薦
line_developers_tw
PRO
0
22
打造新電商搜尋體驗- 搜尋意圖辨識
line_developers_tw
PRO
0
7
比價群組
line_developers_tw
PRO
0
11
從混亂到優雅,讓專案不再失控:ATDD 與 Clean Architecture 的後端實戰之路
line_developers_tw
PRO
0
10
2049智能共存:透過LINE Bot Agent迎接後人類時代
line_developers_tw
PRO
0
39
菸酒生在 LINE Taiwan 的後端雙刀流
line_developers_tw
PRO
0
1.4k
讓測試不再 BB! 從 BDD 到 CI/CD, 不靠人力也能 MVP
line_developers_tw
PRO
0
1.5k
Other Decks in Technology
See All in Technology
LLMを搭載したプロダクトの品質保証の模索と学び
qa
0
1k
ガチな登山用デバイスからこんにちは
halka
1
240
品質視点から考える組織デザイン/Organizational Design from Quality
mii3king
0
200
2025年になってもまだMySQLが好き
yoku0825
8
4.7k
roppongirb_20250911
igaiga
1
220
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.7k
Platform開発が先行する Platform Engineeringの違和感
kintotechdev
4
570
人工衛星のファームウェアをRustで書く理由
koba789
15
7.9k
開発者を支える Internal Developer Portal のイマとコレカラ / To-day and To-morrow of Internal Developer Portals: Supporting Developers
aoto
PRO
1
460
初めてAWSを使うときのセキュリティ覚書〜初心者支部編〜
cmusudakeisuke
1
250
TS-S205_昨年対比2倍以上の機能追加を実現するデータ基盤プロジェクトでのAI活用について
kaz3284
1
130
なぜスクラムはこうなったのか?歴史が教えてくれたこと/Shall we explore the roots of Scrum
sanogemaru
5
1.6k
Featured
See All Featured
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
61k
Producing Creativity
orderedlist
PRO
347
40k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.9k
Docker and Python
trallard
45
3.6k
Side Projects
sachag
455
43k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
810
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
Balancing Empowerment & Direction
lara
3
620
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Transcript
GCCP Creator LINE Developer Rela/ons NiJia Lin
🥷 NiJia Lin LINE Technology Evangelist COSCUP 2020、2021 講者 LINE
Bot SDK Python 共同維護者 😻貓派、🐶柴⽝派
LINE Technology Evangelist COSCUP 2020、2021 講者 LINE Bot SDK Python
共同維護者 😻貓派、🐶柴⽝派(⽝在哪?) 蟒蛇派 🐍 🥷 NiJia Lin
Cloud Storage Speech To Text IAM & Role Youtube &
Video.js 今⽇ GCCP Creator 圍繞… Cloud Run 凡事總有 個原因 https://github.com/louis70109/GCCP-Creator
🎥 減少獨⾃製作影片的 effort 🎯 增加被平台看⾒的機會 🀄 想紅 https://github.com/louis70109/GCCP-Creator 你好好解釋 -
凡事總要個原因
GCCP 能怎麼增進效率 https://github.com/louis70109/GCCP-Creator
爲什麼⽤ CC 字幕?
使⽤ CC 字幕的原因 優點篇 • 不必等字幕做完才出影片 • 上字幕難免出錯,修改快速 • 自適應(不受解析度影響)
• 提高影片曝光率(Youtube 識別) • Youtube 編輯器夠用 • 額外優惠 • 幫助聽障人士 • 電腦版有自動翻譯 • 有機會讓粉絲幫忙共編 https://github.com/louis70109/GCCP-Creator
使⽤ CC 字幕的原因 缺點篇 • 預設是關閉,需要訓練用戶 • 中文觀眾習慣看內字幕 • 字卡特效較少(不夠吸睛)
https://github.com/louis70109/GCCP-Creator
能怎麼設定 GCCP 呢?
我在講它要聽! ✍ 開啟 SpeechToText
Speech to text
Speech to text 不⽤在 UI 上建立
Speech to text ⽤ API 來操作就好👍
總會需要個玻璃櫃 🦖 建立 Cloud Storage
建立 Google Cloud Storage (a.k.a GCS)
建立 Google Cloud Storage (a.k.a GCS)
⽽且要有鎖頭 🔐 來點 IAM & Role
IAM
IAM
鑰匙不能被發現 – 把 JSON Key 送進環境變數 安全 🆙 部署 🆙
⾦⿂腦 ⬇ • 建立一個暫時檔 • 路徑放環境變數中 • 寫入 GOOGLE_APPLICATION_CREDE NTIALS • ⚠需要框架啟動前
鑰匙不能被發現 – 把 JSON Key 送進環境變數 安全 🆙 部署 🆙
⾦⿂腦 ⬇ • 建立一個暫時檔 • 路徑放環境變數中 • 寫入 GOOGLE_APPLICATION_CREDE NTIALS • ⚠需要框架啟動前
安全 🆙 部署 🆙 ⾦⿂腦 ⬇ • 建立一個暫時檔 • 路徑放環境變數中
• 寫入 GOOGLE_APPLICATION_CREDE NTIALS • ⚠需要框架啟動前 • ⚠需整理成 JSON 樣式 • 單引號 -> 雙引號 鑰匙不能被發現 – 把 JSON Key 送進環境變數
安全 🆙 部署 🆙 ⾦⿂腦 ⬇ • 建立一個暫時檔 • 路徑放環境變數中
• 寫入 GOOGLE_APPLICATION_CREDE NTIALS • ⚠需要框架啟動前 • ⚠需整理成 JSON 樣式 • 單引號 -> 雙引號 鑰匙不能被發現 – 把 JSON Key 送進環境變數
萬事皆上雲 ⛅ 如何部署到 GCP
None
就這樣?🤨
對,就這樣 🤗
• Docker 免、DockerHub 免,只要⼀個 Dockerfile • 省硬碟空間 (但需要神奇⼩卡) • 省去開發初期⿇煩的事情
使⽤ gcloud 好處
做什麼才會觸發 (導火線) 在 CloudRun 設定 Eventarc
Speech to text
設定觸發條件
設定觸發條件
上傳檔案測試
⾃動產⽣ SRT
到 CloudRun 設定 Eventarc
不想住這邊,我要搬走! 使⽤ video.js 的 hints
影片(mp4) ⼈⼈好,別把我送⼈就好 • ⼿動上傳檔會有 CORS • 只要開啟 public 即可 •
誰都不准擋我!
CORS 你聽我解釋 – CC 字幕篇 • ⽤個 API Server 轉成純⽂字給前端
• (Optional) 放在 localStorage 上⾯
CORS 那我要去愛別⼈ – API 我還你原形 • ⽤個 API Server 轉成純⽂字給前端
• (Optional) 放在 localStorage 上⾯ • 因為有 \n,⽤ eval() + Blob 組合把它變成⼀串網址回給 video.js
• 因 GCS 的 CORS 的設定⽬前在 GCP 網⾴介⾯上沒辦法改, ⼀定要⽤ CLI
設定 既然你不聽那我來硬的 – CLI 降⾁!
• 因 GCS 的 CORS 的設定⽬前在 GCP 網⾴介⾯上沒辦法改, ⼀定要⽤ CLI
設定 既然你不聽那我來硬的 – CLI 降⾁!
• 因為 CORS 的設定在 GCP 網⾴介⾯上沒辦法改,⼀定要 ⽤ CLI 設定 •
泡個茶上個廁所,時間到了 Cache 就不在了 • 開啟 DevTools 清除快取(Cache) 過去即是永恆 – 快取放我走!
• 必須要⽤ WebVTT 格式 • Video.js 會⾃動的轉成 big5 • 有時間序的
SRT 字幕檔第⼀⾏ ➕ WEBVTT\n\n(兩個換⾏) 不都在講同⼀件事?Video.js 需要 VTT
那字幕編輯在哪?
別⼈的比較好🚬 (⼩吉) Youtube UI 很夠⽤
管理⼤師⏰的⼤家 能帶走點什麼?
✍揮揮衣袖,不帶走⼀片雲彩 • STT 時間⽀援最低到 nano,但在 Youtube 字幕上也算很精準 • STT 測試起來以⼀分鐘為分⽔嶺,太短的影片可能不適⽤
• 減少初期敲字幕稿的時間(30~40%),只需後續細修、對時間 • 編輯器⽤別⼈的就好,別想⾃⼰寫 (還我三個禮拜!) • 若有 Python、FastAPI 部署相關經驗歡迎等等找我聊🤝 • Video.js ⽢苦談也⼀起來! https://github.com/louis70109/GCCP-Creator
None
None