2011|08|
2013|10|11|12|
2014|01|02|03|04|05|06|07|08|09|10|11|12|
2015|01|02|03|05|06|07|08|09|10|11|12|
2016|01|03|04|05|06|07|08|09|10|11|12|
2017|01|02|03|04|05|06|07|08|09|10|11|12|
2018|01|02|03|04|05|06|07|08|09|10|11|12|
2019|01|02|03|04|05|06|07|08|09|10|11|12|
2020|01|02|03|04|

2019-06-23 CSVファイルを毎回ちゃんと読み込むJavaScript() [長年日記]

<!--
	python3 -m http.sever 8080 でwebサーバを立てて
	http://localhost:8080/index.html
 
	同じディレクトリに適当な"data.csv"を作っておく
 
	======== data.csv ==============
	2019-06-11 10:00,27,50,1002,3
	2019-06-11 11:00,28,47,1016,12
	2019-06-11 12:00,29,48,1002,5
	2019-06-11 13:00,28,49,1003,2
	2019-06-11 14:00,27,51,1002,4
	2019-06-11 15:00,26,56,1003,5
	2019-06-11 16:00,25,60,1002,3
	2019-06-11 17:00,23,46,1016,12
	2019-06-11 18:00,22,41,1002,5
	2019-06-11 19:00,22,51,1003,2
	2019-06-11 20:00,21,53,1002,4
	2019-06-11 21:00,20,54,1003,AAAA
	================================
 
	出力は"data.csv"が5秒単位で繰り返し表示され続ける
-->
 
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
 
	<!-- HTML側でキャッシュを制御 (効果がなかったみたいなのでコメントアウト)
	<meta http-equiv="Pragma" content="no-cache" />
	<meta http-equiv="cache-control" content="no-store" />
    <meta http-equiv="expires" content="0" />
	-->
 
    <title>TEST</title>
 
	<!--
	<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script>
	-->
	<script type="text/javascript">
	  
	  var csvToArray = function(path) {
		  var csvData = new Array();
		  var data = new XMLHttpRequest();
		  data.open("GET", path, false);
		  data.send(null);
		  var LF = String.fromCharCode(10);
		  var lines = data.responseText.split(LF);
		  for (var i = 0; i < lines.length;++i) {
			  var cells = lines[i].split(",");
			  if( cells.length != 1 ) {
				  csvData.push(cells);
			  }
		  }
		  return csvData;
	  }
	  
	  var showCsvData = function(csvdata){
		  for (var i = 0; i < csvdata.length; i++) {
			  for (var j = 0; j < csvdata[i].length; j++) {
				  console.log(csvdata[i][j]);
				  document.write(csvdata[i][j] +  " ");
			  }
			  document.write("<br>\n");
		  }
	  }
	  
	  window.onload = function () {
		  // ↓ "data.csv"をキャッシュさせず、毎回必ず呼びこみさせる技(not Ebata's origin) 
		  var csvData = csvToArray("\\data.csv?"+Date.now());
		  //document.write("\\data.csv?"+Date.now());
		  //var csvData = csvToArray("data.csv");
		  showCsvData(csvData);
		  //console.log(csvData[0][2]);
	  };
	  setInterval(window.onload, 5000); // 5秒単位で動く
 
	</script>
 
  </head>
  <body>
	console.log(filetime('data.csv'));	
  </body>
</html>
syntax2html