Web Basics 2013-01-10
-
Upload
kmiyako -
Category
Technology
-
view
267 -
download
0
Transcript of Web Basics 2013-01-10
![Page 1: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/1.jpg)
Webセミナー
![Page 2: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/2.jpg)
基本
![Page 3: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/3.jpg)
基本
フロントエンド コミュニケーション バックエンド
HTMLCSS
JavaScriptjQueryJSON
HTTP
On Web Connection
4Dタグ
WEB SEND FILE
![Page 4: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/4.jpg)
基本
フロントエンド バックエンド
HTMLCSS
JavaScriptjQueryJSON
On Web Connection
4Dタグ
WEB SEND FILE
![Page 5: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/5.jpg)
基本
フロントエンド バックエンド
![Page 6: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/6.jpg)
基本
フロントエンド バックエンド
![Page 7: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/7.jpg)
基本
フロントエンド バックエンド
![Page 8: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/8.jpg)
基本
Webクライアント コミュニケーション Webサーバー
![Page 9: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/9.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
リクエスト
![Page 10: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/10.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
レスポンス
リクエスト
![Page 11: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/11.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
![Page 12: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/12.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
![Page 13: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/13.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
プロトコル
![Page 14: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/14.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
プロトコル
ホスト
![Page 15: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/15.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
プロトコル
ホスト
ポート
![Page 16: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/16.jpg)
基本
http://192.168.1.114:8080/hello.html
リクエスト
プロトコル
ホスト
ポート
リクエスト
![Page 17: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/17.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
レスポンス
リクエスト
![Page 18: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/18.jpg)
基本
レスポンス
![Page 19: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/19.jpg)
基本
レスポンス
![Page 20: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/20.jpg)
基本
レスポンス
![Page 21: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/21.jpg)
基本
レスポンス
![Page 22: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/22.jpg)
基本
フロントエンド バックエンド
![Page 23: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/23.jpg)
基本
バックエンド
![Page 24: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/24.jpg)
基本
バックエンドスタティック(静)
![Page 25: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/25.jpg)
基本
バックエンド
• 静的なコンテンツ
スタティック(静)
![Page 26: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/26.jpg)
基本
バックエンド
• 静的なコンテンツ
• HTML
スタティック(静)
![Page 27: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/27.jpg)
基本
バックエンド
• 静的なコンテンツ
• HTML
• 画像
スタティック(静)
![Page 28: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/28.jpg)
基本
バックエンド
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静)
![Page 29: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/29.jpg)
基本
バックエンド
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静)
![Page 30: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/30.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 31: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/31.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 32: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/32.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 33: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/33.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 34: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/34.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 35: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/35.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 36: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/36.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
![Page 37: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/37.jpg)
基本
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静) バックエンド
WEB START SERVERIf(OK=1) //successEnd if
![Page 38: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/38.jpg)
基本
バックエンド
• 静的なコンテンツ
• HTML
• 画像
• リクエスト処理前に出力済
スタティック(静)
![Page 39: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/39.jpg)
基本
バックエンドダイナミック(動)
![Page 40: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/40.jpg)
基本
• 動的なコンテンツ
バックエンドダイナミック(動)
![Page 41: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/41.jpg)
基本
• 動的なコンテンツ
• HTML
バックエンドダイナミック(動)
![Page 42: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/42.jpg)
基本
• 動的なコンテンツ
• HTML
• 画像
バックエンドダイナミック(動)
![Page 43: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/43.jpg)
基本
• 動的なコンテンツ
• HTML
• 画像
• リクエスト処理時に出力
バックエンドダイナミック(動)
![Page 44: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/44.jpg)
基本
4Dタグ バックエンド
![Page 45: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/45.jpg)
基本
4Dタグ バックエンド
• 4DTEXT
![Page 46: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/46.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML
![Page 47: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/47.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML• 4DSCRIPT
![Page 48: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/48.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE
![Page 49: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/49.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF
![Page 50: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/50.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP
![Page 51: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/51.jpg)
基本
4Dタグ バックエンド
• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 52: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/52.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<h1>ようこそ<!--#4DTEXT [CONTACTS]FirstName--></h1>
<p>ユーザー名: <!--#4DTEXT vtUserName--></p>
<!--#4DTEXT myArray{7}-->
<!--#4DTEXT Current time-->
<!--#4DTEXT Records in selection([INVOICES])-->件のレコードがみつかりました。
![Page 53: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/53.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<h1>ようこそ<!--#4DHTML [CONTACTS]FirstName--></h1>
<p>ユーザー名: <!--#4DHTML vtUserName--></p>
<!--#4DHTML myArray{7}-->
![Page 54: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/54.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<h1>ようこそ<!--#4DHTML [CONTACTS]FirstName--></h1>
<p>ユーザー名: <!--#4DHTML vtUserName--></p>
<!--#4DHTML myArray{7}-->
[Contacts]lastName:="<b>MIYAKO</b> Keisuke"
vtUserName:= "<font color=\"red\">MIYAKO</font>"
myArray{7}:="<a href=\"http://www.4d.com\">4D</a>"
![Page 55: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/55.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 56: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/56.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--#4DSCRIPT/MethodName/Param-->
![Page 57: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/57.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--#4DSCRIPT/MethodName/Param-->
/Param
![Page 58: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/58.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--#4DSCRIPT/MethodName/Param-->
/Param
公開メソッド
![Page 59: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/59.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--#4DSCRIPT/MethodName/Param-->
/Param
公開メソッド
![Page 60: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/60.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 61: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/61.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--#4DINCLUDE header/menu.html-->
![Page 62: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/62.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 63: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/63.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<div><!--4DIF (vNumRecords>0)--> <p><!--4DTEXT vNumRecords-->件みつかりました。</p><!--4DELSE--> <p>何もみつかりませんでした。</p><!--4DENDIF--></div>
![Page 64: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/64.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DELSEIF, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<div><!--4DIF (vNumRecords>0)--> <p><!--4DTEXT vNumRecords-->件みつかりました。</p><!--4DELSE--> <p>何もみつかりませんでした。</p><!--4DENDIF--></div>
<div><!--4DIF (Condition1)--> <!--4DINCLUDE menu1.html--><!--4DELSEIF (Condition2)--> <!--4DINCLUDE menu2.html--><!--4DELSEIF (Condition3)--> <!--4DINCLUDE menu3.html--><!--4DELSE--> <!--4DINCLUDE menu.html--><!--4DENDIF--></div>
![Page 65: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/65.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 66: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/66.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--4DLOOP (arrCities)--> <p><!--4DTEXT arrCities{arrCities}--></p><!--4DENDLOOP-->
![Page 67: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/67.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--4DLOOP (arrCities)--> <p><!--4DTEXT arrCities{arrCities}--></p><!--4DENDLOOP-->
<!--4DLOOP [CONTACTS]--> <p><!--4DTEXT [CONTACTS]firstName--></p><!--4DENDLOOP-->
![Page 68: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/68.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--4DLOOP (arrCities)--> <p><!--4DTEXT arrCities{arrCities}--></p><!--4DENDLOOP-->
<!--4DLOOP [CONTACTS]--> <p><!--4DTEXT [CONTACTS]firstName--></p><!--4DENDLOOP-->
<!--4DLOOP allowAction--> <p><!--4DTEXT actionResult--></p><!--4DENDLOOP-->
![Page 69: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/69.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
![Page 70: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/70.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--4DINCLUDE header.html--><!--4DBASE folder/--><!--4DINCLUDE subpage1.html--><!--4DINCLUDE subpage2.html--><!--4DINCLUDE subpage3.html--><!--4DBASE sub/--><!--4DINCLUDE subpage4.html--><!--4DINCLUDE subpage5.html--><!--4DINCLUDE subpage6.html--><!--4DBASE WEBFOLDER--><!--4DINCLUDE footer.html-->
![Page 71: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/71.jpg)
基本
4Dタグ• 4DTEXT• 4DHTML• 4DSCRIPT• 4DINCLUDE• 4DIF, 4DELSE, 4DENDIF• 4DLOOP, 4DENDLOOP• 4DBASE
<!--4DINCLUDE header.html--><!--4DBASE folder/--><!--4DINCLUDE subpage1.html--><!--4DINCLUDE subpage2.html--><!--4DINCLUDE subpage3.html--><!--4DBASE sub/--><!--4DINCLUDE subpage4.html--><!--4DINCLUDE subpage5.html--><!--4DINCLUDE subpage6.html--><!--4DBASE WEBFOLDER--><!--4DINCLUDE footer.html-->
Webfolder/header.htmlWebfolder/folder/subpage1.htmlWebfolder/folder/subpage2.htmlWebfolder/folder/subpage3.htmlWebfolder/folder/sub/subpage4.htmlWebfolder/folder/sub/subpage5.htmlWebfolder/folder/sub/subpage6.htmlWebfolder/footer.html
![Page 72: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/72.jpg)
基本
Webクライアント コミュニケーション Webサーバー
![Page 73: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/73.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
リクエスト
![Page 74: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/74.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
リクエスト
.html
![Page 75: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/75.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.168.1.114:8080/hello.html
リクエスト
.html
![Page 76: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/76.jpg)
基本
Webクライアント コミュニケーション Webサーバー
![Page 77: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/77.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114:8080
/hello.shtml リクエス
ト
![Page 78: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/78.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114:8080
/hello.shtml リクエス
ト.shtml
![Page 79: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/79.jpg)
基本
Webクライアント コミュニケーション Webサーバー
レスポンス
ファイル読み込み
4Dタグ処理
http://192.16
8.1.114:8080
/hello.shtml リクエス
ト.shtml
![Page 80: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/80.jpg)
基本
Webクライアント コミュニケーション Webサーバー
![Page 81: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/81.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114/4DA
CTION/myMe
thod/hello
リクエスト
![Page 82: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/82.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114/4DA
CTION/myMe
thod/hello
リクエスト
/4DACTION/myMethod/hello
![Page 83: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/83.jpg)
基本
Webクライアント コミュニケーション Webサーバー
メソッド実行
http://192.16
8.1.114/4DA
CTION/myMe
thod/hello
リクエスト
![Page 84: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/84.jpg)
基本
Webクライアント コミュニケーション Webサーバー
メソッド実行
http://192.16
8.1.114/4DA
CTION/myMe
thod/hello
リクエスト
WEB SEND FILE
![Page 85: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/85.jpg)
基本
Webクライアント コミュニケーション Webサーバー
レスポンス
メソッド実行
4Dタグ処理
http://192.16
8.1.114/4DA
CTION/myMe
thod/hello
リクエスト
ファイル読み込み
WEB SEND FILE
![Page 86: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/86.jpg)
基本
Webクライアント コミュニケーション Webサーバー
![Page 87: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/87.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114/helloリクエスト
![Page 88: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/88.jpg)
基本
Webクライアント コミュニケーション Webサーバー
http://192.16
8.1.114/helloリクエスト
/hello
![Page 89: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/89.jpg)
基本
Webクライアント コミュニケーション Webサーバー
On Web Connection
http://192.16
8.1.114/helloリクエスト
![Page 90: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/90.jpg)
基本
Webクライアント コミュニケーション Webサーバー
On Web Connection
http://192.16
8.1.114/helloリクエスト
WEB SEND FILE
![Page 91: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/91.jpg)
基本
Webクライアント コミュニケーション Webサーバー
レスポンス
On Web Connection
4Dタグ処理
http://192.16
8.1.114/helloリクエスト
ファイル読み込み
WEB SEND FILE
![Page 92: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/92.jpg)
基本
On Web Connection
![Page 93: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/93.jpg)
基本
On Web Connection
![Page 94: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/94.jpg)
基本
On Web Connection
• $1リクエスト
![Page 95: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/95.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
![Page 96: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/96.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
![Page 97: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/97.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
![Page 98: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/98.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
![Page 99: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/99.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
• $6 パスワード
![Page 100: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/100.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
• $6 パスワード
WEB GET VARIABLES
![Page 101: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/101.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
• $6 パスワード
WEB GET HTTP HEADER
WEB GET VARIABLES
![Page 102: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/102.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
• $6 パスワード
WEB GET HTTP BODY
WEB GET HTTP HEADER
WEB GET VARIABLES
![Page 103: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/103.jpg)
基本
On Web Connection
• $1リクエスト
• $2 HTTPヘッダ+ボディ(一部)
• $3 クライアントIPアドレス
• $4 サーバーIPアドレス
• $5 ユーザー名
• $6 パスワード
WEB GET HTTP BODY
WEB GET HTTP HEADER
WEB GET HTTP BODY PARTS
WEB GET VARIABLES
![Page 104: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/104.jpg)
まとめ
![Page 105: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/105.jpg)
基本
![Page 106: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/106.jpg)
基本
• スタティック(静)
• HTML ページ
• images 画像
• css スタイル
• js スクリプト
![Page 107: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/107.jpg)
基本
• スタティック(静)
• HTML ページ
• images 画像
• css スタイル
• js スクリプト
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
![Page 108: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/108.jpg)
基本
• スタティック(静)
• HTML ページ
• images 画像
• css スタイル
• js スクリプト
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
![Page 109: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/109.jpg)
基本
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
![Page 110: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/110.jpg)
基本
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
![Page 111: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/111.jpg)
基本
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
![Page 112: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/112.jpg)
基本
• ダイナミック(動)
• HTML ページ
• images 画像
• json データ
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
![Page 113: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/113.jpg)
基本
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
![Page 114: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/114.jpg)
基本
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
![Page 115: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/115.jpg)
基本
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
•WEB GET VARIABLES
•WEB SEND FILE
•WEB GET HTTP HEADER
•WEB GET HTTP BODY
![Page 116: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/116.jpg)
基本
• 4Dタグ
• On Web Connection
• .shtml
• 4DACTION
•WEB GET VARIABLES
•WEB SEND FILE
•WEB GET HTTP HEADER
•WEB GET HTTP BODY• WEB SEND TEXT
• WEB SEND BLOB
• WEB SEND RAW DATA
• WEB SEND HTTP REDIRECT
![Page 117: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/117.jpg)
jQuery
![Page 118: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/118.jpg)
jQuery
<script src="/js/jquery.js"></script><script> $(function(){! //$(document).ready(function()の短縮形 $.getJSON("/Contacts/data", function(data){! var contactsList = '<ul>';! ! ! ! ! ! $.each(data, function(index, value){! contactsList = contactsList + '<li uid="' + value.contactId + '">'; contactsList = contactsList + value.lastName; contactsList = contactsList + value.firstName + '</li>';! });! contactsList += '</ul>';! ! ! ! ! ! $("#contactList").html(contactsList);! ! ! }) });</script>!
WebFolder/Contacts/index.html
![Page 119: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/119.jpg)
jQuery
<script src="/js/jquery.js"></script><script> $(function(){! //$(document).ready(function()の短縮形 $.getJSON("/Contacts/data", function(data){! var contactsList = '<ul>';! ! ! ! ! ! $.each(data, function(index, value){! contactsList = contactsList + '<li uid="' + value.contactId + '">'; contactsList = contactsList + value.lastName; contactsList = contactsList + value.firstName + '</li>';! });! contactsList += '</ul>';! ! ! ! ! ! $("#contactList").html(contactsList);! ! ! }) });</script>!
WebFolder/Contacts/index.html
![Page 120: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/120.jpg)
jQuery
<script src="/js/jquery.js"></script><script> $(function(){! //$(document).ready(function()の短縮形 $.getJSON("/Contacts/data", function(data){! var contactsList = '<ul>';! ! ! ! ! ! $.each(data, function(index, value){! contactsList = contactsList + '<li uid="' + value.contactId + '">'; contactsList = contactsList + value.lastName; contactsList = contactsList + value.firstName + '</li>';! });! contactsList += '</ul>';! ! ! ! ! ! $("#contactList").html(contactsList);! ! ! }) });</script>!
WebFolder/Contacts/index.html
![Page 121: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/121.jpg)
jQuery
<script src="/js/jquery.js"></script><script> $(function(){! //$(document).ready(function()の短縮形 $.getJSON("/Contacts/data", function(data){! var contactsList = '<ul>';! ! ! ! ! ! $.each(data, function(index, value){! contactsList = contactsList + '<li uid="' + value.contactId + '">'; contactsList = contactsList + value.lastName; contactsList = contactsList + value.firstName + '</li>';! });! contactsList += '</ul>';! ! ! ! ! ! $("#contactList").html(contactsList);! ! ! }) });</script>!
WebFolder/Contacts/index.html
![Page 122: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/122.jpg)
jQuery
On Web Connection
C_TEXT($1;$2;$3;$4;$5;$6)
$request:=$1
Case of : ($request="/Contacts/data")
ALL RECORDS([Contacts]) $filePath:=Get 4D folder(Current Resources folder)+\ "json"+Folder separator+"contacts.html" WEB SEND FILE($filePath)
End case
![Page 123: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/123.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 124: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/124.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 125: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/125.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 126: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/126.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 127: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/127.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 128: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/128.jpg)
C_TEXT($1;$0)
If (Count parameters>0)
$0:=$1
If (Length($0)#0) $0:=Replace string($0;"\\";"\\\\";*) $0:=Replace string($0;"\"";"\\\"";*) $0:=Replace string($0;"/";"\\/";*) $0:=Replace string($0;Char(Backspace);"\\b";*) $0:=Replace string($0;Char(FF ASCII code);"\\f";*) $0:=Replace string($0;"\n";"\\n";*) $0:=Replace string($0;"\r";"\\r";*) $0:=Replace string($0;"\t";"\\t";*) End if End if
w_escapeText
jQuery
![Page 129: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/129.jpg)
C_TEXT($1;$0)
If (Count parameters>0)
$0:=$1
If (Length($0)#0) $0:=Replace string($0;"\\";"\\\\";*) $0:=Replace string($0;"\"";"\\\"";*) $0:=Replace string($0;"/";"\\/";*) $0:=Replace string($0;Char(Backspace);"\\b";*) $0:=Replace string($0;Char(FF ASCII code);"\\f";*) $0:=Replace string($0;"\n";"\\n";*) $0:=Replace string($0;"\r";"\\r";*) $0:=Replace string($0;"\t";"\\t";*) End if End if
w_escapeText
jQuery
![Page 130: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/130.jpg)
C_TEXT($1;$0)
If (Count parameters>0)
$0:=$1
If (Length($0)#0) $0:=Replace string($0;"\\";"\\\\";*) $0:=Replace string($0;"\"";"\\\"";*) $0:=Replace string($0;"/";"\\/";*) $0:=Replace string($0;Char(Backspace);"\\b";*) $0:=Replace string($0;Char(FF ASCII code);"\\f";*) $0:=Replace string($0;"\n";"\\n";*) $0:=Replace string($0;"\r";"\\r";*) $0:=Replace string($0;"\t";"\\t";*) End if End if
w_escapeText
jQuery
![Page 131: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/131.jpg)
C_TEXT($1;$0)
If (Count parameters>0)
$0:=$1
If (Length($0)#0) $0:=Replace string($0;"\\";"\\\\";*) $0:=Replace string($0;"\"";"\\\"";*) $0:=Replace string($0;"/";"\\/";*) $0:=Replace string($0;Char(Backspace);"\\b";*) $0:=Replace string($0;Char(FF ASCII code);"\\f";*) $0:=Replace string($0;"\n";"\\n";*) $0:=Replace string($0;"\r";"\\r";*) $0:=Replace string($0;"\t";"\\t";*) End if End if
w_escapeText
jQuery
![Page 132: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/132.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 133: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/133.jpg)
jQuery
[<!--4DLOOP [Contacts]-->! {! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"! }<!--4DTEXT w_endOfArrayItem(->[Contacts])--><!--4DENDLOOP-->]
Resources/json/contacts.html
![Page 134: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/134.jpg)
C_POINTER($1)C_TEXT($0)
If (Count parameters>0) If (Not(Nil($1))) If (Table(Table($1))=$1) If (Records in selection($1->)#Selected record number($1->)) $0:="," End if End if End if End if
w_endOfArrayItem
jQuery
![Page 135: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/135.jpg)
C_POINTER($1)C_TEXT($0)
If (Count parameters>0) If (Not(Nil($1))) If (Table(Table($1))=$1) If (Records in selection($1->)#Selected record number($1->)) $0:="," End if End if End if End if
w_endOfArrayItem
jQuery
![Page 136: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/136.jpg)
C_POINTER($1)C_TEXT($0)
If (Count parameters>0) If (Not(Nil($1))) If (Table(Table($1))=$1) If (Records in selection($1->)#Selected record number($1->)) $0:="," End if End if End if End if
w_endOfArrayItem
jQuery
![Page 137: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/137.jpg)
C_POINTER($1)C_TEXT($0)
If (Count parameters>0) If (Not(Nil($1))) If (Table(Table($1))=$1) If (Records in selection($1->)#Selected record number($1->)) $0:="," End if End if End if End if
w_endOfArrayItem
jQuery
![Page 138: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/138.jpg)
C_POINTER($1)C_TEXT($0)
If (Count parameters>0) If (Not(Nil($1))) If (Table(Table($1))=$1) If (Records in selection($1->)#Selected record number($1->)) $0:="," End if End if End if End if
w_endOfArrayItem
jQuery
![Page 139: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/139.jpg)
jQuery
<script src="/js/jquery.js"></script><script> $(function(){! //$(document).ready(function()の短縮形 $.getJSON("/Contacts/data", function(data){! var contactsList = '<ul>';! ! ! ! ! ! $.each(data, function(index, value){! contactsList = contactsList + '<li uid="' + value.contactId + '">'; contactsList = contactsList + value.lastName; contactsList = contactsList + value.firstName + '</li>';! });! contactsList += '</ul>';! ! ! ! ! ! $("#contactList").html(contactsList);! ! ! }) });</script>!
WebFolder/Contacts/index.html
![Page 140: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/140.jpg)
デバッグ
![Page 141: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/141.jpg)
デバッグ
フロントエンド バックエンド
![Page 142: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/142.jpg)
デバッグ
フロントエンド バックエンド
![Page 143: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/143.jpg)
デバッグ
フロントエンド バックエンド
TRACE
![Page 144: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/144.jpg)
デバッグ
フロントエンド バックエンド
TRACE
![Page 145: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/145.jpg)
デバッグ
フロントエンド バックエンド
![Page 146: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/146.jpg)
デバッグ
フロントエンド バックエンド
F12(開発者ツール)
![Page 147: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/147.jpg)
デバッグ
フロントエンド バックエンド
F12(開発者ツール)
![Page 148: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/148.jpg)
デバッグ
フロントエンド バックエンド
![Page 149: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/149.jpg)
デバッグ
フロントエンド バックエンド
⌥⌘I(デベロッパーツール)
![Page 150: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/150.jpg)
デバッグ
フロントエンド バックエンド
⌥⌘I(デベロッパーツール)
![Page 151: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/151.jpg)
デバッグ
フロントエンド バックエンド
![Page 152: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/152.jpg)
デバッグ
フロントエンド バックエンド
F12(Firebug)
![Page 153: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/153.jpg)
デバッグ
フロントエンド バックエンド
F12(Firebug)
![Page 154: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/154.jpg)
デバッグ
フロントエンド バックエンド
![Page 155: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/155.jpg)
デバッグ
フロントエンド バックエンド
⌥⌘I(Webインスペクタ)
![Page 156: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/156.jpg)
デバッグ
フロントエンド バックエンド
⌥⌘I(Webインスペクタ)
![Page 157: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/157.jpg)
デバッグ
![Page 158: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/158.jpg)
デバッグ
![Page 159: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/159.jpg)
デバッグ
![Page 160: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/160.jpg)
デバッグ
![Page 161: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/161.jpg)
デバッグ
![Page 162: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/162.jpg)
デバッグ
![Page 163: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/163.jpg)
デバッグ
![Page 164: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/164.jpg)
デバッグ
![Page 165: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/165.jpg)
モバイル
![Page 166: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/166.jpg)
C_BOOLEAN($0;$isMobile)
ARRAY TEXT($headerNames;0)ARRAY TEXT($headerValues;0)
WEB GET HTTP HEADER($headerNames;$headerValues)C_LONGINT($i)
$i:=Find in array($headerNames;"User-Agent")
If ($i#-1)
$userAgent:=$headerValues{$i}
$isMobile:=True Case of : (Position("iPhone";$userAgent)#0) : (Position("iPad";$userAgent)#0) : (Position("Android";$userAgent)#0) Else $isMobile:=False End case
End if
$0:=$isMobilew_isMobile
モバイル
![Page 167: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/167.jpg)
C_BOOLEAN($0;$isMobile)
ARRAY TEXT($headerNames;0)ARRAY TEXT($headerValues;0)
WEB GET HTTP HEADER($headerNames;$headerValues)C_LONGINT($i)
$i:=Find in array($headerNames;"User-Agent")
If ($i#-1)
$userAgent:=$headerValues{$i}
$isMobile:=True Case of : (Position("iPhone";$userAgent)#0) : (Position("iPad";$userAgent)#0) : (Position("Android";$userAgent)#0) Else $isMobile:=False End case
End if
$0:=$isMobilew_isMobile
モバイル
![Page 168: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/168.jpg)
モバイル
![Page 169: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/169.jpg)
C_TEXT($1)
ARRAY LONGINT($pos;0)ARRAY LONGINT($len;0)
If (Match regex("((.+)\\.(.+))";$1;1;$pos;$len))
$fileName:=Substring($1;$pos{2};$len{2}) $fileType:=Substring($1;$pos{3};$len{3})
$filePath:=Get 4D folder(Current Resources folder)+\ $fileType+Folder separator+$fileName+".html"
WEB SEND FILE($filePath)
End if
モバイル
w_sendFile
![Page 170: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/170.jpg)
モバイル
On Web Connection
C_TEXT($1;$2;$3;$4;$5;$6)
$request:=$1
$isMobile:=w_isMobile
Case of : ($request="/Contacts/")
ALL RECORDS([Contacts])
If ($isMobile) w_sendFile ("contacts-mobile.html") Else w_sendFile ("contacts-desktop.html") End if
End case
![Page 171: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/171.jpg)
モバイル
![Page 172: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/172.jpg)
モバイル
![Page 173: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/173.jpg)
jQuery Mobile
![Page 174: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/174.jpg)
jQuery Mobile
![Page 175: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/175.jpg)
jQuery Mobile
![Page 176: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/176.jpg)
jQuery Mobile
<head>! <meta charset="utf-8" />! <meta name="viewport" content="width=device-width, initial-scale=1">! <title>Contacts</title>! <!--jQuery Mobile関連のスタイルシートです。-->! !! <link rel="stylesheet" href="/css/jquery.mobile-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.theme-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.structure-1.2.0.min.css" />! <!--はじめにjQuery本体を読み込みます。-->! !! <script src="/js/jquery-1.8.2.min.js"></script>! <!--つづけてjQuery Mobileを読み込みます。-->!! ! !! <script src="/js/jquery.mobile-1.2.0.min.js"></script></head>
Resources/html/contacts-mobile.html
![Page 177: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/177.jpg)
jQuery Mobile
<head>! <meta charset="utf-8" />! <meta name="viewport" content="width=device-width, initial-scale=1">! <title>Contacts</title>! <!--jQuery Mobile関連のスタイルシートです。-->! !! <link rel="stylesheet" href="/css/jquery.mobile-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.theme-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.structure-1.2.0.min.css" />! <!--はじめにjQuery本体を読み込みます。-->! !! <script src="/js/jquery-1.8.2.min.js"></script>! <!--つづけてjQuery Mobileを読み込みます。-->!! ! !! <script src="/js/jquery.mobile-1.2.0.min.js"></script></head>
Resources/html/contacts-mobile.html
![Page 178: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/178.jpg)
jQuery Mobile
<head>! <meta charset="utf-8" />! <meta name="viewport" content="width=device-width, initial-scale=1">! <title>Contacts</title>! <!--jQuery Mobile関連のスタイルシートです。-->! !! <link rel="stylesheet" href="/css/jquery.mobile-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.theme-1.2.0.min.css" />! <link rel="stylesheet" href="/css/jquery.mobile.structure-1.2.0.min.css" />! <!--はじめにjQuery本体を読み込みます。-->! !! <script src="/js/jquery-1.8.2.min.js"></script>! <!--つづけてjQuery Mobileを読み込みます。-->!! ! !! <script src="/js/jquery.mobile-1.2.0.min.js"></script></head>
Resources/html/contacts-mobile.html
![Page 179: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/179.jpg)
jQuery Mobile
![Page 180: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/180.jpg)
jQuery Mobile
![Page 181: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/181.jpg)
jQuery Mobile
![Page 182: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/182.jpg)
JSON
![Page 183: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/183.jpg)
JSONhttp://ja.wikipedia.org/JSON
![Page 184: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/184.jpg)
JSONhttp://ja.wikipedia.org/JSON
• JavaScriptオブジェクトの表記法を応用したデータ形式
![Page 185: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/185.jpg)
JSONhttp://ja.wikipedia.org/JSON
• JavaScriptオブジェクトの表記法を応用したデータ形式
• JSON = JavaScript Object Notation
![Page 186: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/186.jpg)
JSONhttp://ja.wikipedia.org/JSON
• JavaScriptオブジェクトの表記法を応用したデータ形式
• JSON = JavaScript Object Notation
• JSON # JavaScript
![Page 187: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/187.jpg)
JSONhttp://ja.wikipedia.org/JSON
• JavaScriptオブジェクトの表記法を応用したデータ形式
• JSON = JavaScript Object Notation
• JSON # JavaScript
Inspired
![Page 188: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/188.jpg)
JSONhttp://ja.wikipedia.org/JSON
• JavaScriptオブジェクトの表記法を応用したデータ形式
• JSON = JavaScript Object Notation
• JSON # JavaScript
『JSONは余計な脂肪を除いたXMLの代役』
ダグラス・クロックフォード http://www.json.org/fatfree.html
Inspired
![Page 189: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/189.jpg)
JSONデータの例
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 190: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/190.jpg)
JSONデータの例
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
配列
![Page 191: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/191.jpg)
JSONデータの例
文字列
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
配列
![Page 192: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/192.jpg)
JSONデータの例
文字列 数値
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
配列
![Page 193: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/193.jpg)
JSONデータの例
文字列
ブール
数値
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
配列
![Page 194: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/194.jpg)
JSONの特徴
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 195: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/195.jpg)
JSONの特徴JSON特性 メリット
軽量フォーマット HTTP経由に最適
汎用性の高いデータ型と構造 プログラミング言語に依存しない
標準テキスト 人間が理解
簡潔 (それでも豊かな表現力) 容易に解析
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 196: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/196.jpg)
JSONの特徴JSON特性 メリット
軽量フォーマット HTTP経由に最適
汎用性の高いデータ型と構造 プログラミング言語に依存しない
標準テキスト 人間が理解
簡潔 (それでも豊かな表現力) 容易に解析
1
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 197: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/197.jpg)
JSONの特徴JSON特性 メリット
軽量フォーマット HTTP経由に最適
汎用性の高いデータ型と構造 プログラミング言語に依存しない
標準テキスト 人間が理解
簡潔 (それでも豊かな表現力) 容易に解析
2
1
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 198: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/198.jpg)
JSONの特徴JSON特性 メリット
軽量フォーマット HTTP経由に最適
汎用性の高いデータ型と構造 プログラミング言語に依存しない
標準テキスト 人間が理解
簡潔 (それでも豊かな表現力) 容易に解析
2
3
1
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 199: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/199.jpg)
JSONの特徴JSON特性 メリット
軽量フォーマット HTTP経由に最適
汎用性の高いデータ型と構造 プログラミング言語に依存しない
標準テキスト 人間が理解
簡潔 (それでも豊かな表現力) 容易に解析
2
3
4
1
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 200: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/200.jpg)
クライアント サーバー
JSON転送の流れ
![Page 201: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/201.jpg)
http://server.com/q?lastName=keisuke
1
HTTPリクエスト
クライアント サーバー
JSON転送の流れ
![Page 202: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/202.jpg)
http://server.com/q?lastName=keisuke
1
2
HTTPリクエスト
クエリの実行JSONの組み立て
クライアント サーバー
JSON転送の流れ
![Page 203: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/203.jpg)
http://server.com/q?lastName=keisuke
1
2
3
HTTPリクエスト
クエリの実行JSONの組み立て
HTTPレスポンス
クライアント サーバー
JSON転送の流れ
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 204: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/204.jpg)
http://server.com/q?lastName=keisuke
1
2
3
4
HTTPリクエスト
クエリの実行JSONの組み立て
JSONデータを解析
HTTPレスポンス
クライアント サーバー
JSON転送の流れ
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
![Page 205: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/205.jpg)
JSONデータ型と4D
![Page 206: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/206.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 207: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/207.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 208: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/208.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 209: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/209.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 210: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/210.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 211: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/211.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 212: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/212.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
string ✔ テキスト
number ✔ 実数/整数
true/false ✔ ブール
null ✔
![Page 213: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/213.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
![Page 214: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/214.jpg)
JSONデータ型と4DJSON型 構造体 値 4D型
object ✔
array ✔ 配列
値は構造体の中にだけ存在する
![Page 215: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/215.jpg)
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
JSON配列の例
![Page 216: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/216.jpg)
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
myArray
JSON配列の例
![Page 217: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/217.jpg)
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
myArray
配列インデックス 値myArray[0] ➤ “Miyako”myArray[1] ➤ “Keisuke”myArray[2] ➤ “95015”myArray[3] ➤ 38myArray[4] ➤ true
JSON配列の例
![Page 218: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/218.jpg)
[ “Miyako”, “Keisuke”, “95015”, 38, true ]
JSON配列の例
配列インデックス 値myArray{1} ➤ “Miyako”myArray{2} ➤ “Keisuke”myArray{3} ➤ “95015”myArray{4} ➤ “38”myArray{5} ➤ “true”
myArray
![Page 219: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/219.jpg)
JSONオブジェクトの例
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 220: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/220.jpg)
JSONオブジェクトの例
オブジェクト
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 221: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/221.jpg)
JSONオブジェクトの例
キー
オブジェクト
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 222: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/222.jpg)
JSONオブジェクトの例
値キー
オブジェクト
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 223: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/223.jpg)
JSONオブジェクトの例
値キー
オブジェクト
{ “male” : true, “city” : “Tokyo”, “lastName” : “Miyako”, “age” : 38, “zip” : “95015”, “firstName” : “Keisuke”, “state” : “JP”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 224: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/224.jpg)
JSONオブジェクトの例
値キー
順不問
オブジェクト
{ “male” : true, “city” : “Tokyo”, “lastName” : “Miyako”, “age” : 38, “zip” : “95015”, “firstName” : “Keisuke”, “state” : “JP”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 225: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/225.jpg)
JSONオブジェクトの例
値キー
オブジェクトはキー/値ペア(連想配列)順不問
オブジェクト
{ “male” : true, “city” : “Tokyo”, “lastName” : “Miyako”, “age” : 38, “zip” : “95015”, “firstName” : “Keisuke”, “state” : “JP”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 226: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/226.jpg)
オブジェクト表記{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
![Page 227: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/227.jpg)
オブジェクト表記{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
myObject
![Page 228: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/228.jpg)
オブジェクト表記
キー 値 myObject.firstName ➤ “Keisuke” myObject.lastName ➤ “Miyako” myObject.zip ➤ “95015” myObject.age ➤ 38
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “city” : “Tokyo”, “state” : “JP”, “zip” : “95015”, “age” : 38, “male” : true}
myObject
![Page 229: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/229.jpg)
NestedObject
構造体は値
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
![Page 230: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/230.jpg)
NestedObject
構造体は値
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
phone
![Page 231: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/231.jpg)
NestedObject
構造体は値
キー 値phone.cell ➤ “734-555-1234”
phone.work ➤ “734-555-2468”
phone.home ➤ “734-555-1357”
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
phone
![Page 232: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/232.jpg)
NestedObject
構造体は値
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
phone
![Page 233: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/233.jpg)
NestedObject
構造体は値
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “phone” :
}phone
![Page 234: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/234.jpg)
NestedObject
構造体は値
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “phone” :
}
contact
phone
![Page 235: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/235.jpg)
NestedObject
構造体は値
キー 値 contact.phone.cell ➤ “734-555-1234”
contact.phone.work ➤ “734-555-2468”
contact.phone.home ➤ “734-555-1357”
{ “cell” : “734-555-1234”, “work” : “734-555-2468”, “home” : “734-555-1357”}
{ “firstName” : “Keisuke”, “lastName” : “Miyako”, “phone” :
}
contact
phone
![Page 236: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/236.jpg)
構造体のネストネストできるものネストできるものネストできるもの
オブジェクト配列
![Page 237: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/237.jpg)
構造体のネストネストできるものネストできるものネストできるもの
オブジェクト配列
オブジェクト 配列 値✔ ✔ ✔
✔ ✔ ✔
![Page 238: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/238.jpg)
構造体のネストネストできるものネストできるものネストできるもの
オブジェクト配列
オブジェクト 配列 値✔ ✔ ✔
✔ ✔ ✔
![Page 239: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/239.jpg)
構造体のネストネストできるものネストできるものネストできるもの
オブジェクト配列
オブジェクト 配列 値✔ ✔ ✔
✔ ✔ ✔
![Page 240: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/240.jpg)
構造体のネスト
•ネストされた構造体は階層構造を形成する
ネストできるものネストできるものネストできるもの
オブジェクト配列
オブジェクト 配列 値✔ ✔ ✔
✔ ✔ ✔
![Page 241: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/241.jpg)
構造体のネスト
•ネストされた構造体は階層構造を形成する•階層数に制限はない
ネストできるものネストできるものネストできるもの
オブジェクト配列
オブジェクト 配列 値✔ ✔ ✔
✔ ✔ ✔
![Page 242: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/242.jpg)
配列のネスト
[
[ 4, “Cape”, 699.00 ], [ 6, “Cowl”, 1195.00 ], [ 3, “Boots”, 395.00 ], [ 1, “Batwing”, 697199.00 ]
]
![Page 243: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/243.jpg)
配列のネストlineItem
[
[ 4, “Cape”, 699.00 ], [ 6, “Cowl”, 1195.00 ], [ 3, “Boots”, 395.00 ], [ 1, “Batwing”, 697199.00 ]
]
![Page 244: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/244.jpg)
配列のネストlineItem
lineItem[1][
[ 4, “Cape”, 699.00 ], [ 6, “Cowl”, 1195.00 ], [ 3, “Boots”, 395.00 ], [ 1, “Batwing”, 697199.00 ]
]
![Page 245: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/245.jpg)
配列のネストlineItem
lineItem[1][
[ 4, “Cape”, 699.00 ], [ 6, “Cowl”, 1195.00 ], [ 3, “Boots”, 395.00 ], [ 1, “Batwing”, 697199.00 ]
]lineItem[1][2]
![Page 246: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/246.jpg)
オブジェクトのネスト
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
![Page 247: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/247.jpg)
オブジェクトのネスト
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
![Page 248: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/248.jpg)
オブジェクトのネストinvoice
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
![Page 249: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/249.jpg)
オブジェクトのネスト
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
invoice.lineItem
invoice
![Page 250: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/250.jpg)
オブジェクトのネスト
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
invoice
invoice.lineItem[1]
invoice.lineItem
![Page 251: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/251.jpg)
オブジェクトのネスト
{ “number” : “37584”, “customerID” : “1690”, “customerName” : “Bruce Wayne”, “subtotal” : 708350.00, “salesTax” : 63751.50, “total” : 772101.50, “lineItem” : [ {“qty”:4, “desc”:”Cape”, “price”:699.00}, {“qty”:6, “desc”:”Cowl”, “price”:1195.00}, {“qty”:3, “desc”:”Boots”, “price”:395.00}, {“qty”:1, “desc”:”Batwing”, “price”:697199.00} ]}
invoice
invoice.lineItem[1]
invoice.lineItem[1].descinvoice.lineItem
![Page 252: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/252.jpg)
function selectContact(ContactId){! $.getJSON('data', 'id='+ContactId, function(data){! ! ! $("#contactId").val(data.contactId);! $("#firstName").val(data.firstName);! $("#lastName").val(data.lastName);! $("#email").val(data.email);! $("#mobilePhone").val(data.mobilePhone);! ! ! })! return true;}
JSON
WebFolder/js/contact-mobile.js
![Page 253: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/253.jpg)
function selectContact(ContactId){! $.getJSON('data', 'id='+ContactId, function(data){! ! ! $("#contactId").val(data.contactId);! $("#firstName").val(data.firstName);! $("#lastName").val(data.lastName);! $("#email").val(data.email);! $("#mobilePhone").val(data.mobilePhone);! ! ! })! return true;}
JSON
WebFolder/js/contact-mobile.js
![Page 254: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/254.jpg)
C_TEXT($1;$2;$3;$4;$5;$6)
$request:=$1
Case of : ($request="/Contacts/data?id=@")
ARRAY TEXT($names;0) ARRAY TEXT($values;0) WEB GET VARIABLES($names;$values)
$i:=Find in array($names;"id")
If ($i#-1) QUERY([Contacts];[Contacts]id=$values{$i}) w_sendFile ("contact.json") End if
End case
JSON
On Web Connection
![Page 255: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/255.jpg)
C_TEXT($1;$2;$3;$4;$5;$6)
$request:=$1
Case of : ($request="/Contacts/data?id=@")
ARRAY TEXT($names;0) ARRAY TEXT($values;0) WEB GET VARIABLES($names;$values)
$i:=Find in array($names;"id")
If ($i#-1) QUERY([Contacts];[Contacts]id=$values{$i}) w_sendFile ("contact.json") End if
End case
JSON
On Web Connection
![Page 256: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/256.jpg)
{! "contactId":"<!--4DTEXT w_escapeText([Contacts]id)-->",! "firstName":"<!--4DTEXT w_escapeText([Contacts]firstName)-->",! "lastName":"<!--4DTEXT w_escapeText([Contacts]lastName)-->",! "email":"<!--4DTEXT w_escapeText([Contacts]email)-->",! "mobilePhone":"<!--4DTEXT w_escapeText([Contacts]mobilePhone)-->"}
JSON
Resources/json/contact.html
![Page 257: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/257.jpg)
function saveContact(){! $.post('data/update', $("#contactForm").serialize(), function(data){! ! loadContacts();! ! })}
JSON
WebFolder/js/contact-mobile.js
![Page 258: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/258.jpg)
function saveContact(){! $.post('data/update', $("#contactForm").serialize(), function(data){! ! loadContacts();! ! })}
JSON
WebFolder/js/contact-mobile.js
![Page 259: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/259.jpg)
C_BOOLEAN($0;$isPost)
ARRAY TEXT($headerNames;0)ARRAY TEXT($headerValues;0)WEB GET HTTP HEADER($headerNames;$headerValues)
C_LONGINT($i)
$i:=Find in array($headerNames;"X-METHOD")$isPost:=False
If ($i#-1) $isPost:=($headerValues{$i}="POST") $i:=Find in array($headerNames;"X-METHOD-OVERRIDE") If ($i#-1) $isPost:=False End if End if
$0:=$isPost
まとめ
w_isPost
![Page 260: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/260.jpg)
C_BOOLEAN($0;$isPost)
ARRAY TEXT($headerNames;0)ARRAY TEXT($headerValues;0)WEB GET HTTP HEADER($headerNames;$headerValues)
C_LONGINT($i)
$i:=Find in array($headerNames;"X-METHOD")$isPost:=False
If ($i#-1) $isPost:=($headerValues{$i}="POST") $i:=Find in array($headerNames;"X-METHOD-OVERRIDE") If ($i#-1) $isPost:=False End if End if
$0:=$isPost
まとめ
w_isPost
![Page 261: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/261.jpg)
C_BOOLEAN($0;$isPost)
ARRAY TEXT($headerNames;0)ARRAY TEXT($headerValues;0)WEB GET HTTP HEADER($headerNames;$headerValues)
C_LONGINT($i)
$i:=Find in array($headerNames;"X-METHOD")$isPost:=False
If ($i#-1) $isPost:=($headerValues{$i}="POST") $i:=Find in array($headerNames;"X-METHOD-OVERRIDE") If ($i#-1) $isPost:=False End if End if
$0:=$isPost
まとめ
w_isPost
![Page 262: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/262.jpg)
C_TEXT($1;$2;$3;$4;$5;$6)
$request:=$1
Case of : ($request="/Contacts/")
Contacts_Send_page
: ($request="/Contacts/data")
Contacts_Send_all
: ($request="/Contacts/data?id=@")
Contacts_Send_1
: ($request="/Contacts/data/update")
Contacts_Update
End case
まとめ
On Web Connection
![Page 263: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/263.jpg)
C_DATE($1;$date)C_TIME($2;$time)C_TEXT($0)
If (Count parameters>0) $date:=$1 If (Count parameters>1) $time:=$2 Else $time:=Current time End if Else $date:=Current date $time:=Current timeEnd if
$0:=String($date;ISO Date GMT;$time)
w_escapeDate
データオブジェクトの作成
![Page 264: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/264.jpg)
C_DATE($1;$date)C_TIME($2;$time)C_TEXT($0)
If (Count parameters>0) $date:=$1 If (Count parameters>1) $time:=$2 Else $time:=Current time End if Else $date:=Current date $time:=Current timeEnd if
$0:=String($date;ISO Date GMT;$time)
w_escapeDate
データオブジェクトの作成
![Page 265: Web Basics 2013-01-10](https://reader038.fdocument.pub/reader038/viewer/2022102707/55d4c815bb61eb497c8b4757/html5/thumbnails/265.jpg)
Webセミナー
終