yformater - chrome谷歌瀏覽器json格式化json高亮json解析插件

     yformater是一款chrome瀏覽器插件，用來格式化(高亮)服務端接口返回的json數據。

     實際上小菜並非第一個寫這種插件的，可是現有的chrome json格式化插件實在是不太好用，索性小菜本身寫一個，本身用的同時，分享給你們。

     先說說爲何須要yformater，若是直接使用chrome瀏覽器訪問api，咱們看到的數據是這樣的：

 

     這樣的數據通常人分析不了，因而大多數讀者會把它複製粘貼到某某在線json格式化工具上，而後才能繼續分析。

     而有了yformater以後，是這樣的：

 

 

     徹底不須要讀者去作任何繁瑣的操做，一鍵格式化json數據。

     廢話很少說，接下來直接概述yformater究竟有多麼強大。

 

最基本的json格式化

 

 

 

 

可摺疊的json格式化

 

 

 

從剪貼板格式化(NEW 2016年1月4日 v1.1)

 

 

     此功能看似簡單，但實際意義重大。

     傳統意義上的json格式化插件，侷限於格式化已有的數據，通常狀況下只能格式化接口返回的json字符串，但假如讀者的json字符串不在瀏覽器中，它在某個文本文件中，或者在某個文章裏，這時候傳統瀏覽器插件就無能爲力了，讀者只能本身打開某某編輯器進行格式化，或者使用某某在線工具格式化。

     yformater獨具匠心，以剪貼板爲紐帶，提供一個瀏覽器插件與外界交互的通道，即簡單，又實用。

     所以，讀者能夠從任意位置複製一段json字符串，而後打開谷歌瀏覽器，新建一個標籤頁(實際上任意頁面都可)，而後[右鍵]--->[從剪貼板格式化json]，yformater將呈現給讀者優雅的json格式。

 

字符串智能選中

 

 

 

 

     單擊字符串，自動選中整個字符串，一鍵選中，擺脫手動拖放選中。

 

 

