php：简单的音乐上传与展示

知识点

文件目录

├── add.php
├── bootstrap.css
├── list.php
├── storage.json
├── uploads（空文件夹）

核心代码

// list.php
<?php// 获取文件中记录的数据，并展示到表格中（动态生成表格的HTML标签）
$contents = file_get_contents('storage.json');
// $contents => JSON 格式的字符串
// 把 JSON 格式的字符串转换为对象的过程叫做反序列化// json_decode 默认反序列化时 将 JSON 中的对象转换为 PHP 中 stdClass 类型的对象
$data = json_decode($contents, true);
// $data => []?>
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>音乐列表</title><link rel="stylesheet" href="bootstrap.css">
</head>
<body><div class="container py-5"><h1 class="display-4">音乐列表</h1><hr><div class="mb-3"><a href="add.php" class="btn btn-secondary btn-sm">添加</a></div><table class="table table-bordered table-striped table-hover"><thead class="thead-dark"><tr><th class="text-center">标题</th><th class="text-center">歌手</th><th class="text-center">海报</th><th class="text-center">音乐</th><th class="text-center">操作</th></tr></thead><tbody class="text-center"><?php foreach ($data as $item): ?><tr><td><?php echo $item['title'] ?></td><td><?php echo $item['artist'] ?></td><td><img src="<?php echo $item['images'][0] ?>" alt=""></td><td><audio src="<?php echo $item['source'] ?>" controls></audio></td><td><button class="btn btn-danger btn-sm">删除</button></td></tr><?php endforeach ?></tbody></table></div>
</body>
</html>

