在 idekCTF 2024 中，由 icesfont 所出的一道題目 srcdoc-memos 十分有趣，牽涉到了許多 iframe 的相關知識。我沒有實際參加比賽，但賽後看了題目以及解法，還是花了好幾天才終於看懂為什麼，十分值得把過程以及解法記錄下來。
由於這題牽涉到不少與 iframe 相關的知識，我會盡量一步一步來，會比較好理解。
在 idekCTF 2024 中，由 icesfont 所出的一道題目 srcdoc-memos 十分有趣，牽涉到了許多 iframe 的相關知識。我沒有實際參加比賽，但賽後看了題目以及解法，還是花了好幾天才終於看懂為什麼，十分值得把過程以及解法記錄下來。
由於這題牽涉到不少與 iframe 相關的知識，我會盡量一步一步來，會比較好理解。
這半年左右因為有其他事情在忙，有段時間沒有好好打一場 CTF 了，這次為了 GoogleCTF 2024 騰出時間，跟隊友一起把所有 web 都解掉了。
然後題目依舊很有趣，這次有三題有參與到，另外兩題比較簡單的隊友都先解掉了，沒機會看，但還是會稍微做個紀錄。難得有這種幾乎都是 client-side challenge 的 CTF，我是滿喜歡的。
關鍵字：
Polyfill.io 是一個能夠自動提供前端 polyfill 的服務，使用方法相當方便，只需要選擇想被 polyfill 的功能，再引入一個 JavaScript 檔案即可：
<script src="https://polyfill.io/v3/polyfill.min.js"></script>Server 端會自動根據 user-agent 來判斷是不是需要回傳 polyfill，所以只會引入真的需要的程式碼，聽起來方便又好用。
但這幾天應該有人收到 Google Ads 的通知，說這有 security issue，這又是爲什麼呢？
以前當我想要部署一個簡單的服務時，我會去 Heroku 上面，因為簡單而且免費，雖然說還是有些使用限制，但整體而言還是很方便的，甚至還有一些簡單的 DB 可以用。如果是靜態網頁，會選擇 Netlify 或是 GitHub Pages，也都是簡單方便的選擇。
但 Heroku 從 2022 年年底之後就不再提供免費方案了，因此那時一堆人在尋找替代方案，包括 Render 或是 fly[dot]io 等等，都是很多人跳槽的新選擇。而我自己以前其實在 Heroku 上也有三四個專案，從 Heroku 改變方案之後就再也沒也動過了。
前陣子收到 Zeabur 創辦人的來信，希望有機會能跟我合作推廣這個平台，我自己試了之後發現體驗確實很不錯，因此就寫了這篇文章介紹一下。
如果有看過我的部落格的話，應該會知道我一直都是寫 React，完全沒有碰過 Vue，也沒有碰過 Angular。自從 2015 年接觸到 React 後，工作上就一直是用 React 了。
然而，最近因為工作上的需求，所以開始寫 Vue 了，而剛好也有讀者來問我從 React 跳到 Vue 的心得，因此這邊就簡單寫一篇來分享。
上個月（2024 年 1 月）的 Intigriti 挑戰非常有趣，出題者是 @kevin_mizu，之前也常在推特上看到他出一些 client-side 相關的題目，而這次的題目品質也一如既往的很好，值得寫一篇紀錄。
題目的連結在這邊，沒有看過的話可以先去看看：https://challenge-0124.intigriti.io/
相比於去年跟前年，今年的 web 題難度有顯著降低了不少，變得更平易近人了，靠著隊友的努力拿下了第一名，而 web 題也只剩一題沒解出來。
這次我基本上只解了簡單的 funnylogin 跟難的 safestlist，其他都是隊友解開的，還有另一題 another-csp 有看了一下，因此這篇只會記我有看過的以及比較難的題目。
如果想看其他題，可以參考其他人的 writeup：
官方提供的所有題目原始碼：https://github.com/dicegang/dicectf-quals-2024-challenges
關鍵字列表：
今年的 0CTF 一共有三道 web 題，其中一道題目是 client-side 的，我就只解這題而已，順利拿到 first blood，這篇簡單記錄一下心得。
關鍵字列表：
因為最近有點忙的關係，這兩三個月比較少打 CTF 了，但還是會在推特上看到一些有趣的題目。雖然沒時間打，但筆記還是要記的，沒記的話下次看到鐵定還是做不出來。
這篇主要記一些網頁前端相關的題目，由於自己可能沒有實際下去解題，所以內容都是參考別人的筆記之後再記錄一些心得。
關鍵字列表：
你知道嗎，當你跟朋友在討論 SSR 的時候，很有可能你們對 SSR 的認知其實是不一樣的。直接舉個例子，底下這幾種情境，你覺得哪些算是 SSR？
renderToString 把 React 渲染成字串，但是沒有資料，資料會在前端拿renderToString 輸出 HTML，在 client 端時會做 hydration 讓頁面可以互動有一種人認為只要是由後端產生出畫面，就叫做 SSR，所以 1 ~ 5 全部都是 SSR。也有一種人認為前端必須先是 SPA，此時搭配的後端才能叫做 SSR，所以 2~5 都是 SSR；而另一種人則認為 SSR 的重點是 hydration，所以只有 5（或是 45）是 SSR。