1.0.0 Summary

Tittle：【EatBook】-NO.1.EatBook.1.JavaData.1.001-《JSON 必知必会-Introduction to JavaScript Object Notation》-

Style：Java-Json

Series：O'Reilly Turing

Publishing House：人民邮电

Page Number：129

Since：2017-04-06

End：2017-04-06

Total Hours：4

Degree Of Diffculty：low-2

Degree Of Mastery：frequently-1

Practical Level：A-1

Desired Goal：All relation to JSON

Archieve Goal：foundation usge, secure concept

Gerneral Evaluation：snack book

Read From：EBook

Reader:kingdelee

Source Code：https://github.com/lindsaybassett/json

Related Links：

http://shop.oreilly.com/product/0636920041597.do

https://jsonformatter.curiousconcept.com/

http://jsonlint.com/

http://www.cnblogs.com/kingdelee/

Cover：

1.1.0

Json is a data interchange format

1.2.0 K-V Form

Json is base on JavaScript Object Notation literal(字面量).

{

    "brand": "Crocs",

    "color": "pink",

    "size": 9,

    "hasLaces": false

}

1.2.1 Illegal

None of ""

{

    title: "This is my title.",

    body: "This is the body."

}

Error of ''

{

    'title': 'This is my title.',

    'body': 'This is the body.'

}

1.2.2 Contain Numbers

Value can be string, number, boolean, null, obj, array.

{

    "brand": "Crocs",

    "size": 9,

    "hasLaces": false,

    "color": null

}

1.2.3 MIME

application/json

1.3.1 Emun Form

[

    "witty",

    "charming",

    "brave",

    "bold"

]

1.3.2 Object Form

{

    "person": {

        "name": "Lindsay Bassett",

        "heightInInches": 66,

        "head": {

            "hair": {

                "color": "light blond",

                "length": "short",

                "style": "A-line"

            },

            "eyes": "green"

        }

    }

}

1.3.3 Nest ""

Illegal

{

    "promo": "Say "Bob's the best!" at checkout for free 8oz bag of kibble."

}

Legal

{

    "promo": "Say \"Bob's the best!\" at checkout for free 8oz bag of kibble."

}

1.3.4 BackLash \

Illegal

{

    "location": "C:\Program Files"

}

Legal

{

    "location": "C:\\Program Files"

}

Escape character:

\/  slash(正斜线)

\b  backward channel(退格符)

\f   form feed character(换页符)

\t   tab character(制表符)

\n   newline(换行符)

\r   carriage return(回车符)

\u   后面跟十六进制字符

1.3.5 array

mixture in array:

{

    "eggCarton": [

        "egg",

        null,

        "egg",

        "egg",

        "egg",

        5,

        "egg"

    ]

}

string in array:

{

    "students": [

        "Jane Thomas",

        "Bob Roberts",

        "Robert Bobert",

        "Thomas Janerson"

    ]

}

number in array:

{

    "scores": [

        93.5,

        66.7,

        87.6,

        92

    ]

}

array nest object:

{

    "test": [

        {

            "question": "The sky is blue.",

            "answer": true

        },

        {

            "question": "The earth is flat.",

            "answer": false

        },

        {

            "question": "A cat is a dog.",

            "answer": false

        }

    ]

}

array nest array:

{

    "tests": [

        [

            true,

            false,

            false,

            false

        ],

        [

            true,

            true,

            true,

            true,

            false

        ],

        [

            true,

            false,

            true

        ]

    ]

}

legal empty json object:

{}

Json array:

[

    {

        "user": "bobbarker"

    },

    {

        "phone": "555-555-5555"

    }

]

legal empty json array:

[]

Point:

1.json array is a executable javascript, explorer will parse and executed:

[{"Id":3,"Name":hyddd,"Money":10000}]

2.json object is not a executable javascript, explorer won't parse and executed:

{"Id":3,"Name":hyddd,"Money":10000}

1.4.0 Schema　　

http://json-schema.org/

1.5.0 Secure

CSRF

XSS

1.5.1

Don't use JSON.eval():

<!DOCTYPE html>

<html>

	<head>

		<title>Introduction to JavaScript Object Notation</title>

		<script>

			var jsonString = '{"animal":"cat"}';

			var myObject = eval("(" + jsonString + ")");

			alert(myObject.animal);

		</script>

	</head>

	<body>

		<h1>Introduction to JavaScript Object Notation</h1>

	</body>

