频道栏目
首页 > 资讯 > JavaScript > 正文

PHP读写JSON文件以及jQuery的getJSON函数用法

17-01-20        来源:[db:作者]  
收藏   我要投稿

在写的音乐网站中用到保存用户歌单功能,即用户登录后可以显示该用户之前保存的歌单,开始的思路是使用数据库来保存,后来为了方便于是考虑使用json数据格式来保存歌单,这样也和播放器插件的json参数比较契合.

PHP读取JSON

读取JSON文件

<?php 
    $filename = "chation99.json";
    $json_string = file_get_contents($filename);
    $data = json_decode($json_string, true);

    // 显示出来看看
    var_dump($data);
    echo '<br><br>';
    print_r($data);
    echo '<br><br>';
?>

这里我们用到file_get_contents(path),这个函数来打开我们的json文件,然后用json_decode()函数来解析json数据,运行刚才的代码后,结果如下:

第一次输出 var_dump() :

这里写图片描述

第二次输出 print_r() :

这里写图片描述

这样表明我们已经成功的解析了从文件导入的json数据, 接下来我们对这些数据进行一些操作

PHP操作JSON数据

删除json数据元素

如果我们要操作JSON数据的话,必须先将JSON数据转化为数组模式,即json_decode()

for($i=0;$i<sizeof($data);$i++){
        if($data[$i]['title']=="顽固"){
            echo $data[$i]['title'];
            array_splice($data,$i,1);
            break;
        }
    }

这段代码的意思即,我们查找json数据中如果有title的值为”顽固”的话,显示出这个title,然后用array_splice()函数来删除这个数组元素.

array_splice(array,array[index],code);

这个函数的参数,第一个接受一个数组,第二个接受一个数组的索引值,第三个参数表示要删除的个数(从index向后计算,1代表只删除当前索引值的元素,无参数表示index索引往后所有全部删除),这个函数的好处是,可以在中间的元素被删除后后面的元素自动向前补缺,不会存在空洞现象.

添加json数据元素

    $index = sizeof($data);
    $data[$index]['mp3'] = "music/五月天-好好.mp3";
    $data[$index]['oga'] = "";
    $data[$index]['title'] = "好好";
    $data[$index]['artist'] = "五月天";
    $data[$index]['rating'] = "3";
    $data[$index]['buy'] = "#";
    $data[$index]['price'] = "";
    $data[$index]['duration'] = "03:19";
    $data[$index]['cover'] = "pic/userHead/bq2.jpg";

    var_dump($data);

首先将data数组的长度缓存到一个index值里面,如果不这样做在接下来的添加过程中数组长度会逐个增大,

然后为索引值为长度的元素逐个添加各个属性,就完成了添加元素的操作

PHP写JSON文件

$json_string = json_encode($data);
file_put_contents('chation99.json', $json_string);

先将data数组用json_encode()函数标准化为json数据字符串,然后将字符串写入到文件即可

file_put_contents(filename,filestring);

jQuery的getJSON函数

jQuery的getJSON函数属于jq Ajax的一种,异步的方式载入一个JSON文档

这里写图片描述

这里 ,我们的音乐网站上有一个播放器插件,需要一个json数据格式作为参数

/* 初始化播放器 */
function player(username) {
    $.getJSON("data/json/"+username+".json",function(data){
        $('#musicplayer').ttwMusicPlayer(data,
            {
                currencySymbol: "<span class='icon-cloud-download'></span>",
                buyText: " 下载",
                tracksToShow: 10,
                autoPlay: false,
                ratingCallback: function (index, playlistItem, rating) {
                },
                jPlayer: {}
            }
        );
    });
}

这样我们将username作为参数传入,可以保证不同的用户使用该播放器时载入相应的他们的歌单

接下来我们用JavaScript操作json数据的方式来为用户添加歌曲进歌单

/* 从List收藏歌曲 */
function addByList(e){
    //取得相应的歌曲信息
    var tr = e.parentNode.parentNode,
        img = tr.firstChild.firstChild,
        url = img.getAttribute("src");
    var name = tr.childNodes[1].innerHTML,
        art = tr.childNodes[2].innerHTML;
    var user = getCookie("music_identify");
    var phpurl = "data/userlist/addmusic.php?name=" + name + "&art=" + art + "&cover=" + url + "&user=" + user;
    if(user != ""){
        e.setAttribute("href",phpurl);
    }else{
        removeElem("warningTip");
        var tips = "登录后才能进行收藏或者下载 ! ";
        var form = document.getElementById("music_box_play");
        form.insertBefore(alertBox(tips, "warning"), form.childNodes[0]);
        e.removeAttribute("target");
    }

}

addmusic.PHP的代码如下

<?php

//取得用户信息
$music_name = $_GET['name'];
$music_art = $_GET['art'];
$music_cover = $_GET['cover'];
$user_name = $_GET['user'];

//打开相应JSON文件
$filename = "../json/".$user_name.".json";
$json_string = file_get_contents($filename);
$data = json_decode($json_string, true);

//添加数据
    $index = sizeof($data);
    $data[$index]['mp3'] = "music/".$music_art."-".$music_name.".mp3";
    $data[$index]['oga'] = "";
    $data[$index]['title'] = $music_name;
    $data[$index]['artist'] = $music_art;
    $data[$index]['rating'] = "5";
    $data[$index]['buy'] = "#";
    $data[$index]['price'] = "";
    $data[$index]['duration'] = $music_art;
    $data[$index]['cover'] = $music_cover;

//写入文件
$json_string = json_encode($data);
file_put_contents('../json/'.$user_name.'.json', $json_string);
echo '<script>window.close();</script>'; 

?>

这样添加的歌单在 测试过程中又一个问题,浏览器会把json文件自动缓存到本地,为了防止浏览器缓存JSON文件导致的歌单更新无效,我们需要给浏览器一个信号,即每次加载的json文件都是新文件,这里我们只需要在getJSON()函数里加上一个参数即可,参数可以是时间戳或者随机数

/* 初始化播放器 */
function player(username) {
    var date = new Date();
        mark = {Time:date.toDateString(),Math:Math.random()};
    $.getJSON("data/json/"+username+".json",mark,function(data){
    //do something ...
    });
}

这样就可以保证每次都是重新加载JSON文件了.

相关TAG标签
上一篇:JavaScript的10个点
下一篇:Uva1600题目解答
相关文章
图文推荐

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训 | 举报中心

版权所有: 红黑联盟--致力于做实用的IT技术学习网站