chrome_php logger 的实现原理

chrome_php是什么

1、chrome_php 是什么？

一款 Chrome 下用来配合调试 PHP 的工具，可以通过，console来查看php的信息

1.2用法

用法特别简单，有一个chrome_php.php 文件 和 chrome Logger的扩展 下载地址http://craig.is/writing/chrome-logger

include 'chrome_php.php';
$array = array(
"Action"  => "Recoverdownload",
"Data"   => array(
array(
"AuthorName" => "吴孟恩",
"FileName"       =>  "西游.ebk3",
"FileId"             => "10058011",
"Type"     =>  1,
),
array(
"AuthorName" => "心梦无痕",
"FileName"       =>  "七界传说.ebk3",
"FileId"             => "10058011",
"Type"     		  =>  2,
),
),
);
ChromePhp::log($array);

在浏览器里面 点击chrome logger 使其变亮　

在console.log可以看到如下的结果

2、chrome是怎么实现的呢，带着好奇心就看了看

通过追踪 log函数
log()  =>  _log() => _addRow() => _writeHeader()

找到重点了 把要输出数据 通过header 头进行了输出

protected function _writeHeader($data)
{
header(self::HEADER_NAME . ': ' . $this->_encode($data));//base64_encode(utf8_encode(json_encode($data)));
}

　　

2.2 查看谷歌调试工具里的 http请求

有如下数据，通过header把数据输出给客户端，

X-ChromeLogger-Data:eyJ2ZXJzaW9uIjoiNC4xLjAiLCJjb2x1bW5zIjpbImxvZyIsImJhY2t0cmFjZSIsInR5cGUiXSwicm93cyI6W1tbeyJBY3Rpb24iOiJSZWNvdmVyZG93bmxvYWQiLCJEYXRhIjpbeyJBdXRob3JOYW1lIjoiXHU1NDM0XHU1YjVmXHU2MDY5IiwiRmlsZU5hbWUiOiJcdTg5N2ZcdTZlMzguZWJrMyIsIkZpbGVJZCI6IjEwMDU4MDExIiwiVHlwZSI6MSwiRG93bmxvYWRVcmwiOiJodHRwOlwvXC9haDIuemhhbmd5dWUuY29tXC9yXC9kb3dubG9hZD90eXBlPTEmYmlkPTEwMDU4MDExJmNpZD0wJnByPTAmcHJpY2U9MiZmZWVVbml0PTEwIn0seyJBdXRob3JOYW1lIjoiXHU1ZmMzXHU2OGE2XHU2NWUwXHU3NWQ1IiwiRmlsZU5hbWUiOiJcdTRlMDNcdTc1NGNcdTRmMjBcdThiZjQuZWJrMyIsIkZpbGVJZCI6IjEwMDU4MDExIiwiVHlwZSI6MiwiRG93bmxvYWRVcmwiOiJodHRwOlwvXC9haDIuemhhbmd5dWUuY29tXC9yXC9kb3dubG9hZD90eXBlPTEmYmlkPTEwMDU4MDExJmNpZD0wJnByPTAmcHJpY2U9MiZmZWVVbml0PTEwIn1dfV0sIkU6XFx3YW1wXFx3d3dcXHRlc3QucGhwIDogNDgiLCIiXV0sInJlcXVlc3RfdXJpIjoiXC90ZXN0LnBocCJ9

2.3 JS是怎么获取的呢

调试工具 --> sources --> content script -->noaneddfkdjfnfdakjjmocngnfkfehhd (chrome logger 的ID号) --》log.js-->241行

chrome.extension.sendMessage('ready',function(queuedRequests){
if(queuedRequests){
如图所示




HTTP header 可以通过 chrome 扩展获取到！！！