WordPress如何在后台仪表盘增加百度统计小工具,实时显示PV/UV/IP等数据

前言

WordPress如何在后台仪表盘增加百度统计小工具呢?今天小薛给大家带来一期详细的教程,可以实时显示PV/UV/IP等数据;有时候懒得去百度统计处查看自己的网站访问数据,例如一些PV/UV/IP等数据,那么我们可以直接使用百度统计的api,在WordPress的后台仪表盘进行一个简单的显示,这里北忘山网站为大家整理了一些函数,大家直接放在主题的functions.php文件中即可。并且全局AJAX调用,也不会拖慢后台的速度!

图片[1]-WordPress如何在后台仪表盘增加百度统计小工具,实时显示PV/UV/IP等数据-一只薛眠羊

显示效果如下:

图片[2]-WordPress如何在后台仪表盘增加百度统计小工具,实时显示PV/UV/IP等数据-一只薛眠羊

实现方式如下:

首先需要使用wp_remote_get和wp_remote_post进行get和post请求,并封装为函数。

教程小薛也是讲过了,教程传送门:

这里需要调用其doPost方法,代码如下:

function zeo_get_baidu_analyse()
{
    $url = 'https://api.baidu.com/json/tongji/v1/ReportService/getData'; //百度商业账号请求地址
    // 账户类型,默认1即可
    $type         = '1';
    // 站点ID,可以提供地址栏拿到
    $siteId     = 'xxx';
    // 登录百度统计的用户名
    $username   = 'xxx';
    // 登录百度统计的密码
    $password   = 'xxx';
    // Token 获取方式:https://tongji.baidu.com/web/help/article?id=129&type=0
    $toekn      = _opz('baidu_tongji_token');
    //统计天数,维度,默认1
    $day = 1;
    $headers = array(
        'Content-Type' => ' application/json'
    );
    $data_body = [
        'header' => [
            'account_type'  => $type,
            'username'      => $username,
            'password'      => $password,
            'token'         => $toekn,
        ],
        'body' => [
            'siteId'        => $siteId,
            'method'        => 'overview/getTimeTrendRpt',
            'start_date'    => date('Y-m-d', strtotime("-" . $day . " day")),
            'end_date'      => date('Y-m-d'),
            'metrics'       => 'pv_count,ip_count,visitor_count',
            'gran'          => 'day',
            'max_results'   => $day
        ]
    ];
    try {
        $json = doPost($url, array(
            'headers' => $headers,
            'body' => json_encode($data_body),
            'timeout' => 30,
        ));
        $json = json_decode($json);
    } catch (\Exception $e) {
        echo array('error' => 1, 'msg' => $e->getMessage());
        exit();
    }
    zeo_ajax_die($json);
}
add_action('wp_ajax_get_baidu_analyse', 'zeo_get_baidu_analyse'); //管理员调用 

上面这个函数主要是为了请求百度统计的数据,然后返回到JavaScript进行Ajax使用,这里面还有一个函数需要封装,也为大家准备了,就是zeo_ajax_die($json);

主要也是为了返回数据用的,进行了一次格式化数据返回,代码如下:

function zeo_ajax_die($data, $code = 0)
{
    $json['code'] = $data->code;
    $json['data'] = $data->body;
    wp_die(json_encode($json));
}

最后就是创建WordPress仪表盘,并显示数据了,代码如下:

function zeo_add_dashboard_widgets()
{
    wp_add_dashboard_widget('custom_help_widget', '百度统计数据-代码来自一只薛眠羊', 'zeo_baidu_analyse_form');
}
add_action('wp_dashboard_setup', 'zeo_add_dashboard_widgets');

function zeo_baidu_analyse_form()
{
    $html_s = '
    <table class="zeo-bd-table"><thead><tr><th>日期</th><th>浏览量</th><th>访客数</th><th>IP 数</th></tr></thead>
      <tr><td>今日</td><td class="nowt-uv"></td><td class="nowt-pv"></td><td class="nowt-ip"></td></tr>
      <tr><td>昨日</td><td class="yest-uv"></td><td class="yest-pv"></td><td class="yest-ip"></td></tr>
    </table>';
    $script_s = '<script type="text/javascript">
        (function ($, window, document) {
            var data = {action: "get_baidu_analyse"}
            $.post("' . AJAX_URL . '", data, function (data) {
                var obj = JSON.parse(data);
                if(obj.code == 200){
                    
                    var yest = obj.data.body.data[0].result.items[1][0];
                    var nowt = obj.data.body.data[0].result.items[1][1];
                    $(".nowt-uv").text(nowt[0]);
                    $(".nowt-pv").text(nowt[1]);
                    $(".nowt-ip").text(nowt[2]);

                    $(".yest-uv").text(yest[0]);
                    $(".yest-pv").text(yest[1]);
                    $(".yest-ip").text(yest[2]);
                }else{
                    $(".nowt-uv").text("0");
                    $(".nowt-pv").text("0");
                    $(".nowt-ip").text("0");

                    $(".yest-uv").text("0");
                    $(".yest-pv").text("0");
                    $(".yest-ip").text("0");
                }
               });
           
        })(jQuery, window, document);
        </script>';
    echo $html_s;
    echo $script_s;
}

以上便是这次的主要内容,当然,这只是当前版本,后续会对其中的一些不合理的地方进行调整,当然,如果大家有更好的思路,也可以在下方进行留言。

© 版权声明
THE END
喜欢就支持一下吧
点赞12赞赏 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容