# Chrome headless 研究筆記 最近要用到 chrome headless 的部分功能
且得在 ubuntu or debian server 實踐
所以筆記一下
## Intro headless 大致分兩種用法
CLI
libary
Refer - Getting Started with Headless Chrome
CLI 用法簡單但是受限很多且沒有找到具體詳細完整的文件, 就連用 man 查都查不到…
也有可能是我自己沒有認真找
libary 就相對容易, 連 Google 自己都有提供部分語言的版本, 且有前端工程師很熟的 Node 版本
## on ubuntu server sudo apt-get install chromium-browser ex:
chromium-browser --headless --screenshot=test.png --disable-gpu --window-size=320,480 --user-agent="Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 like Mac OS X) AppleWebKit/537.51.2 (KHTML, like Gecko) Version/7.
...
## 2018 Google cloud 訓練營 筆記 Become a Google Cloud Platform expert with hands-on training. GCP Essentials
# Gcloud cli ## PROJECT_ID: gcloud auth list
gcloud config list project ## BASIC gcloud -h
gcloud config --help || gcloud help config
gcloud config list --all # Managing Cloud Storage data Try creating a Cloud Storage bucket. Bucket names must be unique, so replace unique-name with something else, or append the name to make it unique.
...
# JavaScript - 計算網頁元件的曝光 因為某些需求需要精確計算某些網頁上的 UI 元件的曝光
沒錯
就是要像廣告計算 impression 一樣
之前只要確認有該元件的 request 就好了
但是為了精確追求計算曝光, 所以必須做到像 Google Ad 一樣
要到該網頁元件讓使用者看到後才能計算曝光
聽起來這要求不太容易
但是實作下去其實發現還好誒!!
## 概念 DOM 元件進入可視範圍觸發 impression
所以需要能夠釐清一些問題
如何確認可視範圍?
如何確認要記錄 impression 的 DOM 元件在可視範圍?
如何在進入可視範圍時觸發?
看似困難
但是如果熟悉 JavaScript Window 物件和 DOM 物件的話就會發現很好解
## 實作 ### 如何確認可視範圍? window.document.documentElement.clientHeight window.document.documentElement.clientWidth 完美解決
### 如何確認要記錄 impression 的 DOM 元件在可視範圍? <DOM Object>.getBoundingClientRect(); 完美解決
但是要取到對應可是範圍的位置建議使用(top, left), x y IE 和 Edge 不支援
還有一點要注意就是該 DOM 要先長在 browser 上面且不是 display: none 的狀態才能拿到值
...
# Mac - Get file user name & user id ## Get file owner name stat -f '%Su' <file or folder name> ## Get user id ### show user id // or id <user name> ### get uid id -u
// or
id -u <user name> ## get file owner uid stat -f ‘%Su’ <file or folder name> | xargs id -u
stat -f '%u' <file or folder name> Refer - 将Linux命令的结果作为下一个命令的参数
...
# LINE - 2018 1111 分享得 LINE point 研究筆記與分析報告 MGM(member get member) 的模式一直以來都會是一個有規則可循且有時難度也不高的活動模式(因為難度高就不好擴散
這次以 LINE 2018 年 1111 分享連結的 LINE point 為例子當作我們這次的研究對象
大致規則
分享該訊息給朋友
會是如下圖所示
活動辦法引言
活動辦法： ● 好友點選您分享的連結進入LINE購物首頁，若成功您將會收到『LINE購物官方帳號』通知抽獎囉。分享者需透過活動頁分享網址，邀請朋友點入LINE購物並完成登入，才能獲得點數。 ● 轉發他人的分享網址，點數將會計算給原分享者。 ● 請先加入『LINE購物官方帳號』好友以及解除封鎖可獲得參與活動資格與收到LINE 購物抽獎/得獎通知。 ● 分享給同一名好友，最高可獲得1次抽獎機會，若要再獲得抽獎機會請分享給其他好友。 ● 各平台折扣碼「LINE11」，使用期間：2018/11/10 - 2018/11/11折抵金額與使用方式請見各平台規範。活動詳請請見：https://lin.ee/5JVllUj/rcf ● 此分享活動時間為2018/11/5 11:00至2018/11/9 23:59(台灣時間)。收到抽獎券之用戶，須於2018/11/12 23:59(台灣時間)前點擊抽獎網址，逾期未完成抽獎者視同放棄並自動取消資格。 ● 本次活動限LINE帳號已綁定台灣手機門號用戶參加
那上述規則就令人產生一些聯想
那大家互相分享再去點開連結就可以得到點數了呢!
## 研究 本持著攻城獅的研究精神
就發現有人分享了一份 Google 表單
上面記錄了許多人填出來的分享 URL(當然也有來亂的XD)
那麼接下來就可以開始一件事, 那就是點連結拉
但是在 Line 開這表單再點連結好累喔
那這時候又有個思路就是可以讓這過程自動化阿
但是要在模擬器上登入 LINE 很麻煩(因為 LINE 只能同時登入一台手機)
那換個思路
...
# Mac - shell script check OS Use shell script check Linux or Mac
#!/usr/bin/env bash if [ `uname` == 'Linux' ]; then echo 'Linux' else echo 'Mac' fi
...
# Mac - stat get owner name stat -f ‘%Su’
...
# Mac - Use readlink in Mac OS X install coreutils brew install coreutils test greadlink greadlink -f <file name> alias command line alias readlink=greadlink refer - How can I get the behavior of GNU’s readlink -f on a Mac?;
...
登入 Payapl account
接下來如下圖步驟即可
這樣就有
API 用戶名稱 API 密碼 API 電子簽章
這樣即可使用在一些第三方串接 Paypal 的服務了
Refer - How to get PayPal API username, password and signature information?
...
# JavaScript - 使用與處理正確的時間 這是個很有趣的議題
舉凡使用倒數計時器或限時開賣等
只要在網頁上牽扯到時間的動態呈現都需要處理這問題
會列舉了幾個情況與介紹一些跟時間相關的的概念與 API
Refer - 深入理解定时器系列第一篇——理解setTimeout和setInterval
var options = { timeZone: 'Europe/London', year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric', second: 'numeric', }; formatter = new Intl.DateTimeFormat([], options); formatter.format(new Date()); Refer - Get time of specific timezone [duplicate] Refer - Getting To Know The JavaScript Internationalization API
Refer - Javascript 的 EventLoop
...