Ajaxでのチャットについて教えてください。

チャットを作っているのですが、iPhoneで画面がチラ付いたりとスムーズに動作しません。
調べてみましたが、AjaxとiOS6の組み合わせがあまりよくないようです。
https://matome.naver.jp/odai/2134849158107834201

スクリプトは以下の状態なのですが、iPhoneですと画面がチラついたりします。
<script>
$(function(){
var $content = $('.pageDisplay');
getPage("chat_live.php");
var lastpage = "chat_live.php";

function getPage(elm){
$.ajax({
type: 'GET',
url: elm,
dataType: 'html',
minTimeout: 1000,
success: function(data){
$content.html(data).fadeIn(600);
},
error:function() {
alert('問題が発生しました');
}
});
}

setInterval(function(){
$(".pageDisplay").load("chat_live.php");
},10000);//10秒
});
</script>

スムーズに動作させる事が出来るようでしたら、是非ご教示いただけないでしょうか？
宜しくお願いいたします。

No.1 ベストアンサー 回答者： fujillin 回答日時： 2017/09/15 09:48

こんにちは

iOSについてはまったく知りませんので、役に立たないとは思いますが、何かのヒントにでもなれば。


うまくいかないとわかっていてajaxを利用しているので、しかたがないとも言えますけれど…
ご提示のサイトによれば、ajax以外にもキャッシュの問題もあるようなので、ご提示のような利用法の場合はこちらも問題になりそうな気がします。（解決済みでしょう亜か？）
以下は、思い付き的な対処ですので、何も変わらないかもしれません。、setIntervalで繰り返さないで、complete時に次のリクエストをsetTimeoutで出すようにしてみたらどうなりますか？
（あまり本質的ではないですが、チラつきということなので）


いっそのこと、ajaxを利用しない方法に変えてしまえば良いのかも知れません。
chat_live.phpがhtmlを返すのなら、iframeにバックグラウンドで取り込み、これを反映するようにするとか、あるいは、2つのiframeで交互に読み込んで交互に表示するとかではどうでしょうか。

ただし、iPhoneの場合はiframeのサイズが効かないという現象もあるようなので、こちらはこちらで対処する必要があるようです。
どうやら親要素でサイズを固定しておくといった方法で対処可能なようですね。
http://www.infoscoop.org/blogjp/2014/04/22/mobil …
http://qiita.com/Shoesk/items/9f81ef1fd7b3a0b516b7

この回答へのお礼

fujillin 樣

＞chat_live.phpがhtmlを返すのなら、iframeにバックグラウンドで取り込み、これを反映するようにするとか、
確かにその通りですね。
ありがとうございました。試してみます。

お礼日時：2017/09/15 10:05