快速訪問相對連接

 

 

 

     直接選中相對鏈接，右鍵訪問，快捷訪問相對資源，不再用手動構造拼接相對連接。

 

     2017年1月4日補充：

 

     鑑於不少不明真相的讀者不太理解yformater右鍵菜單中[訪問選中鏈接]的威力，此刻筆者專門作個示範。

     首先須要明確，這個右鍵菜單項，必須在選中頁面任意內容後，纔會出現。

     筆者在某社區瀏覽互動內容，忽然發現一個感興趣的連接，可是這個連接並不完整，很明顯這是一個相對連接，並且是相對於當前頁面路徑的連接。

 

     此時，chrome自帶的[訪問選中鏈接]徹底廢掉了，變成了[使用Google搜索…]，由於chrome只能識別完整的連接，這樣的相對連接，是沒法處理的。

     可是yformater就不怕了，yformater會嘗試訪問你選中的一切，甚至它根本不是連接。

     對於yformater而言，若是是完整連接，理所固然會訪問完整連接；若是是相對連接，會根據相對連接的規則自動轉換成完整連接；若是選中的不是連接，可能香蕉也不知道它會跳轉到哪裏。

     綜上所述，在本例中，點擊[訪問選中鏈接]，將會跳轉到：[http://www.???.net/uploads/space/2017/0104/170828_rPsL_1456141.gif]，讀者將看到美妙的畫面(馬賽克是筆者加的)。

     假如讀者沒有安裝並使用yformater，極可能就無緣相見了。

     沒錯，就是這麼神奇！

 

複製帶格式的json字符串

 

 

 

     快捷複製格式化以後的json字符串到剪切板，粘貼到其餘編輯器中，自動帶有縮進。

 

配對括號匹配

 

 

 

     點擊括號，智能匹配其配對括號，將其高亮顯示，便於分析json。

 

多種配色方案

 

 

 

 

 

 

     衆口難調，小菜特准備四種配色方案，任您選擇。

 

鎖定功能(NEW 2016年3月30日 v1.2)

 

 

 

     yformater的初衷是簡單的，但對於頻繁調試接口的場景，每次數據刷新都用右鍵去格式化，實在是浪費生命，所以yformater新增了鎖定功能。

     鎖定功能意圖很是明確：

          ·鎖定當前域。yformater自動格式化當前域名下全部的頁面，至關於模糊匹配，若是開啓了此選項，yformater的應用圖標下會出現一個? 。

          ·鎖定當前路徑。yformater自動格式化當前頁面返回的json數據，至關於精確匹配，若是開啓了此選項，yformater的應用圖標下會出現一個=。

          ·解除鎖定。解除當前域或當前路徑的鎖定，yformater很聰明，它會自動識別，自動解鎖。

     須要注意的是，鎖定當前域、鎖定當前路徑兩者是互相排斥的，只能選其一，啓用任意一個，另外一個自動解除。

 

層級摺疊功能(NEW 2016年4月22日 v1.3)

 

 

     yformater歷來不想替代任何已有的chrome json格式化插件，惟一的原則就是節省開發者時間，爲了更加便捷的分析數據，這一版引入層級摺疊。

          ·展開。展開全部層級。

          ·摺疊。摺疊全部層級。

          ·上級。將摺疊層級設置爲當前層級的上一級。

          ·下級。將摺疊層級設置爲當前層級的下一級。

          ·1~6級。展開到對應的層級。

     在此版本中，再也不有右鍵菜單上的摺疊選項(全部格式化默認都是不可摺疊的)，取而代之的是格式化完成後頁面右下角的[摺疊]按鈕，點擊此按鈕，會彈出摺疊工具欄，同時開啓摺疊功能。

 

字號調整 (NEW 2016年6月6日 v1.5)

 

此項配置無需多言，衆口難調，怎麼舒服怎麼來，多大看着舒服，就調成多大。 

 

自動識別JSONP格式化 (NEW 2016年6月6日 v1.5)

 

     在複雜的開發週期中，並非全部數據都爲理想的json格式，對於跨域的場景而言，jsonp格式也是一種常見的服務端返回數據格式。

     所謂jsonp，本質上就是json格式數據，只不過它必須經過動態插入腳本的方式調用，沒法直接獲取。

     傳統的"在線JSON校驗格式化工具"對此是無能爲力的，只能遺憾的提示格式錯誤，而yformater敏銳的察覺到了這個問題，因而增長對如下兩種形式的jsonp解析：

          ·函數調用形式。舉例：_Callback({"key": "value"})

          ·變量賦值形式。舉例：var json_callback = {"key": "value"};

     以上兩種jsonp數據，對於yformater而言，和正常的json格式沒什麼區別，都可順利完成格式化操做。

 

關於錯誤提示(NEW 2016年4月22日 v1.3)

 

 

     yformater在任什麼時候候，都不肯打擾開發者，所以，在這一版中，小菜去掉了煩人的異常alert彈窗，若是格式化出現異常，yformater只會悄悄的打印WARN日誌，不會作任何過度的舉措。

 

消息提示美化(NEW 2016年10月30日 v1.8)

 

     完全拋棄原生alert，增長自定義消息提示彈窗，目前彈窗只有以下兩個用途：

 

          ·格式化錯誤提示。

          ·複製JSON成功提示。

 

     彈窗無需關閉，3秒後自動消失。

 

摺疊工具欄優化(NEW 2016年10月30日 v1.8) 

 

     作了以下兩項工做：

 

          ·工具欄樣式調整。

          ·工具欄拖動（工具欄最左側爲拖動區域）。

 

 

 

快捷鍵支持(NEW 2016年10月30日 v1.8)

 

          ·Alt+X格式化當前頁面快捷鍵

          ·Alt+V從剪切板格式化快捷鍵

          ·Alt+C複製json快捷鍵

          ·方向鍵下(↓) 展開全部快捷鍵

          ·方向鍵上(↑) 摺疊全部快捷鍵

          ·方向鍵左(←) 上一級快捷鍵

          ·方向鍵右(→) 下一級快捷鍵

          ·數字鍵1~6 摺疊到對應層級快捷鍵

 

     在新版工具欄中，鼠標滑過按鈕會提示快捷鍵。

     因爲做者粗枝大葉，忽略了Mac系統沒有Alt鍵，Mac系統下用Shift+Cmd鍵代替Alt鍵便可！

 

國際化(NEW 2016年10月30日 v1.8) 

 

     目前支持以下語言：

 

          ·en 英語

          ·zh_CN 中文簡體

          ·zh_TW 中文繁體

 

更換圖標(NEW 2016年10月30日 v1.8)

 

 

     象徵yformater茁壯成長！

 

快捷鍵屏蔽規則列表(NEW 2016年11月05日 v1.8.1)

 

     yformater在此版本中首次引入選項頁，選項按鈕是chrome瀏覽器提供的，位置如圖：

     選項頁預覽：

 

     目前選項頁僅提供「 快捷鍵屏蔽規則列表 」操做。

     若是yformater快捷鍵干擾您正常使用chrome，您能夠在這裏自由解除快捷鍵。

     每行表明一個規則，任意一個或多個規則匹配成功，都會使yformater快捷鍵失效。

     所謂規則，就是用您輸入的正則表達式去匹配當前頁面完整路徑(window.location.href)。

     所以，不建議您輸入過多規則，也不建議您輸入過於複雜的規則。

     每次更新規則時，必定要記得保存哦！

 

下載選中連接(NEW 2018年01月27日 v1.8.7)

 

     用法相似於[訪問選中連接]，只不過這個功能是用來下載文件，而非新標籤頁打開。

     對於一些Json接口中返回的圖片、文檔、視頻等二進制文件連接，都可以使用此功能進行下載保存到本地，方便快捷，是否是有點黑科技了？

     此功能與以前的[訪問選中連接]並列於右鍵菜單中，注意必定要選中文本後再單擊右鍵才能夠看到這兩個功能哦~參考下圖：

 

對象長度(NEW 2018年01月27日 v1.8.7)

 

     所謂對象，在Json中指array和object。

          ·array(數組)的長度顧名思義就是數組中元素個數，以length: ?形式表示，好比[1, 2, 3]長度表示爲length: 3。

          ·object(對象)的長度是指屬性的數量，也就是常說的key，以keys length: ?表示，好比{"key1": 1, "key2": 2}長度表示爲keys length: 2。

     鼠標懸停在array或object起始標記處，便可顯示該array或object的長度。array起始標記爲[，object起始標記爲{，如圖所示：

 

 

 

字符選中相同字符提示(NEW 2018年09月18日 v1.9.0)

 

     選中字符時，若是Json文檔其它位置有相同的字符，那麼會以邊框的形式圈出這些字符，進行相同提示。

     此功能能夠用來方便、快速的確認Json文檔中的字符是否相同。

     字符匹配採用嚴格模式，英文區分大小寫，一旦匹配成功，說明這些字符徹底相同。

     上圖吧，很基礎的功能，不少優秀的編輯器都有這功能，一看就知道怎麼回事了~~~

 

 

 

心動不如行動，立刻使用yformater！

 

 yformater.crx 歷史版本下載

去Chrome 網上應用店安裝 

 

附：

 

     因爲我朝基本把谷歌商店給廢了，因此小菜直接提供crx文件下載。

     crx安裝方法很簡單，直接拖放到擴展頁面便可。