// add.php
<?php/*** 只是在表单提交时执行*/
function add_music () {// 目标//  将用户提交过来的数据保存到 storage.json 中// 步骤//  1. 接收并校验//  2. 持久化//  3. 响应// 文本框校验// =====================================================if (empty($_POST['title'])) {$GLOBALS['error_message'] = '请输入标题';return;}if (empty($_POST['artist'])) {$GLOBALS['error_message'] = '请输入歌手';return;}// 校验上传文件// =====================================================if (empty($_FILES['source'])) {// 客户端提交的表单中没有 source 文件域$GLOBALS['error_message'] = '请正确提交文件';return;}$source = $_FILES['source'];// 判断用户是否选择了文件if ($source['error'] !== UPLOAD_ERR_OK) {$GLOBALS['error_message'] = '请选择音乐文件';return;}// 校验文件的大小if ($source['size'] > 10 * 1024 * 1024) {$GLOBALS['error_message'] = '音乐文件过大';return;}if ($source['size'] < 1 * 1024 * 1024) {$GLOBALS['error_message'] = '音乐文件过小';return;}// 校验类型$allowed_types = array('audio/mp3', 'audio/wma');if (!in_array($source['type'], $allowed_types)) {$GLOBALS['error_message'] = '这是不支持的音乐格式';return;}// 音乐文件已经上传成功，但是还在临时目录中// 一般情况会将上传的文件重命名$target = './uploads/' . uniqid() . '-' . $source['name'];if (!move_uploaded_file($source['tmp_name'], $target)) {$GLOBALS['error_message'] = '上传音乐失败';return;}// =========== 接收图片 ==============if (empty($_FILES['images'])) {// 客户端提交的表单中没有 source 文件域$GLOBALS['error_message'] = '请正确提交文件';return;}$images = $_FILES['images'];// 判断用户是否选择了文件if ($images['error'] !== UPLOAD_ERR_OK) {$GLOBALS['error_message'] = '请选择图片文件';return;}// 校验文件的大小if ($images['size'] > 1 * 1024 * 1024) {$GLOBALS['error_message'] = '图片文件过大';return;}// 校验类型$allowed_types = array('image/jpeg', 'image/png', 'image/gif');if (!in_array($images['type'], $allowed_types)) {$GLOBALS['error_message'] = '这是不支持的图片格式';return;}// 音乐文件已经上传成功，但是还在临时目录中// 一般情况会将上传的文件重命名$target = './uploads/' . uniqid() . '-' . $images['name'];if (!move_uploaded_file($images['tmp_name'], $target)) {$GLOBALS['error_message'] = '上传图片失败';return;}// 图片音乐都上传成功$title = $_POST['title'];$artist = $_POST['artist'];$images = '图片';$source = '音乐';$origin = json_decode(file_get_contents('storage.json'), true);$origin[] = array('id' => uniqid(),'title' => $_POST['title'],'artist' => $_POST['artist'],'images' => '123','source' => '1231',);$json = json_encode($origin);file_put_contents('storage.json', $json);// 跳转回列表页header('Location: list.php');
}if ($_SERVER['REQUEST_METHOD'] === 'POST') {add_music();
}?>
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>添加新音乐</title><link rel="stylesheet" href="bootstrap.css">
</head>
<body><div class="container py-5"><h1 class="display-4">添加新音乐</h1><hr><?php if (isset($error_message)): ?><div class="alert alert-danger" role="alert"><?php echo $error_message; ?></div><?php endif ?><form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" enctype="multipart/form-data" autocomplete="off"><div class="form-group"><label for="title">标题</label><input type="text" class="form-control" id="title" name="title"></div><div class="form-group"><label for="artist">歌手</label><input type="text" class="form-control" id="artist" name="artist"></div><div class="form-group"><label for="images">海报</label><input type="file" class="form-control" id="images" name="images"></div><div class="form-group"><label for="source">音乐</label><!-- accept 可以限制文件域能够选择的文件种类，值是 MIME Type --><input type="file" class="form-control" id="source" name="source" accept="audio/*"></div><button class="btn btn-primary btn-block">保存</button></form></div>
</body>
</html>

[{"id": "59d632855434e","title": "\u9519\u8fc7","artist": "\u6881\u548f\u742a","images": ["\/uploads\/img\/1.jpg"],"source": "\/uploads\/mp3\/1.mp3"},{"id": "59d632855434f","title": "\u5f00\u59cb\u61c2\u4e86","artist": "\u5b59\u71d5\u59ff","images": ["\/uploads\/img\/2.jpg"],"source": "\/uploads\/mp3\/2.mp3"},{"id": "59d6328554350","title": "\u4e00\u751f\u4e2d\u6700\u7231","artist": "\u8c2d\u548f\u9e9f","images": ["\/uploads\/img\/3.jpg"],"source": "\/uploads\/mp3\/3.mp3"},{"id": "59d6328554351","title": "\u7231\u5728\u6df1\u79cb","artist": "\u8c2d\u548f\u9e9f","images": ["\/uploads\/img\/4.jpg"],"source": "\/uploads\/mp3\/4.mp3"},{"id": "59f0592aa33d8","title": "123123","artist": "123123","images": "123","source": "1231"}
]

php：简单的音乐上传与展示相关推荐

用go来搭建一个简单的图片上传网站
提前说明一下:代码参考了<Go语言编程>,稍有变动, 自己亲自玩了一遍. 之前玩过go web server, 现在来用go来搭建一个简单的图片上传网站, 工作目录是:~/photoweb ...
bootstrap-fileinput的简单使用(图片上传和编辑)
简介: 一款非常优秀的HTML5文件上传插件,支持bootstrap 3.x 和4.x版本,具有非常多的特性:多文件选择.这个插件能最简单的帮你完成文件上传功能,且使用bootstrap样式.还支持多 ...
alert()的功能_前端实现简单的图片上传小图预览功能
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
简述php中文件上传过程,简单php文件上传详细说明
关于文件上传我们讲了很多,这只是一款最基本的简单的文件上传功能,同时本教程也介绍了关于上传的原理以及各种函数的使用与file的参数说明,以及php.ihi设置上传文件大小配置等. 1 如果实现小文件 ...
使用jspsmartupload完成简单的文件上传系统
请不要妄想,一个html的file控件,再加上JavaScript与jQuery语句就可以完成文件上传, 文件上传系统从来是需要配合服务器来完成的用户把自己的文件上传到服务器上文件上传系统是很复杂 ...
python自动上传图片_使用Python实现一个简单的图片上传存储服务
使用flask实现的一个简单的图片上传服务设计初衷对于图片的存储,有很多选择,一般采用云服务如(七牛,又拍等),但是国内的服务像七牛自定义域名竟然需要域名备案(Excuse me,当初就是因为备 ...
ROS最正确的限速--------小包优先+带宽均分+简单队列限制上传速度
ROS最正确的限速--------小包优先+带宽均分+简单队列限制上传速度注意:本文针对10M带宽做出的限速说明,请根据自己的实际带宽更改相应的限速设置 ====================== ...
一款动态跑路html源码，简单实用，上传解压就完事了
介绍: 一款动态跑路源码,简单实用,上传解压就完事了搭建教程: 1.领取主机 2.二级域名 3.上传源码到主机文件夹,解压 4.绑定域名,搭建完成网盘下载地址: http://kekewangLu ...
利用Socketserver实现简单的文件上传
利用Socketserver实现简单的文件上传 server.py #!/usr/bin/env python #coding:utf-8 import SocketServer import os ...

php：简单的音乐上传与展示

知识点

文件目录

核心代码

php：简单的音乐上传与展示相关推荐

最新文章

热门文章