</html>
<!DOCTYPE html>

<html>

	<head>

		<title>Introduction to JavaScript Object Notation</title>

		<script>

			var jsonString = "alert('this is bad')";

			var myObject = eval("(" + jsonString + ")");

			alert(myObject.animal);

		</script>

	</head>

	<body>

		<h1>Introduction to JavaScript Object Notation</h1>

	</body>

</html>

use JSON.parse() in instead of JSON.eval():

<!DOCTYPE html>

<html>

	<head>

		<title>Introduction to JavaScript Object Notation</title>

		<script>

			var jsonString = '{"animal":"cat"}';

			var myObject = JSON.parse(jsonString);

			alert(myObject.animal);

		</script>

	</head>

	<body>

		<h1>Introduction to JavaScript Object Notation</h1>

	</body>

</html>

1.5.2 Use escape character instead of html code

no secure:

{

    "message": "<div onmouseover=\"alert('gotcha!')\">hover here.</div>"

}

secure perhaps:

&lt;div&gt;

1.6.0

serialized and deserialized:

<!DOCTYPE html>

<html>

	<head>

		<title>Introduction to JavaScript Object Notation</title>

		<script>

			var myXMLHttpRequest = new XMLHttpRequest();

			var url = "http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139";

			myXMLHttpRequest.onreadystatechange = function() {

				if (myXMLHttpRequest.readyState === 4 && myXMLHttpRequest.status === 200) {

					// the JSON response deserialized

					var myObject = JSON.parse(myXMLHttpRequest.responseText);

					// let's display the weather on the page

					var description = "It's " + myObject.weather[0].description + " and " + myObject.main.temp + " degrees in " + myObject.name + ".";

					document.getElementById("weather").innerHTML = description;

					// The object serialized

					var myJSON = JSON.stringify(myObject);

					// let's display this in the div with the id "json"

					document.getElementById("json").innerHTML = myJSON;

				}

				else if (myXMLHttpRequest.readyState === 4 && myXMLHttpRequest.status !== 200)

				{

				   // fail.

				   document.getElementById("weather").innerHTML = "failed.";

				   document.getElementById("json").innerHTML = "failed.";

				   document.getElementById("error").innerHTML = "Unable to connect to the open weather map API. Are you connected to the internet?  Is <a href='http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139'>this page</a> responsing?  If it's not, try again later."

				}

			}

			myXMLHttpRequest.open("GET", url, true);

			myXMLHttpRequest.send();

		</script>

	</head>

	<body>

		<h1>Introduction to JavaScript Object Notation</h1>

		<h2>The Weather</h2>

		<div id="weather">

		loading...

		</div>

		<h2>The JSON as a String</h2>

		<div id="json">

		loading...

		</div>

		<div id="error">

		</div>

	</body>

</html>

1.6.1 CORS Secure

Insecure:

Access-Control-Allow-Credentials:true

Access-Control-Allow-Methods:GET, POST

Access-Control-Allow-Origin:*

Secure:

Access-Control-Allow-Methods:POST

Access-Control-Allow-Origin:http://www.somebank.com

1.6.2 JSON-P

example10.json:
getTheAnimal({

    "animal": "cat"

});

　　

<!DOCTYPE html>

<html>

	<head>

		<title>Introduction to JavaScript Object Notation</title>

		<script>

			// example 6-11, modified to alert the variable "myAnimal"

			function getTheAnimal(data) {

				var myAnimal = data.animal; // will be "cat"

				alert(myAnimal);

			}

			// example 6-12, modified for the src file to load from example10.json

			var script = document.createElement("script");

			script.type = "text/javascript";

			script.src = "example10.json";

			document.getElementsByTagName('head')[0].appendChild(script);

		</script>

	</head>

	<body>

		<h1>Introduction to JavaScript Object Notation</h1>

	</body>

</html>

1.7.0 some example　　

{

    "total_rows": 2,

    "offset": 0,

    "rows": [

        {

            "id": "ddc14efcf71396463f53c0f880001538",

            "key": "Barker",

            "value": null

        },

        {

            "id": "3636fa3c716f9dd4f7407bd6f700076c",

            "key": "Jackson",

            "value": null

        }

    ]

}

