Category: PHP

boj mpmdeci url lists

file_put_contensを回す。

$i=0;
foreach($urls as $value){
    $pass = "file/".$y."/".$i.".pdf";
    $data = file_get_contents($value);
    file_put_contents($pass, $data);
    $i++;
}

これをpdftotextしたい。

$file = "boj.pdf";
header("Content-Type: application/pdf");

readfile($file);
exit();

bank of japan Monetary Policy

表示はわかった。中のテキストを抽出したい。

document.referrerで取得したURLにRegular Expressionで該当すればフラグを立てたい。

1.Organic Search
https://www.google.co.jp
https://www.bing.com/
https://www.yahoo.co.jp/
https://www.msn.com/ja-jp/
http://www.baidu.com/

2.Social
https://www.facebook.com/
https://twitter.com/?lang=ja
https://www.instagram.com/?hl=ja
https://line.me/ja/

3.Direct

4.Referral

早速書いてみる。

$url = "ttps://www.google.co.jp/search?q=%E6%A9%9F%E6%A2%B0%E5%AD%A6%E7%BF%92&oq=%E6%A9%9F%E6%A2%B0%E5%AD%A6%E7%BF%92&aqs=chrome..69i57j69i61l3j0l2.3764j0j7&sourceid=chrome&ie=UTF-8";
if(preg_match("/www.google/", $url)){
  $channel = "Organic Search"; 
  $media = "google";
} else{
  $channel = "else";
}
echo $channel;

項目を増やします。yahooはco.jpもcomも検索時に、https://search.yahoo.comとサブドメインにsearchが付きます。(分かり易い！)

$url = "http://hpscript.com/ip/";
if(empty($url)){
  $channel = "Direct"; 
}elseif(preg_match("/www.google/", $url)){
  $channel = "Organic Search"; 
  $media = "google";
}elseif(preg_match("/www.bing/", $url)){
  $channel = "Organic Search"; 
  $media = "bing";
}elseif(preg_match("/search.yahoo/", $url)){
  $channel = "Organic Search"; 
  $media = "yahoo";
}elseif(preg_match("/www.baidu/", $url)){
  $channel = "Organic Search"; 
  $media = "baidu";
}elseif(preg_match("/www.facebook/", $url)){
  $channel = "Social"; 
  $media = "facebook";
}elseif(preg_match("/twitter/", $url)){
  $channel = "Social"; 
  $media = "twitter";
}elseif(preg_match("/www.instagram/", $url)){
  $channel = "Social"; 
  $media = "twitter";
}elseif(preg_match("/line/", $url)){
  $channel = "Social"; 
  $media = "line";
}else{
  $channel = "Referral";
}
echo $channel;

doubleclick.php(js受け取り)のphpで処理を書いていきます。

if(!is_null($data["acquisition"])){
	$url = $data["acquisition"];
	if(empty($url)){
	  $channel = "Direct"; 
	  $media = "(not set)";
	}elseif(preg_match("/www.google/", $url)){
	  $channel = "Organic Search"; 
	  $media = "google";
	}elseif(preg_match("/www.bing/", $url)){
	  $channel = "Organic Search"; 
	  $media = "bing";
	}elseif(preg_match("/search.yahoo/", $url)){
	  $channel = "Organic Search"; 
	  $media = "yahoo";
	}elseif(preg_match("/www.baidu/", $url)){
	  $channel = "Organic Search"; 
	  $media = "baidu";
	}elseif(preg_match("/www.facebook/", $url)){
	  $channel = "Social"; 
	  $media = "facebook";
	}elseif(preg_match("/twitter/", $url)){
	  $channel = "Social"; 
	  $media = "twitter";
	}elseif(preg_match("/www.instagram/", $url)){
	  $channel = "Social"; 
	  $media = "twitter";
	}elseif(preg_match("/line/", $url)){
	  $channel = "Social"; 
	  $media = "line";
	}else{
	  $channel = "Referral";
	  $media = $url;
	}
	$data = $data + array('channel'=>$channel, 'media'=>$media);
}

