Ajaxで表示させると内容が不変

このQ&Aのポイント
  • Ajaxを使用して表示させると、内容が変わらない問題が発生しています。
  • test.txtの内容を変更しても、ブラウザのキャッシュをクリアしない限り、表示される内容は変わりません。
  • キャッシュ無効のヘッダを付けても同様の問題が発生します。解決方法を教えてください。
回答を見る
  • ベストアンサー

Ajaxで表示させると内容が不変

下記Ajaxでtest.txtを表示できたのですが test.txtの内容を Hello Japan. 変えてもブラウザのキャッシュをクリアしない限り Hello World! が出つづけます。 下記ページにキャッシュ無効のヘッダをつけても同じです。 子の問題を解決する手段を教えてください。 test.txt: Hello World! x.html: <script> var xmlHttp; function loadText() {  if (window.XMLHttpRequest)  {   xmlHttp = new XMLHttpRequest();  }  else  {   if (window.ActiveXObject)   {    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   }   else   {    xmlHttp = null;   }  }  xmlHttp.onreadystatechange = checkStatus;  xmlHttp.open("GET","test.txt",true); xmlHttp.send(null); } function checkStatus() { if (xmlHttp.readyState==4&&xmlHttp.status==200) { var node = document.getElementById("disp"); node.innerHTML = xmlHttp.responseText; } } </script> <form> <input type="button" value="push" onClick="loadText()"> </form> <div id="disp"></div>

  • reiman
  • お礼率73% (794/1076)

質問者が選んだベストアンサー

  • ベストアンサー
  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.1

アクセスするファイル名を毎回変えるとキャッシュ防止になると思います。 例) 'test.txt' ↓「?時間」をファイル名にくっつける 'test.txt'+'?'+(new Date()).getTime()

reiman
質問者

お礼

ありがとうございます。 やってみます。