【EatBook】-NO.1.EatBook.1.JavaData.1.001-《JSON 必知必会-Introduction to JavaScript Object Notation》-的更多相关文章

  1. HTTP Content-type 对照表

    Application Type 文件扩展名 Content-Type(Mime-Type) 描述 . application/x-   .* application/octet-stream 二进制 ...

  2. http Content-type对照表

    http://tools.jb51.net/table/http_content_type Content-Type,内容类型,一般是指网页中存在的Content-Type,用于定 义网络文件的类型和 ...

  3. 初识 MySQL 5.6 新特性、功能

    背景: 之前介绍过 MySQL 5.5 新功能.参数,现在要用MySQL5.6,所以就学习和了解下MySQL5.6新的特性和功能,尽量避免踩坑.在后续的学习过程中文章也会不定时更新. 一:参数默认值的 ...

  4. JSON数据解析（转）

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,为Web应用开发提供了一种理想的数据交换格式. 本文将主要介绍在Android ...

  5. JSON数据解析（GSON方式） （转）

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,为Web应用开发提供了一种理想的数据交换格式. 在上一篇博文<Andro ...

  6. Android系列---JSON数据解析

    您可以通过点击 右下角 的按钮 来对文章内容作出评价, 也可以通过左下方的 关注按钮 来关注我的博客的最新动态. 如果文章内容对您有帮助, 不要忘记点击右下角的 推荐按钮 来支持一下哦 如果您对文章内 ...

  7. JSON数据解析(转)

    上篇随笔详细介绍了三种解析服务器端传过来的xml数据格式,而对于服务器端来说,返回给客户端的数据格式一般分为html.xml和json这三种格式,那么本篇随笔将讲解一下json这个知识点,包括如何通过 ...

  8. github上所有大于800 star OC框架

    https://github.com/XCGit/awesome-objc-frameworks#awesome-objc-frameworks awesome-objc-frameworks ID ...

  9. 安卓Json介绍（转）。

    1.JSON(JavaScript Object Notation) 定义: 一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性.业内主流技术为其提供了完整的解决方案(有点类似于正则表达式, ...

随机推荐

  1. solus 系统 - 编译安裝 ibus-rime 中文输入法（附：小鹤双拼双形配置文件）

    編譯方法參見官網 - https://github.com/rime/home/wiki/RimeWithIBus 安装依赖:列出几个可能用到的命令 #安裝cmake gcc等开发工具 sudo eo ...

  2. MySQL-记一次备份失败的排查过程

                山竹来临,窝在家里整理个人文档.        本篇文章主要讲解排查问题的思路,涉及linux 删除文件的原理.实例误删数据恢复.MySQL实例初始化参数优先级别等,虽然涉及知 ...

  3. 操作系统中的IPC机制(inter-process Communication)

    http://www.cnblogs.com/tsiangleo/p/4902695.html

  4. 进程池的map方法

    from multiprocessing import Process,Pool def f1(n): for   i   in range(10): n = n+1 if  __name__ == ...

  5. Apache + PHP配置

    因工作需要,重新配置了Apache和PHP.想起当年曾经配置过,但是已经忘得差不多了.而且,也没有记录.从我个人来看,确实缺乏这样的训练,从国家教育体系来看,似乎也从未有过做科学记录的训练.中国的瓷器 ...

  6. CCPC-Wannafly Winter Camp Day4 Div1 - 最小边覆盖 - [线段树]

    题目链接:https://zhixincode.com/contest/18/problem/C?problem_id=261 样例输入 1 4 21 23 4 样例输出 1 Yes 样例输入 2 4 ...

  7. ORM Active Record Data Mapper

    What's the difference between Active Record and Data Mapper? https://www.culttt.com/2014/06/18/whats ...

  8. [network] netfilter

    netfilter 是什么? netfilter.org is home to the software of the packet filtering framework inside the Li ...

  9. [性能优化] perf

    运行时性能分析工具 wiki:https://en.wikipedia.org/wiki/Perf_(Linux) linux wiki:https://perf.wiki.kernel.org/in ...

  10. [others]tinycore/microcore

    https://zh.wikipedia.org/wiki/Tiny_Core_Linux https://github.com/zeit/micro