Ajax - Goodbye, JSONP. Hello, Access-Control-Allow-Origin : 404 Blog Not Found
2010年08月17日06:45 カテゴリLightweight Languages Ajax - Goodbye, JSONP. Hello, Access-Control-Allow-Origin もうそろそろJSONPとはお別れできるのではないかと思い立ったので。 XMLHttpRequestとその問題 AjaxといえばXHRの愛称で親しまれているXMLHttpRequestですが、これには一つ重大な欠点がありました。 これを発行するDHTMLページのドメインが、Request先のドメインと一致する必要があったのです。いわゆる Same Origin Policy というやつです。おかげでサイトをまたがって使えなかったのです。これではマッシュアップできない。どうしよう。 JSONPとその問題 そこで生まれたのが、JSONPという手法です。 これは、scriptノードを追加した時に、単
MOONGIFT: » 圧巻！AJAX DHTMLのグラフライブラリ「Timeplot」:オープンソースを毎日紹介
グラフを作るニーズは多い。また、そのためのライブラリも多種多様に存在している。PHPやJavaなどのプログラム言語によるもの、JavaScriptで作るもの、Flashで作るものといった具合だ。 その中にあって、これの完成度は非常に高い。まさに圧倒されてしまう綺麗さだ。 今回紹介するオープンソース・ソフトウェアはTimeplot、AJAX+DHTMLで作られたグラフ作成ライブラリだ。 Timeplotは単純な二次元の折れ線グラフ用のライブラリで、非常に細かく描画が行われる。特にグラフの上をマウスでなぞった時に各数値が表示されるのが素晴らしい。 同じプロジェクトの年表を作り出すTimeline形式をサポートしている。場合によって使い分けたり、見せ方を変えたりと便利に使えそうだ。グラフに備考をつけることもでき、特定の場所をクリックすると説明文が表示される。 サンプルは数多く登録されているので、
フォームの入力値をリアルタイムにバリデーション「Realtime validation」:phpspot開発日誌
Realtime validation using Ajax Ajaxなどを駆使して、入力値を動的にチェックするライブラリ、realtime validation を公開しました。 >> http://masuidrive.jp/validation 正規表現とメッセージを指定するだけで、入力した瞬間にユーザに対してガイドメッセージを表示させる事ができ、今までの様に画面遷移後にエラーが出て、ユーザがエラー位置を把握しづらいと言う事がありません。 フォームの入力値をリアルタイムにバリデーション「Realtime validation」。 prototype.js と、配布している validate.js を読み込んだあと次のようなコードを書くだけ。 Validator.register({ "#mail" : { "/^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2
【ハウツー】クールなスライドショーもJavaScriptで簡単! - Smooth SlideShow Library (1) なにはともあれAjax? (MYCOMジャーナル)
"Ajaxian.com 2006 Survey Results" の調査結果や "The State of Web Development 2006/2007 (Results Preview)" の調査結果を見るに、今後のWebアプリケーション開発において採用する技術としてAjaxの活用は大きな流になりそうだ。Prototype、Script.aculo.us、Dojo、DWR、Moo.fxといったAjaxフレームワークをベースとして採用し、ここに各種パーツを追加したり、別途独自開発したりということが多い。 ここではPrototypeとMoo.fxをベースにして開発されてきたスライドショーライブラリ「Smooth SlideShow Library」を取りあげたい(注: 現在はmootoolsベース)。どの程度の工程で機能を実現できるのか参考になれば幸いである。
IT戦記 - FireBug の新しいバージョンが便利すぎる件について
FireFox の拡張機能 FireBug を更新したらすごいことになっていたので共有します。 まずこれを見てください http://Sample.ECMAScript.jp/20060331.html ぱっと見の機能 HTML のソースを見ながら、属性値を直接編集できる。 影響のある CSS を即時に表示 レイアウト情報を即時に表示 インスペクト中の要素に浮上したイベントをキャプチャ インスペクト中の要素の JavaScript オブジェクトを表示 Ajax レスポンスのヘッダも確認できるようになった。 FireBug のインストール https://addons.mozilla.org/extensions/moreinfo.php?application=firefox&id=1843
ウノウラボ Unoh Labs: Dojoで簡単にクロスドメインAjaxを実現
こんにちわ、hideです。 最近、JavaScriptライブラリのDojoを使い初めて、その便利さに目覚めてしまいました。Ajaxで使用される通常のXMLHttpRequestではセキュリティ上の理由から、現在表示しているページ以外のドメインに対してリクエストを送ることができません。そこで考え出されたのが、JSONP(JSON with padding)という方法です。JavaScriptのインクルードは、同一ドメインでなくても読み込めるという性質を利用しています。 まずは下のボタンを押してみてください。実際にYahoo!から画像検索が実行されます。サーバを介さずにブラウザから直接Yahoo!APIを呼び出しているところがポイントです。 簡単に説明するとこういう仕組みです。次のようにリクエスト時のパラメータとして、callback関数を指定します。 http://example.c
あるＳＥのつぶやき: Ajax開発支援ツールまとめ
Ajax開発支援ツールをまとめておきます。 | コーディング | ブラウザ | テスト | デザイン | JSツール | 画像 | リファレンス | | チートシート | JSお勉強 | リンク | 編集履歴 | ・コーディング支援ツール ↑TOP aptana eclipseのプラグインのJS,CSS,HTML,XML,PHP,AIR等のエディタ コード補完機能やJavaScriptのクラスの階層表示もサポート 解説記事1 ，解説記事2，正式版情報 JSEclipse Adobe提供のecliseプラグイン。こちらも参照 コード補完機能や、オープンソースライブラリもサポート Spket IDE eclipseプラグインのJavaScript,XMLエディタ XUL/XBL,SVG,Lzszlo,Yahoo! Widgetをサポート Googlipse Google Web Tookit用
JavaをJavaScriptに変換するグーグルのツールを使ってみよう ― ＠IT
米グーグルが発表したGoogle Web Toolkit。Java言語で作成したクライアントアプリケーションを、JavaScript＋HTMLアプリケーションに変換するという、まったく異なるアプローチを持つAJAXアプリ開発ツールだ。簡単なサンプルを動かしてみよう（編集部） 2006年5月17日、米国Googleが、Google Web Toolkitをリリースしました。早速Webサイトを見ると、『Google Web Toolkit - Build AJAX apps in the Java language』（＝Java言語でAJAXアプリを造る）という、Java開発者にとって非常に刺激的なキャッチで始まっています。 これまでも、BACKBASE Java Edition、ICESOFT ICEFACES、Nexaweb などAJAX＋Javaでの開発に対応するフレームワーク製品または
我的春秋: 続 JavaScript ソースが HTML から消える日
なんか、はてなブックマーク経由で、突然、昔のエントリー（JavaScript ソースが HTML から消える日）にアクセスが集中しているのに気づいて、急遽、フォローアップ エントリーをアップすることにしました。あのエントリーを書いてからまだ半年ですけど、あの時点で僕が気づいていなかったことも幾つかありましたし、何より状況が随分変化してます。 手みじかにおさらいしておくと、「JavaScript ソースが HTML から消える日」で紹介したのは、Ben Nolan 氏が開発した behaviour.js という JavaScript ライブラリです。このライブラリは、関数の実行場所を、外部 js ファイル内で CSS セレクタを使って指定することができ、これによって従来 HTML 中に埋め込んでいたイベントハンドラ部分も含め、文書構造（document structure → HTML の役
我的春秋: JavaScript ソースが HTML から消える日
［2006-06-10 付記］このエントリーは、2006-01-05 時点のもので情報が古くなってます。現時点で把握している最新情報を「続 JavaScript ソースが HTML から消える日」にアップしましたので、あわせてご参照ください。 Behaviour.js ― JavaScript ソースを (X)HTML から完全分離できるライブラリ 昨日、職場の同僚の人がたまたま見つけた JavaScript ライブラリを教えていただたんですけど、これがもうびっくり！なんと、このライブラリがあれば、イベントハンドラーも含めて JavaScript ソースが (X)HTML の body 内から、ほぼ完全に分離できてしまいます！ しかも、HTML 内で JavaScript 関数を適用する場所は、なんと JavaScript ソース内に CSS セレクタを書き込むことで指定！あまり日本では取
Google Web Toolkit - yojikのlog
多分Gmailとかで使われてそうなフレームワーク*1。 http://code.google.com/webtoolkit/ これすごい。逆転の発想だなー。 Javaで作ったウィジェットのソースをJavaScriptにコンパイルする事によってリッチなAjaxアプリを作る。実行は、JavaScriptで作られたJREエミュレーション用ランタイムを使って、クライアントのブラウザ上で行う。 開発時は「hosted mode」で開発する。このモードではコンパイルせずにJavaネイティブ(変な言い方)で実行することによって、デバッキングなどJavaのIDEのパワーをうまく生かした開発ができる。このモードのとき、GWTはAWTとかSwing上でブラウザをエミュレートするのではなく、埋め込みブラウザ*2と連携する。つまり埋め込みブラウザ側で画面表示やイベントのハンドリング等を実行する。Javaとブラウザ
gooサポーター - gooの歩き方: GOC Vol.1 「Ajaxアプリをより便利にする10のテクニック」
GoogleMapsでの採用以降、一気にインターネットの世界に広がった「Ajax」。元々は「Asynchronous JavaScript + XML」の略称で、JavaScript の組み込みクラスである XMLHttpRequest による非同期通信を利用して、ウェブブラウザ上で各種のユーザーフレンドリーなインタフェースを実現するための技術です。 第1回目のgooオープンカンファレンスでは「すでにプログラミング実務に携わっているがAjaxを学ぶのは初めて」という技術者の方を対象に、１０の具体的な技法をご紹介します。比較的大規模なAjaxアプリ開発に興味のある方に向く講座です。 ●当日の講座資料をアップしました。 こちらから ダウンロードできます ●GOC Vol.1『中堅プログラマー向け「Ajax」講座』−Ajaxアプリをより便利にする10のテクニック ■プログラム ・ユー
presentacular - Adding effects to S5 with script.aculo.us
Presentacular Presentacular adds script.aculo.us visual effects to slide shows created with S5. It has the same advantages than S5 for creating slide shows: printer-friendly version, simple and semantic markup and portable across the most modern browsers. Adding effects First of all you’ll have to create an S5 slide show. If you are new to S5, A Basic Primer in Using S5 can be useful to you. Next,
CodeZine：プロトタイプ（prototype）によるJavaScriptのオブジェクト指向（プロトタイプ, オブジェクト, Javascript, ECMASCript）
はじめに JavaScriptはオブジェクト指向言語です。しかし、そのオブジェクトの性質は、他に良く知られているオブジェクト指向言語のJavaやC++と大きく異なっています。 そこでこの記事では、なぜそのような違いがあるのか、JavaScriptにおけるオブジェクト指向の言語思想を見ていくと共に、その違いの根幹であるプロトタイプについて解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて
script.aculo.us - web 2.0 javascript
This is a bugfix release that bumps script.aculo.us to version 1.9.0. Most importantly, the included Prototype 1.7 provides performance and compatibility improvements with the latest browsers. One other fix is includes, that makes the script.aculo.us loader work better if you use script tags in the BODY of your page. Download at http://script.aculo.us/, or grab/fork the source at http://github.com
prototype.js v1.5.0 の使い方
それは何？ prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。 この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。 もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。 私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。 自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。 加えて、このライブラリによって提供されているオブジェクト、クラス、関数、拡張機能についての 非公式リファレンス も提供しています。 ここで提供する例とリファレンス
サイドメニューの折りたたみ（v5.0：ゆっくり折りたたむ）
Google Mapsや Googleサジェスト で一躍有名になった Ajax（Asynchronous JavaScript+XML：エイジャックス） ですが、Ajax用JavaScriptライブラリを利用してサイドメニューをゆっくり折りたためるようにしてみました。 公開テンプレートを用いたサンプルを作りましたので、実際の折りたたみ動作をご確認ください。固定3カラム・可変3カラムを右上のリンクで切り替えられるようにしています。 ゆっくり折りたたむサンプル 本カスタマイズで参考にさせていただいたのは下記のサイトです。ありがとうございました。 Ogawa::Memoranda："Subscribe with Feedbringer" Bookmarklet （FEEDBRINGERを知るきっかけ） FEEDBRINGER nekobara カルゴルニア・ジョン：Ajaxサンプル with G
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JSON-RPC
IBM jQuery を使って Ajax 開発を単純化する - Japan
Technologies for UI