directの場合は、mediaは(not set)

urlがbingにマッチしたら、channelはorganic searchになります。

mongoDBにも入っています。

つづいて、データを入れてanalytics側のviewをつくっていきます。
organic, social, direct, refferalの分類はchart.jsを使いたい。

OK!!!!!!!!!!!!!!!!!!!!!!!
リファクタリングして、次はスタイリングです！
今回はweb fontを使って、fontにもこだわりたい。

初期画面

<?php if($_GET&#91;"tracking"&#93; == 'tracking-code'): ?>
  hoge
<?php else: ?>
<?php endif; ?>

クリックするとコピーする機能を付けたい。
onclick=”this.select(0,this.value.length)”と書くと、クリックで全選択できる。

<?php if($_GET&#91;"tracking"&#93; == 'tracking-code'): ?>
  <b>サイトタグ(デモ)</b><br>
  これは、サイトのユニバーサルアナリティクストラッキングコードです。このプロパティ(アナリティクストラッキングコード)を最大限に活用できるよう、このコードをコピーして、トラッキングする全てのページのbodyタグの前に貼り付けてください。<br>
  ntag.jsは、サイト測定、コンバージョン トラッキング、リマーケティング サービス用のウェブのタグ付けライブラリです。ntag.jsを使用すると、タグの管理や実装が容易になり、公開される最新の動的な機能や統合のメリットをすぐに活用することができます。<br><br>
  <textarea name="tracking-code" rows="13" cols="75" onclick="this.select(0,this.value.length)">
  <script type="text/javascript">
    var a = [['acount','007'],["ip","<?php echo $_SERVER&#91;'REMOTE_ADDR'&#93;; ?>"]];
    var b =['https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js', 'na.js'];
    var i = 0;
    (function appendScript(){
        var script = document.createElement('script');
        script.src = b[i];
        document.body.appendChild(script);
        if(i++ < 2){
            script.onload = appendScript;
        }
    })();
</script>
</textarea><br><br>
The Site Tag provides streamlined tagging across site measurement, conversion tracking, and remarketing products – giving you better control while making implementation easier. By using ntag.js, you will be able to benefit from the latest dynamic features and integrations as they become available.

よく見たら、echo $_SERVER[‘REMOTE_ADDR’];が上手くいってない。

htmlspecialcharでエスケープします。

<?php 
$hoge = '<?php echo $_SERVER&#91;\'REMOTE_ADDR\'&#93;; ?>';
?>
<?php echo htmlspecialchars($hoge);?>

修正しました。

問題はこっからどうするかだな。。
GAでよく見るのはページごとのavg timeと、リファラーがOrganic・social・directか、あたりの指標なので、そこをチャレンジしたい。

日付のパラメーターがついていた場合には、それに地域パラメータを加えてリンクさせる。

if(isset($_GET['_udate00'])&&isset($_GET['_udate01'])) {
  $date1 = $_GET['_udate00'];
  $date2 = $_GET['_udate01'] . " 23:59:59";
  $continent = "?_udate00".$_GET['_udate00']."&_udate01=".$_GET['_udate01']."&selectedDimension=continent";
  $contry = "?_udate00".$_GET['_udate00']."&_udate01=".$_GET['_udate01']."&selectedDimension=contry";
  $city = "?_udate00".$_GET['_udate00']."&_udate01=".$_GET['_udate01']."&selectedDimension=city";
} else {
  $date1 = date("Y-m-d", strtotime("-10 day"));
  $date2 = date("Y-m-d H:i:s");
  $continent = "?selectedDimension=continent";
  $contry = "?selectedDimension=contry";
  $city = "?selectedDimension=city";
}
if(isset($_GET['selectedDimension'])){
  $c = $_GET['selectedDimension'];
}

datepickerのformでは、hiddenでipの地域データをsubmitさせます。

<form method="GET" name="form" action="">
<input name="_udate00" type="text" id="datepicker" value="<?php echo $date1; ?>"> ～　<input name="_udate01" type="text" id="datepicker2" value="<?php echo $date2; ?>">
<input type="hidden" name="selectedDimension" value="<?php echo $c; ?>">
<input type="submit" class="submit" value="apply">
</form>

両方ついています。

パラメーターのnameはGA同様、_u.date00、_u.date01にします。

<?php
$date1 = date("Y-m-d", strtotime("-50 days"));
$date2 = date("Y-m-d");

?>
<style>
input{
	width:90px;
}
</style>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/i18n/jquery.ui.datepicker-ja.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css" >

<form method="GET" name="form" action="">
<input name="_u.date00" type="text" id="datepicker" value="<?php echo $date1; ?>"> ～　<input name="_u.date01" type="text" id="datepicker2" value="<?php echo $date2; ?>">
<input type="submit" class="submit">
</form>
<script>
  var dateFormat = 'yy-mm-dd';
  $(function() {
    $("#datepicker").datepicker({
    	dateFormat: dateFormat,
    	maxDate:0,
    	onClose: function(dateText, inst){
    		$('#datepicker2').datepicker('option', 'minDate', dateText);
    		$('#datepicker').val(dateText);
    	}
    });
    $("#datepicker2").datepicker({
    	dateFormat: dateFormat,
    	maxDate:0,
    	onClose: function(dateText, inst){
    		$('#datepicker').datepicker('option', 'maxDate', dateText);
    		$('#datepicker2').val(dateText);
    	}
    });
  });
</script>

送れています。

つなげると、、、

mongodbのfilterで’date’ => [ ‘$gte’ => $date1, ‘$lte’ => $date2]とすると、
date2が00:00:00で算出してしまうので、以下のように、Getパラメーター取得時は、その日の23:59:59にします。

if(isset($_GET['_udate00'])&&isset($_GET['_udate01'])) {
  $date1 = $_GET['_udate00'];
  $date2 = $_GET['_udate01'] . " 23:59:59";
} else {
  $date1 = date("Y-m-d", strtotime("-10 day"));
  $date2 = date("Y-m-d H:i:s");
}

次はarray_count_valuesでアクセスされたページのテーブル表示です。

あれ、google見ると、ページごとにPageviews、Unique Pageviews、Avg. Time on Page 、Entrances、Bounce Rateがある。。。まじかよ。。。

全て繋げます。

<?php

// $date1 = date("Y-m-d H:i:s", strtotime("- 6 day"));
$date1 = date("Y-m-d", strtotime("-10 day"));
// $date2 = date("Y-m-d H:i:s", strtotime("- 1 day"));
$date2 = date("Y-m-d H:i:s");


$mng = new MongoDB\Driver\Manager("mongodb://localhost:27017");
$filter =  &#91;
	'date' => [ '$gte' => $date1, '$lte' => $date2]
];
$options = [
  'projection' => ['_id' => 0],
  'sort' => ['_id' => -1],
];
$query = new MongoDB\Driver\Query($filter, $options);
$cursor = $mng->executeQuery('app.na007', $query);

foreach ($cursor as $document) {
  // var_dump($document);
  $pv[] = $document->date;
  $cookie[] = $document->cookie;
  $session[] = $document->session;
  if(!is_null($document->referrer)){
  $avgtime[] = $document->avgtime;
  }
  if(!is_null($document->referrer)){
  $referrer[] = $document->referrer;
  }
  $visit[] = $document->visit;
  $access[] = substr($document->date, 11, 2);
}
$visit = json_encode(array_count_values($visit));
$line = array("00"=>0,"01"=>0, "02"=>0,"03"=>0,"04"=>0,"05"=>0,"06"=>0,"07"=>0,"08"=>0,"09"=>0,"10"=>0,"11"=>0,"12"=>0,"13"=>0,"14"=>0,"15"=>0,"16"=>0,"17"=>0,"18"=>0,"19"=>0,"20"=>0,"21"=>0,"22"=>0,"23"=>0);
foreach($access as $value){switch($value){case '00':$line['00'] ++;break;case '01':$line['01'] ++;break;case '02':$line['02'] ++;break;case '03':$line['03'] ++;break;case '04':$line['04'] ++;break;case '05':$line['05'] ++;break;case '06':$line['06'] ++;break;case '07':$line['07'] ++;break;case '08':$line['08'] ++;break;case '08':$line['08'] ++;break;case '10':$line['10'] ++;break;case '11':$line['11'] ++;break;case '12':$line['12'] ++;break;case '13':$line['13'] ++;break;case '14':$line['14'] ++;break;case '15':$line['15'] ++;break;case '16':$line['16'] ++;break;case '17':$line['17'] ++;break;case '18':$line['18'] ++;break;case '19':$line['19'] ++;break;case '20':$line['20'] ++;break;case '21':$line['21'] ++;break;case '22':$line['22'] ++;break;case '23':$line['23'] ++;break;}}

$line_list = json_encode($line);
$uu = array_unique($cookie);
$session = array_unique($session);
$bounce = (count($pv) - count($referrer))/ count($pv) * 100;
$exit = (count($pv) - count($session))/ count($pv) * 100;
$avgtime = array_sum($avgtime) / count($avgtime);
$time = s2h($avgtime);
function s2h($avgtime){
  $hours = floor($avgtime / 3600);
  $minutes = floor(($avgtime / 60)%60);
  $seconds = $avgtime % 60;
  $hms = sprintf("%02d:%02d:%02d", $hours, $minutes, $seconds);
  return $hms; 
}
?>
<style>
.flex-container {
  display: flex;
}
.flex-1{
  flex:1;
}
.flex-2{
  flex:4;
}
#pie {
 height:190;
 width:190;
}
#line {
 height:200;
 width:750;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script>
