Day28- 新手的Web系列JSON Injection 0x1

正文

JSON 介紹

• JSON 為一種輕量級的資料交換格式
• 用於瀏覽器與伺服器之間的資料交換，例如：google使用JSON回叫擴展web上的服務
  • 回叫法
    • callback
    • 透過Ajax技術處理JSON資料
• JSON 以 HTTP 的方式供外部網路來作連結，以瀏覽器打開，JSON資料相當於一個HTML頁面
• 如果是使用程式或工具請求JSON資料，JSON就只是作為檔案資料交換使用

JSON 基礎

• JSON(Javascript Object Notation)
• JSON是儲存和交換文本檔案資料的一種語法
• JSON是Javascript的子集
• 格式 = 名稱：值
• 例如：
  • "name":"value"
• 值的資料類型：
  • 數字(整數或浮點數)
  • 字串符號
  • 邏輯值(true/false)
  • 陣列([])
  • 物件({})
  • null
• JSON基於兩種資料結構類型：
  • 陣列
  • 物件建構
• JSON 物件：

var json = {"name":"neko","password":"2250"};
document.writeln(jason.name);
document.writeln(jason.password);

• JSON 陣列

var json =[
{"name":"neko","password":"2250"},
{"name":"mew","password":"5022"}
];

// 物件陣列中第一項
json[0].name;
// 回傳的值
neko

• 巢狀

var student = {
// cin是jason的第一個陣列 
"cin":[
// 第一個元素
{"name":"neko","age":18},
// 第二個元素
{"name":"momo","age":20}
],
// csie是jason的第二個陣列 
"csie":[
// 第一個元素
{"name":"robot","age":22},
// 第二個元素
{"name":"popo","age",19}
]
}

• 上面程式中，student是一個物件
• 兩個屬性
  • cin
    • 有兩個jaso物件的陣列
  • csie
    • 有兩個jaso物件的陣列
• 連結資料的方法：
  • document.writeln(student.cin[0].name +' '+ student.cin[0].age)
  • 輸出：
    • neko 18
• JSON 應用
  • <script> 標籤引入JSON檔
    • 一個json檔：var student = {"name":"neko"}
    • 引入json檔：

    <script src="student.json"></script>
    <script>
    alert(student.name);
    alert(student.length);
    </script>
    

  • 透過XMLHttpRequest取得JSON文本檔案資料
    • 一個json檔：var strdent={"name":"neko"}
    • 透過eval()解析json物件

    // 建立 XMLHttpRequest 物件
    httpRequest = getHttpRequest()
    // get student.json
    var test = eval(httpRequest.responseText)
    alert(test.name);