超便利!jQueryでJSONデータを解析し、HTMLに表示する/後編 jQuery2013年7月31日 前の記事でご紹介したJSONについて、以下の3パターンの実装例を元に解説していきます。 js中に記述されたJSONデータからHTMLに表示 外部ファイルのJSONデータからHTMLに表示 JSONPで外部ファイルのJSONデータからHTMLに表示 1.js中に記述されたJSONデータからHTMLに表示 まずJSON+jsの全体図をつかめるよう、活用する場面はあまりありませんが、jsの中にJSONデータを記述した例を紹介します。 実際のサンプル HTML <table cellpadding="0" cellspacing="0" border="0" class="tbl"> <col width="15%" /> <col width="15%" /> <col width="70%
(Last Updated On: 2023年12月8日) 追記:最近のOWASPガイドの更新でJavaScript文字列はUnicodeエンコードで安全性を確保するよう変更されました。元々このブログでもUnicodeエスケープのまま利用するように書いています。他の言語のユーザーはUnicodeエスケープを利用しましょう。PHPもASCII領域の文字をUnicodeエスケープするようにした方が良いと思います。これは提案して実現するように努力します。 JSONはJavaScriptのオブジェクトや配列を表現する方式でRFC 4627で定義されています。メディアタイプはapplication/json、ファイル拡張子はjsonと定義されています。 PHPにJSON形式のデータに変換するjson_encode関数とjson_decode関数をサポートしています。 JSON関数がサポートされている
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
「JSON」(ジェイソン)は、軽量のデータ記述フォーマットとして、さまざまなソフトウェア間でのデータ交換で広く使われています。 もともとJSONはJavaScriptのオブジェクト表記法をベースにDouglas Crockford氏が2001年頃に“発見”し(Crockford氏自身が「JSONはそれ以前から存在しており、私は発見しただけだ」と主張している)、命名。2002年にCrockford氏が作成したWebサイトjson.orgで仕様が公開されました。 当時はデータ交換フォーマットとしてXMLが主流になると見られていましたが、軽量で記述や解析が容易なJSONは現在、XML以上に広く使われるデータフォーマットになっています。 そのJSONが、JavaScriptの標準化団体でもあるECMA Internationalで標準化され、仕様文書が「ECMA-404」として公開されたと、Dou
WebアプリケーションにおいてJSONを用いてブラウザ - サーバ間でデータのやり取りを行うことはもはや普通のことですが、このときJSON内に第三者に漏れては困る機密情報が含まれる場合は、必ず X-Content-Type-Options: nosniff レスポンスヘッダをつけるようにしましょう(むしろ機密情報かどうかに関わらず、全てのコンテンツにつけるほうがよい。関連:X-Content-Type-Options: nosniff つかわないやつは死ねばいいのに! - 葉っぱ日記)。 例えば、機密情報を含む以下のようなJSON配列を返すリソース(http://example.jp/target.json)があったとします。 [ "secret", "data", "is", "here" ] 攻撃者は罠ページを作成し、以下のようにJSON配列をvbscriptとして読み込みます。もちろ
jQuery.ganttViewはjQuery製のガントチャート表示ライブラリです。 jQueryを使ってガントチャートを表示するライブラリがjQuery.ganttViewです。表示だけでなくデータのメンテナンスもできるようになっています。 いい感じにガントチャートが表示されています。 ドラッグでタスクを左右に移動させられます。 期間の変更は枠の端をドラッグします。 データはJSONで与えるだけです。 jQuery.ganttViewは表示系のライブラリなのでデータベースに蓄積された内容をガントチャートにして表示すると言った使い方が便利そうです。なお表示はタスクごとに横に表示される形で、複数のタスクを同一線上に表示することはできないようです。 jQuery.ganttViewはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。 MOONGI
JSON (JavaScript Object Notation)は、軽量のデータ交換フォーマットです。人間にとって読み書きが容易で、マシンにとっても簡単にパースや生成を行なえる形式です。 JavaScriptプログラミング言語 (ECMA-262標準第3版 1999年12月)の一部をベースに作られています。 JSONは完全に言語から独立したテキスト形式ですが、C、C++、C#、Java、JavaScript、Perl、Python、その他多くのCファミリーの言語を使用するプログラマにとっては、馴染み深い規約が使われています。これらの性質が、 JSONを理想的なデータ交換言語にしています。 JSONは2つの構造を基にしています。 名前/値のペアの集まり。様々な言語で、これはオブジェクト、レコード、構造体、ディクショナリ、ハッシュテーブル、キーのあるリスト、連想配列として実現されています。
JSON(ジェイソン、JavaScript Object Notation)はデータ記述言語の1つである。軽量なテキストベースのデータ交換用フォーマットでありプログラミング言語を問わず利用できる[1]。名称と構文はJavaScriptにおけるオブジェクトの表記法に由来する。 JSONはウェブブラウザなどでよく使われているECMA-262, revision 3準拠のJavaScript[2] (ECMAScript) をベースとしている。2006年7月にRFC 4627で仕様が規定され、その後、何度か改定され、2017年12月14日[3]にIETF STD 90およびRFC 8259およびECMA-404 2nd editionが発表された。MIMEタイプは application/json、拡張子はjsonとされた。 IETFおよびECMAおよびISOの仕様の改定の歴史 2006年7月
Ajaxなアプリケーションにおいて、サーバからJSONを返す場合に、JSON自体はvalidであるにも関わらず、(IEの都合で)エスケープが不足していて脆弱性につながってる場合があるので、書いておきます。 発生するかもしれない脆弱性 JSONのエスケープが不足している場合に発生する可能性のある脆弱性は以下の通りです。 JSON内に含まれる機密情報の漏えい XSS それぞれの詳細については後述します。 開発側でやるべきこと 文字列中のUnicode文字は "\uXXXX" な形式にエスケープするとともに、ASCIIな範囲であっても「/」「<」「>」「+」も同様にエスケープすることにより、前述の脆弱性を防ぐことができます。 Perlであれば、以下のような感じになります。JSON->ascii(1) に続けて、JSON文字列を正規表現で置換しているあたりがキモになります。 use utf8; u
JSONViewを知らない人が社内でいっぱいいたので、これは宣伝すると他にも幸せになれる人がたくさん居るだろう、ということで宣伝してみる。 近年、JSON形式でウェブAPIを作成する機会が増えてきた。しかし、JSONで出力された場合、日本語の文字列はエスケープされる実装が多く(仕様的にはエスケープしてもしなくてもどっちでもいい)、結果を目視で確認することができなくて困るということがよくある。 そのため、JSON APIをたたいてパースして出力するだけのスクリプトをわざわざRubyで書く、というようなことを繰り返していた(前に書いたスクリプトを探すよりも新しく書いたほうが早いのだが、それでもAPIを調べ直したりで3分ぐらいはかかる)のだが、JSONViewという拡張を使うことで、ブラウザ上でのJSONを、XML風に見やすく整形してくれることがわかった。以下のスクリーンショットに、JSONVi
Copyright © 2004-2025 Impress Corporation. An Impress Group Company. All rights reserved.
System.Json 名前空間内のクラスを使えばいい。下記は JSON オブジェクトを扱うサンプル。 string json = "{ \"id\": 1, \"name\": \"sample\" }"; JsonObject value = (JsonObject)JsonObject.Parse(json); var message = new StringBuilder(); foreach (var key in value.Keys) { message.AppendFormat("key:{0}, value:{1}", key, value[key]); message.AppendLine(); } MessageBox.Show(message.ToString()); 配列を扱うときはこんな感じ。 string json = "[{ \"id\": 1, \"nam
JSONはブラウザベースでのデータのやり取りだけではなく、XMLに比べると冗長性が低くシンプルなフォーマットであることもあってサーバサイドでのデータのやり取りにも利用されるようになっている。下手にフィードを解釈するよりも手軽で良い。 JSONにスキーマを適用する とは言え、場合によってはデータの型や検証と言った手法が必要になることもあるだろう。そのために使うのがJSON Schemaだ。 今回紹介するオープンソース・ソフトウェアはJSON Schema、JSONのスキーマ定義を検証するライブラリだ。 JSON Schema自体は現在仕様が固められている最中のようだ。文字列、数値、真偽、オブジェクト、配列などの型が用意されており、こちらもまたJSONを使って定義をする。シンプルなデータ授受にJSONを利用しつつ、多少検証のステップを入れたいと言った場合に使えるかもしれない。 検証用スクリプト
Why JSON Schema?While JSON is probably the most popular format for exchanging data, JSON Schema is the vocabulary that enables JSON data consistency, validity, and interoperability at scale. Streamline testing and validationSimplify your validation logic to reduce your code’s complexity and save time on development. Define constraints for your data structures to catch and prevent errors, inconsist
JSON(http://www.json.org/)データはけっこうよく使うので、何度か話題にしたことがあります(例えば「もう一度、ちゃんとJSON入門」)。でも、JSONには型情報/メタ情報が付けられないのがとても不満で、JSON改なんてもんを考えたこともありました。(後でXIONに改名) JSONデータに対するスキーマ定義の仕様がかたまりつつあることを、ごく最近になって知りました。 http://json-schema.org/ JSON本体はRFC 4627になっていますが、JSONスキーマの標準化のステータスは、あまりハッキリとは分かりません(僕には)。http://groups.google.com/group/json-schema?pli=1 を覗き見した感じでは、現状ワーキングドラフトという位置付けらしいです。 なかなか面白いし役に立ちそうなので紹介します。ただし、僕にとっ
JSONとは何か? JSONとはJavaScript Object Notationの略で、XMLなどと同様のテキストベースのデータフォーマットです。 その名前の由来の通りJSONはJavaScriptのオブジェクト表記構文のサブセットとなっており、XMLと比べると簡潔に構造化されたデータを記述することができるため、記述が容易で人間が理解しやすいデータフォーマットと言えます。 なお、JSONは2006年に「RFC 4627(http://www.rfc-editor.org/rfc/rfc4627.txt)」として公開されています。 例としてXMLとJSONで同じデータを記述したものをリスト1とリスト2に示します(図1)。 リスト1のXMLではすべての情報をタグで囲んだテキストノードとして記述していますが、XMLでデータを表現する場合、データの記述方法として属性とテキストノードの使い分けが
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く