<h1>アナリティクス</h1>
<div class="flex-container">
<div class="flex-1">
  <ul>
    <li><a href="">Audience</a></li>
    <li><a href="">Acuisition</a></li>
    <li><a href="">Behavior</a></li>
  </ul>
</div>
<div class="flex-2">
<?php echo $date1 ." ~ ".$date2 ."<br><br>"; ?>
<div id="line">
<canvas id="myLine" width="750" height="200"></canvas>
</div>
<div id="pie">
<canvas id="myChart" width="200" height="200"></canvas>
</div>
<?php
echo "<br>Users: ".count($uu)."<br>";
echo "Session: ".count($session)."<br>";
echo "Pageviews: ".count($pv)."<br>";
echo "avg time: " .$time."<br>";
echo "Bounce rate :" .sprintf('%.2f',$bounce)."%<br>";
echo "Exit rate:" .sprintf('%.2f',$exit)."%<br>";
?>
</div>
</div>

<script>
  var visit = JSON.parse('<?php echo $visit; ?>');
  console.log(visit);
  var ctx = document.getElementById("myChart").getContext('2d');
  var myChart = new Chart(ctx, {
  type: 'pie',
  data: {
    labels: ["New", "Returned"],
    datasets: [{
      backgroundColor: [
        "#2ecc71",
        "#3498db",
      ],
      data: [visit['New User'],visit['Returned User']]
    }]
  }
});
var line = JSON.parse('<?php echo $line_list; ?>');
console.log(line);
var ctx2 = document.getElementById("myLine").getContext('2d');
var myLine = new Chart(ctx2, {
   type: 'line',
   data: {
      labels: ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12","13","14","15","16","17","18","19","20","21","22","23","24"],
      datasets: [
      {
         label: "時間別Page View",
         borderColor: 'rgb(0, 153, 255)',
         backgroundColor: "#D9E5FF",
         lineTension: 0,
         data: [line['00'], line['01'],line['02'],line['03'],line['04'],line['05'],line['06'],line['06'],line['07'],line['08'],line['09'],line['10'],line['11'],line['12'],line['13'],line['14'],line['15'],line['16'],line['17'],line['18'],line['19'],line['20'],line['21'],line['22'],line['23']],
      },
      ]
   },
   options: {
      responsive: true,
      scales: {
        yAxes: [{
          ticks: {
            // max: Math.max.apply(null, line)*1.2,
          }
        }]
      }
   }
});
</script>

