ジオプラス：たった独りのIT革命：SSブログ

	ブログをはじめるログイン

ジオプラスでAjaxできた　 [ジオプラス]

前回述べたようにジオプラスではコンテンツとCGIのURLのドメインが異なるため、通常でクロスドメイン問題が発生しています。

●コンテンツ(HTML)

http://www.skillworker.net/

●CGI(Perl、PHP)

http://cgi.skillworker.net/

そのため、通常ではAjaxを用いてサーバ側のCGIを動かすことが出来ません。ところが、CGI用のドメインを用いてもコンテンツを表示させることが出来ます。そうするとドメインが同じcgi～になるので、クロスドメインとならないのです。

現在のところは、この方法しかないですね。

Ajax(prototype.js)-PHP-SQliteを使用したサンプルです。ラジオボタンとリストボックスがまだうまく動きませんね。

http://cgi.skillworker.net/test/sqlite/umesyu.html

タグ：ジオプラス Ajax クロスドメイン別ドメイン

2010-06-24 12:57 nice!(0) コメント(0) トラックバック(0)
共通テーマ：日記・雑感

ジオプラスでAjaxは鬼門　 [ジオプラス]

こんにちわ。ジオプラスでAjaxサンプル作成中にハマっています。prototype.jsを使用するとブラウザを意識せずにHTTPリクエストを送信できるのですが、そのHTTPリクエストが送信されません。

Prototype.jsは、Sam Stephenson氏を中心とするチームによって開発されているAjax対応JavaScriptライブラリです。

調べてみたところ、IEではAjaxを用いた通信を行うと、GETメソッドの場合一度実行されるとデータがキャッシュされて、2回目以降の通信はそのキャッシュされたデータを読みに行くようになってしまいます。

この回避方法ですが、HTTPレスポンスに対してブラウザがキャッシュしないよう以下のようなレスポンスヘッダを返してあげなければいけません。

header("Cache-Control:no-cache, no-store");
header("Pragma:no-cache");

しかし、これだけでもまだHTTPリクエストが送信されません。HTTPリクエスト側で何か対応しなければいけないようです。対応方法は２つあります。

①HTTPリクエストヘッダに'If-Modified-Since'を付加する。
②GETメソッドで取得する先のURLにユニークIDを付加する。

実際のソースコードは以下になります。

しかし、まだまだダメです。FireFoxではOPTIONリクエストが送信されますが、IEはウンともスンとも言いません。
なぜFireFoxではOPTIONメソッドが送信されるのでしょうか？本来はGETメソッドのはずです。FireFoxでは、仕様で一旦HTTPメソッドOPTIONSでApacheに問い合わせ、クロスドメイン通信が許可されているかを確認してからGETメソッド等で実際の通信を行なうようになっているようです。しかし、その後GETメソッドが送信されていませんのでAjaxができません。

そう、ジオプラスではコンテンツとCGIのURLのドメインが異なるため、クロスドメイン問題が発生しているのです。

●コンテンツ(HTML)

http://www.skillworker.net/

●CGI(Perl、PHP)

http://cgi.skillworker.net/

ちなみにJSONPを使ってみましたが、同じ結果です。最近のブラウザではセキュリティが強化されているようです。セキュリティの設定を変えればよいのかもしれませんが、サイトに来てくれるユーザに設定変更させるわけにはいきません。というよりしてくれません。

JSON with paddingの略

Javascriptの非同期通信でよく使われるXMLHttpRequest オブジェクトにはSame-Originポリシーが存在し、クロスドメインアクセスができない。

一方，script タグを用いると，ドメインの異なるサーバに置いているスクリプトファイルを読み込むことができる。この仕組みを利用し、scriptタグのsrcに、データを取得できるAPIのURLを指定し，ドメインの異なるサーバからデータを取得する仕組みの総称として、JSOPという言葉が使われる。JSONP用のAPIでは、関数名＋取得データをjson形式で表記して引数とした形式(例.callbackFunc({id:1000,name:aaa}))のレスポンスが一般的で、APIから返されるコールバック関数と同じ名前の関数(callbackFunc(jsonData))をクライアント側で定義しておけば、データを読み込んだ際にそのコールバック関数が実行される。動的にscriptのDOMを生成することで、非同期でデータが取得できるようになる。

とりあえず、ジオプラス内でもAjaxが動くように対応中です。次回には対策を紹介したいと思います。あー大変。

タグ：ジオプラス Ajax Firefox キャッシュクロスドメイン別ドメイン JSONP JavaScript option Get

2010-06-20 16:18 nice!(0) コメント(0) トラックバック(0)

ジオプラスでJSON　[ジオプラス]

Yahoo! UI LibraryやScript.aculo.usの使用法を勉強し紹介してきました。
そろそろ本格的にAjaxに入ろうとしていたところ、またまた問題発生です。

現在以下の書籍で勉強中です。
10日でおぼえるAjax 入門教室
Ajaxでサーバと通信するためJSON形式でデータを扱いたいのですが、json_encode()はPHP5.2から標準になったそうです。
私の使っているジオプラスはPHP5.1.4なのです。

どうりで、JavaScriptからAjaxが出来ないわけです。

そこで、またまた調べてみました。

●PEAR::Services_JSON
ダウンロード(http://mike.teczno.com/JSON.tar.gz)

ジオプラスの場合は、
/geo_cgi_private/JSON.php
に配置します。

使い方は簡単です。

<?php
define( 'MYSMARTY_DIR', '/geo_cgi_private/' );
require_once ( MYSMARTY_DIR .'JSON.php' );

$arr = array(
    array(
        "name" => "データ1",
        "url"  => "URL１"
    ),
    array(
        "name" => "データ２",
        "url"  => "URL2"
    )
);

$json = new Services_JSON;
$encode = $json->encode($arr);
header("Content-Type: text/javascript; charset=utf-8");
echo $encode;
?>