js如何解析JSON字符串 JSON解析的3種安全處理方式

js如何解析JSON字符串 JSON解析的3種安全處理方式

JSON解析,說白了,就是把一看起來像亂碼的字符串,變成JavaScript能懂的對象或數組。但這里面藏著不少坑,一不小心就掉進去了。

js如何解析JSON字符串 JSON解析的3種安全處理方式

直接告訴你答案:json.parse() 是主力軍,但用的時候得小心。另外,還有一些奇技淫巧可以防身。

js如何解析JSON字符串 JSON解析的3種安全處理方式

JSON.parse() 的威力與陷阱

js如何解析JSON字符串 JSON解析的3種安全處理方式

JSON.parse() 是 JavaScript 內置的方法,專門用來解析 JSON 字符串。用起來很簡單:

const jsonString = '{"name":"張三", "age": 30}'; const obj = JSON.parse(jsonString); console.log(obj.name); // 輸出:張三

看起來很美好,對吧?但如果 jsonString 不是一個合法的 JSON 字符串,就會報錯。比如:

const jsonString = "{name:'張三', age: 30}"; // 注意:name和age的key沒有用雙引號包裹 try {   const obj = JSON.parse(jsonString);   console.log(obj.name); } catch (error) {   console.error("JSON 解析出錯:", error); }

所以,在使用 JSON.parse() 之前,最好能確保你的 JSON 字符串是有效的。怎么確保?后面會講到。

如何校驗JSON字符串的有效性?

確保 JSON 字符串有效,就像給代碼加一層保險。萬一 JSON 字符串是從外部來的(比如 API 接口),那這層保險就更重要了。

  • 方法一:try…catch + JSON.parse()

這是最簡單粗暴的方法。直接用 JSON.parse() 解析,如果報錯,就說明 JSON 字符串有問題。

function isValidJSON(jsonString) {   try {     JSON.parse(jsonString);     return true;   } catch (e) {     return false;   } }  const validJson = '{"name":"張三", "age": 30}'; const invalidJson = "{name:'張三', age: 30}";  console.log(isValidJSON(validJson));   // true console.log(isValidJSON(invalidJson));  // false
  • 方法二:使用第三方庫

有一些專門用來校驗 JSON 格式的庫,比如 ajv (Another JSON Validator)。用這些庫可以做更細致的校驗,比如檢查 JSON 是否符合特定的 Schema。

// 需要先安裝 ajv: npm install ajv const Ajv = require('ajv'); const ajv = new Ajv();  const schema = {   type: "object",   properties: {     name: {type: "string"},     age: {type: "integer"}   },   required: ["name", "age"] };  const validate = ajv.compile(schema);  const validData = {name: "張三", age: 30}; const invalidData = {name: "張三", age: "三十"};  console.log(validate(validData));   // true console.log(validate(invalidData));  // false (因為 age 應該是 integer)

ajv 這種庫的好處是,你可以定義 JSON 的結構和類型,然后用它來檢查 JSON 數據是否符合你的要求。這在處理復雜的 JSON 數據時非常有用。

JSON注入攻擊如何防范?

JSON 注入攻擊,聽起來很嚇人,其實就是利用 JSON 解析的漏洞,往你的程序里注入惡意代碼。

  • 永遠不要相信來自客戶端的數據

這是最重要的一條原則。所有來自客戶端的數據,都應該被視為不可信的。在使用 JSON.parse() 解析之前,一定要對數據進行嚴格的校驗和過濾。

  • 使用安全的 JSON 解析器

雖然 JSON.parse() 本身沒有明顯的漏洞,但一些老的 JavaScript 引擎可能存在安全問題。所以,盡量使用最新版本的 JavaScript 引擎,或者使用一些經過安全審計的第三方 JSON 解析庫。

  • 對 JSON 數據進行轉義

如果 JSON 數據中包含特殊字符(比如 、&),應該對這些字符進行轉義,防止它們被解析成 html 標簽或 JavaScript 代碼。

function escapeJSON(jsonString) {   return jsonString.replace(/</g, '<')                    .replace(/>/g, '>')                    .replace(/&/g, '&')                    .replace(/"/g, '"')                    .replace(/'/g, '''); }  const maliciousJson = '{"name": "<script>alert('XSS')</script>"}'; const escapedJson = escapeJSON(maliciousJson); console.log(escapedJson); // 輸出:{"name": "<script>alert('XSS')</script>"}
  • 限制 JSON 數據的使用范圍

盡量避免把 JSON 數據直接插入到 HTML 頁面中,或者作為 JavaScript 代碼執行。如果必須這樣做,一定要進行嚴格的審查,確保數據沒有被篡改。

除了 JSON.parse() 還有其他選擇嗎?

其實,在某些情況下,你可能不需要直接使用 JSON.parse()。比如,如果你的 JSON 數據是從服務器端獲取的,而且服務器端已經做了處理,那么你可以直接使用 JavaScript 對象。

另外,一些現代的 JavaScript 框架(比如 React、vue)會自動處理 JSON 數據的解析和渲染,你不需要手動調用 JSON.parse()。

還有一些第三方庫提供了更高級的 JSON 處理功能,比如:

  • JSONStream: 用于處理大型 JSON 數據流,可以避免一次性加載整個 JSON 數據到內存中。
  • fast-json-stringify: 用于快速地將 JavaScript 對象序列化成 JSON 字符串,比 JSON.stringify() 更快。

總而言之,JSON 解析是一個看似簡單,實則暗藏玄機的操作。只有掌握了正確的方法和技巧,才能避免踩坑,保證程序的安全和穩定。

? 版權聲明
THE END
喜歡就支持一下吧
點贊13 分享