う～ん、なんだろう、この何とも言い難い感じは。。。

1.各指標はボックスレイアウトで表示したい。
2.日付は選択式にしたい
-> gaだと、日付選択は、GETパラメーター使ってますね。
_u.date00=20180420&_u.date01=20180423/

cssをつける

そんなに悪くないような気がしないでもない。

絶対、もっとうまく書ける筈なんだが。。。

foreach ($cursor as $document) {
  // var_dump($document);
  $pv[] = $document->date;
  $cookie[] = $document->cookie;
  $session[] = $document->session;
  if(!is_null($document->referrer)){
  $avgtime[] = $document->avgtime;
  }
  if(!is_null($document->referrer)){
  $referrer[] = $document->referrer;
  }
  $visit[] = $document->visit;
  $access[] = substr($document->date, 11, 2);
}

$line = array("00"=>0,"01"=>0, "02"=>0,"03"=>0,"04"=>0,"05"=>0,"06"=>0,"07"=>0,"08"=>0,"09"=>0,"10"=>0,"11"=>0,"12"=>0,"13"=>0,"14"=>0,"15"=>0,"16"=>0,"17"=>0,"18"=>0,"19"=>0,"20"=>0,"21"=>0,"22"=>0,"23"=>0);
foreach($access as $value){switch($value){case '00':$line['00'] ++;break;case '01':$line['01'] ++;break;case '02':$line['02'] ++;break;case '03':$line['03'] ++;break;case '04':$line['04'] ++;break;case '05':$line['05'] ++;break;case '06':$line['06'] ++;break;case '07':$line['07'] ++;break;case '08':$line['08'] ++;break;case '08':$line['08'] ++;break;case '10':$line['10'] ++;break;case '11':$line['11'] ++;break;case '12':$line['12'] ++;break;case '13':$line['13'] ++;break;case '14':$line['14'] ++;break;case '15':$line['15'] ++;break;case '16':$line['16'] ++;break;case '17':$line['17'] ++;break;case '18':$line['18'] ++;break;case '19':$line['19'] ++;break;case '20':$line['20'] ++;break;case '21':$line['21'] ++;break;case '22':$line['22'] ++;break;case '23':$line['23'] ++;break;}}
var_dump($line);

悔しいですね。

まず、仮データでつくる。

<style>
#line {
 height:200;
 width:750;
}
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.4/Chart.min.js"></script>
<div id="line">
<canvas id="myChart" width="750" height="200"></canvas>
</div>
<script>
var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
   type: 'line',
   data: {
      labels: ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12","13","14","15","16","17","18","19","20","21","22","23","24"],
      datasets: [
      {
         label: "Page View",
         borderColor: 'rgb(0, 153, 255)',
         backgroundColor: "#D9E5FF",
         lineTension: 0,
         data: [20, 26, 12, 43, 33, 21, 29, 5, 5, 0, 1,2,2, 3, 4, 5, 5, 5,6, 7, 22, 23, 15, 100, 24],
      },
      ]
   },
   options: {
      responsive: true,
      scales: {
        yAxes: [{
        	ticks: {
            max: 110,
          }
        }]
      }
   }
});
</script>

データラベルが00～24なので、countしたいが、どう組めば一番早い？