/*クライアント側*/
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<link rel="stylesheet" href="test.css" type="text/css">
<script type="text/javascript" language="javascript">
function sample() {
var event_source = window.EventSource || window.MozEventSource;
if(event_source){ //<-Server-Sent Eventsへの対応状況確認
server_event = new EventSource("test2.php"); //<-サーバ側ファイル名を指定する
server_event.onmessage = function(event) { //onmessageに関数を追加することで、サーバからのメッセージを受け取った動作を記述
var data = event.data;
alert(data);
};
server_event.onerror = function(event) {
server_event.close();
};
} else {
alert("Server-Sent Events非対応です");
}
}
//-->
</script>
</head>
<body>
<input type="button" value="押して" onClick="sample();">
<br><br>
</body>
</html>
/*サーバ側*/
<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
$test_message = "testです。";
echo "data:".$test_message; //event:とするとevent名をつけられる。
?>
