學期2-3 自學經驗分享: URL-encoded
閱讀時間約 2 分鐘
狀況；緣起
在跟著教材執行To-do list清單裡面新增一筆待辦事項時，發現透過GET方法傳送表單的時候，其資料會直接顯示在網址列上，所以通常都會改用POST方法以保持資料的機密性。然而一開始當我們透過req.body這個物件來抓使用者傳送的資料前，教材有提到需要先經過bodyParser提供的方法處裡URL-encoded 格式的請求，但發現好像不懂什麼是URL-encoded。
尋找與嘗試
將URL-encoded相關關鍵字透過google後，瞭解其又稱為Percent-encoding，且專門用於透過HTTP請求來提供HTML表單的資料，最常見的情形大概是當我們有時輸入資料完成後按下送出，網址頁會將我們欲連結的網誌進行編碼，其編碼方式就是URL-encoded，這也是為什麼body-parser這個中介軟體時，明明可以解析像是JSON、XML、Raw等多種格式的資料，我們最後是選擇URL-encoded。此編碼的原理簡單說是先將欲轉碼的字元透過UTF-8轉換成byte stream，接著找到對應之16進位表示法，最後再將每個byte前面新增一個百分比符號做串接，這也是為什麼通常我們送出中文的表單資料後，常常會看到很多百分比符號的原因。
分享與展望
經過這個尋找方法原因相關搜尋，會發現一開始只是要找為什麼後端透過body-parser來解析資料事是選擇URL-encoded，但其實搜尋的過程中又發現了許多問題，像什麼是編碼，什麼是text/xml、什麼是UTF-8，一份網路資源可能又會衍生出多種自己未曾聽過的名詞，這時候聚焦好在當初為什麼產生在致個問題的原因就很重要，以此次的自學經驗，其實做重要的一句話就是URL-encoded為專門用來提交HTML表單的資料，不然都會有種花了一整個下午時間，整個專案卻沒有什麼進展的挫折感。 ，但其他較為陌生的名詞對我這種非本科生而言，當然還是需要另外花時間學習的。
參考資源
留言0
查看全部
你可能也想看
Google News 追蹤
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
「蛤！？到底什麼是編碼？網路上都查不到一個簡單的定義！」
剛進研究室的你，被教授指派了許多任務，其中一件是要把質性資料給「編碼」，你是不是也像我一樣霧煞煞QQ
快點進來看看，我幫你統整了一篇簡單易懂的說明，讓你快速了解編碼是什麼！！
※ Params是什麼？
在網頁開發中，params代表的是參數（Parameters）。當你在路由（Route）中定義了一個或多個變數時，這些變數的值就會被存儲在 params 對象中。所以，params 就是用來存儲路由參數的地方，這些參數可以在處理請求時使用。
※ Params的兩個功能：
本篇文章講解了字符編碼的基礎知識，包括ASCII, Unicode 和 UTF-8的誕生背景、解決的問題以及轉換方式。瞭解這些知識有助於解決在讀檔案時用錯誤的編碼方式轉換就會出現亂碼等問題。文章內容涉及電腦技術中的字符編碼相關歷史緣由，可幫助讀者解決相關疑問。
※ 什麼是 RESTful API？
這種運用 HTTP 來表達語義的路由設計風格稱為 RESTful API，它描述了如何實現 Web API 的架構。所謂的 API 是應用程式介面 (application programming interface)，網址也是一種應用程式的「介面」，故稱為
在API介接中使用x-www-form-urlencoded格式時，可能會遇到一些踩坑的情況，本文分享了作者在這方面遇到的問題和解決方法。
在開發前後端分離架構時，使用兩個不同網域所遇到跨域請求問題。特別是在POST請求時行為差異大，揭示了「簡單請求」與「預檢請求」的關鍵差異。簡單請求不需預檢，但application/json會觸發預檢請求，需透過特定設定解決。分享這篇文章希望幫助開發者有效處理跨域問題。
之前分享過【網路請求帶參數的方式】，開發者可以透過 URL 代入參數，來向伺服器請求特定的資源，我們當然也可以擷取 URL 的內容，來做為後續開發的判斷條件，這篇就來記錄一下，網址(URL) 和域名(Domain) 是什麼，以及如何取得網址的參數吧！
我們常說的網址連結 URL 完整名稱是 U
先前幾篇筆記介紹了網路請求，瀏覽器儲存資料的方式，那麼實務上，前端最常需要發送網路請求的時候，就是透過呼叫 API，去向後端工程師發送/請求資料，所以今天來記錄什麼是 API吧！
發送表單用get跟post看起來好像都無所謂，然而事實並非如此，使用GET的風險如下：
安全性問題
機密資訊為何不宜用GET，是因為由GET方法提交的表單會將欄位的key,value顯示於URL上，想像一下如果小明借用你的電腦，查看你的網頁歷史紀錄時就可以看到你的帳密了，多可怕！
再來就是如果
Accept：用戶端能夠接收的內容類型。
Accept: text/plain, text/html
Accept-Charset：瀏覽器可以接受的字元編碼集。
Accept-Charset: utf8
Accept-Encoding：指定瀏覽器可以支援的web伺服器返回內容壓縮編碼
嘿，大家新年快樂~ 新年大家都在做什麼呢？
跨年夜的我趕工製作某個外包設計案，在工作告一段落時趕上倒數。
然後和兩個小孩過了一個忙亂的元旦。在深夜時刻，看到朋友傳來的解籤網站，興致勃勃熬夜體驗了一下，覺得非常好玩，或許有人玩過了，但還是想寫上來分享紀錄一下~
「蛤！？到底什麼是編碼？網路上都查不到一個簡單的定義！」
剛進研究室的你，被教授指派了許多任務，其中一件是要把質性資料給「編碼」，你是不是也像我一樣霧煞煞QQ
快點進來看看，我幫你統整了一篇簡單易懂的說明，讓你快速了解編碼是什麼！！
※ Params是什麼？
在網頁開發中，params代表的是參數（Parameters）。當你在路由（Route）中定義了一個或多個變數時，這些變數的值就會被存儲在 params 對象中。所以，params 就是用來存儲路由參數的地方，這些參數可以在處理請求時使用。
※ Params的兩個功能：
本篇文章講解了字符編碼的基礎知識，包括ASCII, Unicode 和 UTF-8的誕生背景、解決的問題以及轉換方式。瞭解這些知識有助於解決在讀檔案時用錯誤的編碼方式轉換就會出現亂碼等問題。文章內容涉及電腦技術中的字符編碼相關歷史緣由，可幫助讀者解決相關疑問。
※ 什麼是 RESTful API？
這種運用 HTTP 來表達語義的路由設計風格稱為 RESTful API，它描述了如何實現 Web API 的架構。所謂的 API 是應用程式介面 (application programming interface)，網址也是一種應用程式的「介面」，故稱為
在API介接中使用x-www-form-urlencoded格式時，可能會遇到一些踩坑的情況，本文分享了作者在這方面遇到的問題和解決方法。
在開發前後端分離架構時，使用兩個不同網域所遇到跨域請求問題。特別是在POST請求時行為差異大，揭示了「簡單請求」與「預檢請求」的關鍵差異。簡單請求不需預檢，但application/json會觸發預檢請求，需透過特定設定解決。分享這篇文章希望幫助開發者有效處理跨域問題。
之前分享過【網路請求帶參數的方式】，開發者可以透過 URL 代入參數，來向伺服器請求特定的資源，我們當然也可以擷取 URL 的內容，來做為後續開發的判斷條件，這篇就來記錄一下，網址(URL) 和域名(Domain) 是什麼，以及如何取得網址的參數吧！
我們常說的網址連結 URL 完整名稱是 U
先前幾篇筆記介紹了網路請求，瀏覽器儲存資料的方式，那麼實務上，前端最常需要發送網路請求的時候，就是透過呼叫 API，去向後端工程師發送/請求資料，所以今天來記錄什麼是 API吧！
發送表單用get跟post看起來好像都無所謂，然而事實並非如此，使用GET的風險如下：
安全性問題
機密資訊為何不宜用GET，是因為由GET方法提交的表單會將欄位的key,value顯示於URL上，想像一下如果小明借用你的電腦，查看你的網頁歷史紀錄時就可以看到你的帳密了，多可怕！
再來就是如果
Accept：用戶端能夠接收的內容類型。
Accept: text/plain, text/html
Accept-Charset：瀏覽器可以接受的字元編碼集。
Accept-Charset: utf8
Accept-Encoding：指定瀏覽器可以支援的web伺服器返回內容壓縮編碼