Open debbygigigi opened 5 years ago
lv8 的 token 倒著看就會發現梗了 XD
話說後面新增了幾關,要不要繼續挑戰XD
@aszx87410 沒問題😂等我更新!
https://lidemy-http-challenge.herokuapp.com/lv11?token={IhateCORS}
嘿!很開心看到你願意回來繼續幫忙,這次我們接到一個新的任務,要跟在菲律賓的一個中文圖書館資訊系統做串連
這邊是他們的 API 文件,你之後一定會用到:https://gist.github.com/aszx87410/0b0d3cabf32c4e44084fadf5180d0cf4。
現在就讓我們先跟他們打個招呼吧,只是我記得他們的 API 好像會限制一些東西就是了...
先開啟API文件的網址
https://gist.github.com/aszx87410/0b0d3cabf32c4e44084fadf5180d0cf4
跟菲律賓圖書館打個招呼
然後會得到這樣的錯誤
您的 origin 不被允許存取此資源,請確認您是從 lidemy.com 送出 request。
解法 這邊有偷看一下Huli大大彩蛋的提示, 故嘗試在Postman Headers上key:Origin、value:lidemy.com (補充: 這邊我理解的是server僅是需要知道client的Origin,故需要提供此資訊; 故使用Access-Control-Request-Headers這個header一樣是解不開的喔~)
Hello! 下一關的 token 為 {r3d1r3c7}
https://lidemy-http-challenge.herokuapp.com/lv12?token={r3d1r3c7}
打完招呼之後我們要開始送一些書過去了,不過其實運送沒有你想像中的簡單,不是單純的 A 到 B 而已
而是像轉機那樣,A 到 C,C 才到 B,中間會經過一些轉運點才會到達目的地...算了,我跟你說那麼多幹嘛
現在請你幫我把運送要用的 token 給拿回來吧,要有這個 token 我們才能繼續往下一步走
前往取得Token
https://lidemy-http-challenge.herokuapp.com/api/v3/deliver_token?token={r3d1r3c7}
我已經把運送要用的 token 給你囉,請你仔細找找
執行完,網頁網址有變動 >> https://lidemy-http-challenge.herokuapp.com/api/v3/deliver_token_result 可能你會覺得怎麼什麼東西都沒有!? 別緊張,對著剛剛的網址按下F12 (Chrome DevTools),先暫時擱置一旁
再次將剛剛帶有token的網址再貼一次(F12開起來的網頁別關掉)
https://lidemy-http-challenge.herokuapp.com/api/v3/deliver_token?token={r3d1r3c7}
回到Chrome DevTools的網頁(進入到Network選項裡,會看到如下的樣子)
對著第一筆資訊點擊兩下
Bingo
(補充: 找到MDN這篇後,有了一點解題的靈感) (reference-Redirections in HTTP)
https://lidemy-http-challenge.herokuapp.com/lv13?token={qspyz}
太好了!自從你上次把運送用的 token 拿回來以後,我們就密切地與菲律賓在交換書籍
可是最近碰到了一些小問題,不知道為什麼有時候會傳送失敗
我跟他們反映過後,他們叫我們自己去拿 log 來看,你可以幫我去看看嗎?
從系統日誌裡面應該可以找到一些端倪
取得log
此 request 不是來自菲律賓,禁止存取系統資訊。
看一下hint XD
https://lidemy-http-challenge.herokuapp.com/lv13?token={qspyz}&hint=1
你有聽過代理伺服器 proxy 嗎?
有兩個重點,request來自菲律賓就可以取得log內容,要利用Proxy進行連線
找尋來自菲律賓的Proxy IP:116.50.163.67 Port:80
設定Proxy,開啟Google 設定的頁面 開啟proxy
重新整理Chrome頁面,得到Level14的token了
[
{ logType: 'token', value: '{SEOisHard}' }
]
(補充:Huli大大的彩蛋也有補充其他解法)
https://lidemy-http-challenge.herokuapp.com/lv14?token={SEOisHard}
跟那邊的溝通差不多都搞定了,真是太謝謝你了,關於這方面沒什麼問題了!
不過我老大昨天給了我一個任務,他希望我去研究那邊的首頁內容到底是怎麼做的
為什麼用 Google 一搜尋關鍵字就可以排在第一頁,真是太不合理了
他們的網站明明就什麼都沒有,怎麼會排在那麼前面?
難道說他們偷偷動了一些手腳?讓 Google 搜尋引擎看到的內容跟我們看到的不一樣?
算了,還是不要瞎猜好了,你幫我們研究一下吧!
獲取首頁內容
一樣的內容,以HTML表達(F12進行查看)
<html>
<h1>Library</h1>
<p>Hello, here is the website for lidemy library</p>
</html>
還是想不出要如何做,看一下hint
https://lidemy-http-challenge.herokuapp.com/lv14?token={SEOisHard}&hint=1
伺服器是怎麼辨識是不是 Google 搜尋引擎的?仔細想想之前我們怎麼偽裝自己是 IE6 的
於是,google關鍵字搜尋一下 Google 搜尋引擎 with web server 看起來跟SEO有關係呢~ >> user agent SEO request postman >> User-Agent: Googlebot
Bingo! (借助Postman)
<html>
<h1>I Love Google</h1>
<p>Google please rank our website higher, PLEASE!</p>
<!-- token for lv15:{ILOVELIdemy!!!} -->
</html>
得到Level15的token了!
(補充:將上面成功取得資料的那段HTML以瀏覽器開啟後,並不會在頁面上顯示,需要F12開啟查看) 查看
https://lidemy-http-challenge.herokuapp.com/lv15?token={ILOVELIdemy!!!}
恭喜囉,再留給想自己最後破關的人去看看最後的地方吧~
小小結語 受惠於 @jijigo 大大的詳解, 想說第10關後也來貢獻一己之力,讓這篇詳解有更完整的解答 謝謝 Huli大大 提供的教學
破關完想起電影一級玩家,好玩~
(若有步驟、流程錯誤或是其他問題,歡迎告知,我將進行修正)
由 @Huli 大大開發的小遊戲,因為覺得概念實在太有趣了,就來玩玩看並做個簡單的紀錄。
主要會練習到
GET
POST
DELETE
PATCH
這四種常見的方法,還有query string
的運用,以及Authoration
驗證。除了 GET 方法會直接在網頁的 URL 輸入之外,其他的方法我會透過 Postman 來幫忙。
那麼就開始吧!遊戲網址
Lv0:熱身
給第一次進來的朋友的遊戲解說。
Lv1:GET
直接在 query string 上加上
name={你的名字}
Lv2:還是 GET
一樣是 GET,只要在 query string 加上 id,後面的數字就是 54~58 選一個,試到對為止。
如果不對的話,會回應
好像不是這本書耶...
,最後試出來是 56。Lv3:POST
POST 的部分就請 Postman 來幫忙,參考一下 圖書館資訊系統 API 文件。
POST 的 url 是這樣:https://lidemy-http-challenge.herokuapp.com/books Body 的格式選擇 x-www-form-urlencoded ,再把 token name ISBN 填入,按下 send
把 id 用 queryString 帶入
Lv4:GET 的 query 練習
這是
GET
方法。其中提到書名有「世界」兩字,根據 API 文件,使用參數
q
來查詢。 而雖然題目有提到作者是要「村上春樹」,但 API 並沒有提供篩選作者的方法,所以只能靠肉眼找出 id(試過?q=世界&author=村上春樹
,結果相同)找到 id 為 79
Lv5:delete 練習
這次使用 DELETE 方法,
Lv6:Authorization 驗證
這次多了一個新版的 API文件
如果我直接 GET
https://lidemy-http-challenge.herokuapp.com/v2/me
,會給我一個Invalid Authorization token
的錯誤在 Postman 上,Authorization 選擇 Basic Auth,username 和 password 就填上題目寫的帳號跟密碼
將 email 放在 queryString
Lv7:Authorization 版的 DELETE
一樣是 DELETE 方法,不同的是,這次要加上剛剛的 Authorization
Lv8:PATCH 更新
首先,先找到那本書,使用 GET
根據題目描述,作者的名字是四個字、ISBN 最後一碼為 7 的應該是這本:
接著使用
PATCH
,因為更新也要傳遞資料,所以方法類似於 POST 會需要帶資料,而要帶的資料就是想要更新的資料,例如這個題目就是將 ISBN 參數帶上欲更改的Lv9:特殊的 Header
我們先試試看用一般的方法會怎樣,很單純的使用 GET 與 Authorization:
會得到
Invalid Library Number
這樣的錯誤。根據題目,我們在 header 加上
X-Library-Number
和user-agent
得到 version 了!
Lv10:最終關-猜數字
居然是幾A幾B當結尾!那這就不破梗了,讓觀眾自己猜。 不過還是要放張過關圖🎉