関連するQ&A

  • Ajaxでデータベース(PostgreSQL)

    を非同期で読み込むことができるでしょうか? ファイルならば下記のようにすれば良いみたいですが データベースの場合のやり方がわかりません。 PostgreSQLのデータを読み込むにはどうしたら良いのでしょうか? <script> var xmlHttp; function loadText() { if (window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } else { if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { xmlHttp = null; } } xmlHttp.onreadystatechange=checkStatus; xmlHttp.open("GET","plan.txt",true); xmlHttp.send(null); } function checkStatus() { if(xmlHttp.readyState==4 && xmlHttp.status==200) { alert(xmlHttp.responseText); } } </script> <form> <input type="button" value="read file" onClick="loadText()"> </form>

  • javascriptで困っています。教えてください

    以下のようにjavascriptの内容を書いた外部のテキストファイルを読み込んで、実行しようとしているのですが、うまくいきません。普通にjavascriptを読み込むのは分かっているのですが、このような方法ができないのでしょうか?よろしくお願いします。 <!doctype html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> </head> <body> <div id="jsbox"></div> <script type="text/javascript"> var jsbox = document.getElementById("jsbox"); //非同期通信///////////////////////////////////////////// var xmlHttp; loadText(); function loadText(){ if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }else{ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = null; } } xmlHttp.onreadystatechange = checkStatus; xmlHttp.open("GET", "http://xxxxxxxxxxxx/js_test.txt", true); xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var str = xmlHttp.responseText;alert(str); jsbox.innerHTML = str; test_js(); } } ///////////////////////////////////////////////////////////////// </script> </body> </html> テキストファイルをhttp://xxxxxxxxxxxx/js_test.txtに置き、テキストファイルの内容が <script type="text/javascript"> function test_js(){ alert("test"); } </script>

  • AJAXでサイト存在チェック時、スクリプトエラー

    AJAXを使用し、遷移したいサイトが存在する場合、その際サイトに遷移し、存在しない場合は、ほかのサイトに遷移するという処理を行いたいのですが、スクリプトエラーが発生しまい困っています。 遷移先をローカルサーバのリンクを指定するとうまくいくのですが、外部サーバのアドレスを指定するとエラーになってしまいます・・。何か制約があるのでしょうか? また、ほかの方法で実現できるのであれば、教えてください。 現在記述しているソースの一部を下記に添付します。 <script language="JavaScript" type="text/JavaScript"> <!-- function fucXMLHttpRequest(){ /* XMLHttpRequestオブジェクト作成 */ var xmlhttp = createXmlHttp(); xmlhttp.onreadystatechange = handleHttpEvent; function handleHttpEvent(){ if (xmlhttp.readyState == 4) { if (xmlhttp.status == 200) {       window.open("http://www.inte.co.jp/xxxx/xxxx"); } else { window.open("http://www.inte.co.jp/"); } } } xmlhttp.open("GET", "http://www.inte.co.jp/xxxx/xxxx" , true); xmlhttp.send(null); return false; } function createXmlHttp(){ if (window.XMLHttpRequest) { return new XMLHttpRequest(); } else if (window.ActiveXObject) { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { return new ActiveXObject("Microsoft.XMLHTTP"); } } else { return null; } } //--> </script> </head> <a href="#" onClick="fucXMLHttpRequest()">詳しくはこちら</a>

  • Ajaxを使いonMouseoverで説明表示をする

    以下の場合、opentext を直接開けば普通に開くのですが、 getPage で開くとエラーになってしまいます。 いろいろ試した結果 event.clientX がある場合エラーになるようです。 エラーがなく表示できるようになりませんでしょうか。 (文字数制限のためDIVタグ省略) function opentext(settxt){ divid="tiptext"; if(document.all){ d_div=document.all(divid); rx = event.clientX + document.body.scrollLeft +set_x; //rx = 100; ry = event.clientY + document.body.scrollTop +set_y; //ry = 100; }else{ d_div=document.getElementById(divid); rx = NNX + set_x; ry = NNY + set_y; } if(settxt){ d_div.style.display="block"; d_div.style.left = rx +"px"; d_div.style.top = ry +"px"; d_div.innerHTML = settxt; }else{ d_div.style.display="none"; d_div.innerHTML = ""; } } function MouseXY(NNevent){ NNX = NNevent.pageX; NNY = NNevent.pageY; } window.onmousemove = MouseXY;/* himajin.moo.jp */ function getPage(pageURL) { xmlhttp = createXMLHttp(); if (xmlhttp) { xmlhttp.onreadystatechange = setPageData; xmlhttp.open('GET', pageURL); xmlhttp.send(null); }else{ alert("XMLHttpRequest失敗"); } } function setPageData() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { //alert("XMLHttpRequest成功"); opentext([xmlhttp.responseText]); } } // XMLHttpsオブジェクト作成 function createXMLHttp() { try { return new ActiveXObject ("Microsoft.XMLHTTP"); }catch(e){ try { return new XMLHttpRequest(); }catch(e) { return null; } } return null; }

  • ActiveXObject("Msxml2.XMLHTTP")がFirefoxでうまく作動していないようです。

    ブラウザでweb上のxmlを取得して内容を表示しようとしています。 windowsXPprosp2.0でIE6.0では動作を確認しています。 スクリプトの詳しいところは実際はよく分かっていませんがコピペに手を加えて現在の形になっています。 <title>テストページ</title> function myCheck() { var r = null; if (typeof window.XMLHttpRequest == "undefined") { if (typeof window.ActiveXObject == "function") { try { r = new ActiveXObject("Msxml2.XMLHTTP"); r = window.XMLHttpRequest = myXMLrequest() { r = new ActiveXObject("Msxml2.XMLHTTP"); } } catch (e) { try { r = new ActiveXObject("Microsoft.XMLHTTP"); r = window.XMLHttpRequest = myXMLrequest() { r = new ActiveXObject("Microsoft.XMLHTTP"); } } catch (e) { } } } // else if () { } } // else { } r.onreadystatechange = function() { if ( ( r.readyState == 4 ) && ( r.status == 200 ) ) { 以下続く try catchの処理でIEとFierfoxなどのブラウザ分けをしていると思っているのですが教えてください。 Firefox2.0 Opera9ともに画面が真っ白で何も表示されません。 よろしくご教授ください。

  • AJAXのレスポンスをテキストエリアに表示

    以下のようなスクリプト(chat.htmlと、write_log.php)において、chat.htmlからwrite_log.php に送ったリクエスト(xmlHttpRequestオブジェクト利用)に対するレスポンスを受信後に、 document.getElementById("disp_chat").innerHTML = xmlhttp.responseText; としているのに、チャットのボディである、テキストエリアにレスポンスの文字列(ファイル(log.txt)の中身).が表示されません。printした文字列がwrite_log.phpのページで表示されているだけなのです。テキストエリアに、サーバーサイドのPHPから返されるレスポンスの文字列を、テキストエリアに表示するにはどこが間違っているのでしょうか。 ご指導、どうぞよろしくお願いします。 【chat.html】 <!DOCTYPE html> <head><title>チャット</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body class="body"> <script type="text/javascript"> var xmlhttp; function httpHandler(){ if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ // レスポンス受信後に呼び出される関数 // alert('test'); document.getElementById("disp_chat").innerHTML = xmlhttp.responseText; } } function onClicked(){ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.onreadystatechange = httpHandler; // コールバック関数 xmlhttp.open("GET", "write_log.php"); xmlhttp.send(null); // チャット音鳴動 var myAudio=document.getElementById("audio"); myAudio.play(); } function getDate(){ var date = new Date; var hours = date.getHours(); var minutes = date.getMinutes(); if(hours>=0 && hours<10){ hours = "0" + toString(hours); } if(minutes>=0 && minutes<10){ minutes = "0" + toString(minutes); } return (hours + ":" + minutes); } </script> <center> <div id="title">【チャット】</div> <div id="container"> <div id="disp"> <textarea id="disp_chat" class="disp"></textarea> </div> <div id="input"> <form name="form1" method="GET" action="write_log.php"> お名前:<input type="text" name="user" id="user" class="name"> メッセージ:<input type="text" name="input_chat" id="input_chat" class="input"><br><br> <input type="submit" id="submit" value="送信" onclick="onClicked()"> <!-- <input type="button" id="submit" value="送信" onclick="onClicked()">--> </form> </div> </div> </center> <audio id="audio" src="mjkchat.mp3">Your browser does not support the audio element.</audio> </body> </html> 【write_log.php】 <?php date_default_timezone_set("Japan"); $date = date('H:i:s'); $user = $_GET['user']; $chat = $_GET['input_chat']; $buf = $date.' '.$user.':'.$chat."\n"; $filename = "./log.txt"; $fp = fopen($filename, 'a'); fwrite($fp, $buf); fclose($fp); $buf2 = file_get_contents($filename); print $buf2; //header("Location: chat.php"); ?>

  • Ajax は NN でも使えますか?

    初歩的な質問ですみません。 Ajax の非同期通信で、XMLHTTP オブジェクトを作成するスクリプトを見ると、 function createXMLHttpRequest() { var XMLhttpObject = null; try{ XMLhttpObject = new XMLHttpRequest(); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ return null; } } } return XMLhttpObject; } のように Microsoft のオブジェクトを読み込んでいるように見えるのですが、NN でもつかえるのでしょうか。 また、Macintosh との互換性はどうなのでしょうか。 ご存知の方はお教えください。

  • 以下のスクリプトがVista×IE8、Firefox(現時点でわかって

    以下のスクリプトがVista×IE8、Firefox(現時点でわかっているところで)で、 想定と異なった動作をしてしまいます。 XP上であれば、特に問題なく動くのですが、Win7は手元にないので、わかりません。 しかし、原因が一向にわからず・・・。 ご教授いただけますと幸いです。 var xhr; function prefCheck(){   ~省略~ xhr = false; if(window.ActiveXObject) { try { xhr = new ActiveXObject('Msxml2.XMLHTTP'); } catch (e) { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } } else if(window.XMLHttpRequest) { xhr = new XMLHttpRequest(); xhr.overrideMimeType('text/xml'); } xhr.onreadystatechange=PrefCheck; xhr.open("GET","hogehoge.php, true); xhr.send(null); } function PrefCheck(){ if ((xhr.readyState == 4) && (xhr.status == 200)){ window.alert("hogehogehogehogehogehoge"); } }

  • responseTextでエラーが出ます

    下記プログラムがIEアクセスでエラーが出ます。 サーバ環境はdebianでapache2を使用しています。 エラーの内容はIEのステータスバーにエラーマークが 出るだけですが、同じdebian環境の別サーバではちゃんと 動作します。 また、winXPにインストールしたapache2でもちゃんと動きます。 同じdebian環境という事でapacheのコンフィグファイルなども調べてみましたが、全くだめでした。 何か考えられる事があるようでしたらどなたかお教えいただけないでしょうか? ちなみにapacheのエラーログは吐かれていませんでした。 う~~~ん。謎です。 ********[ index.html ]********** <HTML> <HEAD> <TITLE>Ajax Sample1</TITLE> <script language="javascript"> <!-- function AjaxSample1() { var xmlhttp = false; try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { xmlhttp = false; } if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp = new XMLHttpRequest(); } if (xmlhttp) { xmlhttp.open('GET', 'read.txt',true); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { var disp = document.getElementById('disp'); disp.innerHTML=xmlhttp.responseText; } } xmlhttp.send(null); } } --> </script> </HEAD> <BODY> <a href="javascript:void(0);" onclick="AjaxSample1();">XMLHTTP読み込み</a> <div id="disp"></div> </BODY> </HTML> **********[ read.txt ]**************** <font color="red">Sample1</font><br /> <font color="blue">Sample2</font><br /> ***************************************

  • XMLHttpRequest() Ajaxについて

    こんにちは。Ajaxに挑戦しているのですが、テキストフィールドに入力して送信ボタンを押したら、自作関数の XmlHttpRequest()を呼び出して、kakunin.jspに飛ばして、kakunin.jspで作ったコードを<result>タグ内に表示し、その際現れる「削除」ボタンをクリックしたら、今度は自作関数 deleteRequest()を呼び出し、sakujyo.jspに飛ばしてデータベースのレコードの削除を行い、<result>タグ内の表示をかえたいのですが、削除の方がうまくいっておりません(削除するボタンを押して、deleteRequest()は呼び出しているのですが、そのあと、delete.jspに飛ばず、kakunin.jspに飛びます)。以下が大まかなコードです。 function XmlHttpRequest(){ if(window.XMLHttpRequest){ httpObject=new XMLHttpRequest(); } else if(window.ActiveXObject){ httpObject=new ActiveXObjec("Msxml2.XMLHTTP"); } httpObject.onreadystatechange=display; 途中省略します。     httpObject.open("GET","kakunin.jsp?nen="+encnen+"&tsuki="+enctsuki+"&syaincode="+encsyaincode,true); httpObject.send(null); } function display(){ if(httpObject.readyState==4 && httpObject.status==200){ document.getElementById("result").innerHTML=httpObject.responseText; 省略します。 } } function deleteRequest(){ if(window.XMLHttpRequest){ delhttpObject=new XMLHttpRequest(); } else if(window.ActiveXObject){ delhttpObject=new ActiveXObject("Msxml2.XMLHTTP"); } delhttpObject.onreadystatechange=displaysql("削除しました"); 省略します delhttpObject.open("GET","delete.jsp?nen="+encnen+"&tsuki="+enctsuki+"&syaincode="+encsyaincode,true); delhttpObject.send(null); } function displaysql(msg){ if(delhttpObject.readyState==4 && delhttpObject.status==200){ document.getElementById("result").innerHTML=delhttpObject.responseText; alert(msg); kidou(); } } こういったやり方がわからなく、自己流でやってみましたので、おかしな部分もあるかもしれませんが、やりたい事は押すボタンによって、飛ばすjspファイルを変え、<result>タグ内の表示も、各jspファイルで、 出力されたものを表示させたいのですが、自分で考えたやり方ではどこか間違っているようですので、どなたかアドバイスの方、よろしくお願いいたします。 環境は、IE7です。よろしくお願いいたします。

専門家に質問してみよう