上传到本地
上传文件
ThinkPHP5.0对文件上传的支持更加简单。
假设表单代码如下:
<form action="/index/index/upload" enctype="multipart/form-data" method="post">
<input type="file" name="image" /> <br>
<input type="submit" value="上传" />
</form>
然后在控制器中添加如下的代码:
public function upload(){
$file = request()->file('image');
if($file){
$info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
if($info){
echo $info->getExtension();
echo $info->getSaveName();
echo $info->getFilename();
}else{
echo $file->getError();
}
}
}
move方法成功的话返回的是一个\think\File对象,你可以对上传后的文件进行后续操作。
多文件上传
如果你使用的是多文件上传表单,例如:
<form class="form form-horizontal" method="post" action="{:url('admin/article/addArticle')}" enctype="multipart/form-data">
<div class="row cl">
<label class="form-label col-xs-4 col-sm-2">图集:</label>
<div class="formControls col-xs-8 col-sm-9">
<input id="file-0" type="file" multiple class="file" name="path[]" >
</div>
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-2">
<input class="btn btn-primary radius" type="submit" value=" 提交 ">
</div>
</div>
</form>
控制器代码可以改成:
public function addArticle()
{
if(\request()->isPost()){
$arryFile =\request()->file("path");
$arrImg=[];
foreach ($arryFile as $File){
$pathImg="";
$info = $File->move(ROOT_PATH . 'public' . DS . 'upload' . DS . 'article' . DS . date('Y') . DS . date('m-d'),md5(microtime(true)));
if ($info) {
$pathImg = "/public/upload/article/" . date('Y') . '/' . date('m-d') . '/' . $info->getFilename();
} else {
return $this->error($File->getError());
}
$arrImg[]= $pathImg;
}
$insert_data["img_url"]=implode(",",$arrImg);
Db::name("articles")->insert($insert_data);
}
return $this->fetch("article-add");
}
上传验证
支持对上传文件的验证,包括文件大小、文件类型和后缀:
public function upload(){
$file = request()->file('image');
$info = $file->validate(['size'=>15678,'ext'=>'jpg,png,gif'])->move(ROOT_PATH . 'public' . DS . 'uploads');
if($info){
echo $info->getExtension();
echo $info->getSaveName();
echo $info->getFilename();
}else{
echo $file->getError();
}
}
**
**
1-安装七牛云官方SDK
composer require qiniu/php-sdk -vvv
2-七牛云配置
1----config文件
'qiniu' => [
'accessKey' => '.......................................',
'secretKey' => '.......................................',
'domain' => '.............................',
'bucket' => '......',
'zone'=> 'south_china'
],
3- 对应的控制器
use Qiniu\Auth;
require 'vendor/qiniu/php-sdk/autoload.php';
use Qiniu\Storage\UploadManager;
public function add(){
$file = request()->file('img');
$filePath = $file->getRealPath();
$ext = pathinfo($file->getInfo('name'), PATHINFO_EXTENSION);
$key =substr(md5($file->getRealPath()) , 0, 5). date('YmdHis') . rand(0, 9999) . '.' . $ext;
$accessKey =config("qiniu")["accessKey"];
$secretKey =config("qiniu")["secretKey"];
$auth=new Auth($accessKey,$secretKey);
$bucket =config("qiniu")["bucket"];
$domain=config("qiniu")["domain"];
$token = $auth->uploadToken($bucket);
$uploadMgr = new UploadManager();
list($ret, $err) = $uploadMgr->putFile($token, $key, $filePath);
if ($err !== null) {
return ["err"=>1,"msg"=>$err,"data"=>""];
} else {
$imgPath=$domain.'/'.$key;
$data["thumb_url"] = $imgPath;
$data = Db::name('top_bar')->insert($data);
$this->redirect("/admin/topbar/index");
}
}
**
**
1.下载一个阿里云oss的sdk 也可以到阿里云 的OSS存储里面去下载
composer require aliyuncs/oss-sdk-php
2-在application同级目录的config.php的文件,配置信息放进去向下面这样
<?php
'appliy_oss'=>[
'KeyId' => '',
'KeySecret' => '',
'Endpoint' => '',
'Bucket' => '',
]
3-控制器
方法(一)
public function upload_img_oss(){
$type=input("param.type","files");
$img = request()->file('file');
$resResult = Image::open($img);
try {
$config = Config('appliy_oss');
$ossClient = new OssClient($config['KeyId'], $config['KeySecret'], $config['Endpoint']);
$fileName = $type.'/' . sha1(date('YmdHis', time()) . uniqid()) . '.' . $resResult->type();
$result = $ossClient->uploadFile($config['Bucket'], $fileName, $img->getInfo()['tmp_name']);
return json(["code"=> 1, "msg" => "上传成功", "url" => $result['info']['url']]);
} catch (OssException $e) {
return json(["code"=> 0, "msg" => $e->getMessage(), "url" => '']);
}
}
方法(二)
public function upload_oss(){
$type=input("param.type","files");
$file = $_FILES;
$img = current($file);
try {
$config = Config('appliy_oss');
$ossClient = new OssClient($config['KeyId'], $config['KeySecret'], $config['Endpoint']);
$file_type=substr($img["type"],strripos($img["type"],"/")+1);
$fileName = $type.'/' . sha1(date('YmdHis', time()) . uniqid()). '.' .$file_type;
$result = $ossClient->uploadFile($config['Bucket'], $fileName, $img['tmp_name']);
return json(["code"=> 1, "msg" => "上传成功", "url" => $result['info']['url']]);
} catch (OssException $e) {
return json(["code"=> 0, "msg" => $e->getMessage(), "url" => '']);
}
}
config 配置文件
'local_upload_path'=>ROOT_PATH . 'public' . DS . 'uploads',
'oss'=>[
'accessKeyId' => "XXXXXXXXXXXXXXXX",
'accessKeySecret' => "XXXXXXXXXXXXXXXX",
'endpoint' => "XXXXXXXXXXXXXXXX",
'bucket'=> "XXXXXXXXXXXXXXXX",
'object' => "XXXXXXXXXXXXXXXX"
],
public function upload(){
$file = request()->file('myfile');
if($file){
$info = $file->move(config('local_upload_path'));
if($info){
$target = config('local_upload_path').DS.$info->getSaveName();
$res = $this->oss_upload($target, $info->getFilename());
exit(json_encode($res));
}else{
exit(json_encode(array('code'=>2,'mes'=>$file->getError())));
}
}
}
public function oss_upload($target,$filename){
import('aliyun.autoload');
$accessKeyId = config('oss.accessKeyId');
$accessKeySecret = config('oss.accessKeySecret');
$endpoint = config('oss.endpoint');
$bucket= config('oss.bucket');
$object = config('oss.object');
$ossClient = new \OSS\OssClient($accessKeyId, $accessKeySecret, $endpoint);
try {
$res = $ossClient->doesBucketExist($bucket);
} catch (\OSS\Core\OssException $e) {
$result['mes'] = $e->getMessage();
$result['code'] = 3;
return $result;
}
if ($res === true) {
try {
$object = $object.'/'.$filename;
$info = $ossClient->uploadFile($bucket, $object, $target);
$result['message'] = '上传成功';
$result['code'] = 0;
$result['pic'] = $info['info']['url'];
return $result;
} catch (\OSS\Core\OssException $e) {
$result['mes'] = $e->getMessage();
$result['code'] = 4;
return $result;
}
} else {
$result['message'] = '服务端存储空间不存在';
$result['code'] = 1;
return $result;
}
}
1--单图上传
html 代码 如下
{include file="common/blank" /}
<![endif]-->
<!--/meta 作为公共模版分离出去-->
<title>添加用户 - H-ui.admin v3.1</title>
<meta name="keywords" content="H-ui.admin v3.1,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
<meta name="description" content="H-ui.admin v3.1,是一款由国人开发的轻量级扁平化网站后台模板,完全免费开源的网站后台管理系统模版,适合中小型CMS后台系统。">
</head>
<body>
<article class="page-container">
<form action="" method="post" class="form form-horizontal" id="form-member-add" enctype="multipart/form-data">
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>会员名:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" value="" placeholder="" id="user_name" name="user_name">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>密码:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" value="" placeholder="" id="password" name="password">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>头像:</label>
<div class="formControls col-xs-8 col-sm-9">
<input class="file" type="file" name="file" id="file">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" value="" placeholder="" id="phone" name="phone">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>邮箱:</label>
<div class="formControls col-xs-8 col-sm-9">
<input type="text" class="input-text" placeholder="@" name="email" id="email">
</div>
</div>
<div class="row cl">
<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>状态:</label>
<div class="formControls col-xs-8 col-sm-9 skin-minimal">
<div class="radio-box">
<input type="radio" id="status-1" name="status" value="1" checked>
<label for="status-1">已启用</label>
</div>
<div class="radio-box">
<input type="radio" id="status-0" name="status" value="0">
<label for="status-0">已禁用</label>
</div>
</div>
</div>
<div class="row cl">
<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
<input class="btn btn-primary radius" onclick="check()" type="submit" value=" 提交 ">
</div>
</div>
</form>
</article>
<!--_footer 作为公共模版分离出去-->
{include file="common/footer" /}
<!--/_footer 作为公共模版分离出去-->
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/static/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/jquery.validate.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/validate-methods.js"></script>
<script type="text/javascript" src="/static/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript">
$(function(){
$('.skin-minimal input').iCheck({
checkboxClass: 'icheckbox-blue',
radioClass: 'iradio-blue',
increaseArea: '20%'
});
$("#form-member-add").validate({
rules:{
user_name:{
required:true,
minlength:2,
maxlength:16
},
status:{
required:true,
},
email:{
required:true,
email:true,
},
},
onkeyup:false,
focusCleanup:true,
success:"valid",
submitHandler:function(form){
}
});
});
function check() {
var user_name = $.trim($('#user_name').val());
var email = $.trim($('#email').val());
var phone = $.trim($('#phone').val());
var password = $.trim($('#password').val());
var status = $('input[name=status]:checked').val();
if(user_name=="" || email=="" || phone=="" || password==""){
layer.msg('请填写信息',{icon:2,time:2000});
return false;
}
var formData = new FormData();
formData.append("file", $("#file").get(0).files[0]);
formData.append("user_name", user_name);
formData.append("email", email);
formData.append("phone", phone);
formData.append("password", password);
formData.append("status", status);
$.ajax({
url:"{:url('admin/user/addUser')}",
type:'POST',
data:formData,
cache: false,
contentType: false,
processData: false,
success:function(data){
var data=JSON.parse(data);
var msgs=data.msg;
if(data.status == 1){
layer.msg(msgs, {
icon: 1,
time: 2000
}, function(){
var index = parent.layer.getFrameIndex(window.name);
parent.$('.btn-primary').click();
window.parent.location.reload();
parent.layer.close(index);
});
}else{
layer.msg(msgs,{icon:2,time:2000});
}
}
});
}
</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>
控制器代码如下
public function addUser(){
if(\request()->isPost()){
$insert_array=array();
$insert_array["user_name"]=input("user_name");
$insert_array["password"]=password_hash(input("password"),1);
$insert_array["email"]=input("email");
$insert_array["phone"]=input("phone");
$insert_array["status"]=input("status");
$insert_array["last_time"]=time();
$insert_array["last_ip"]=\request()->ip();
$insert_array["add_time"]=time();
$insert_array["update_time"]=time();
$file=\request()->file("file");
if ($file){
$imgPath="";
if ($file){
$info = $file->move(ROOT_PATH . 'public' . DS . 'upload' . DS . 'user' . DS . date('Y') . DS . date('m-d'),md5(microtime(true)));
if ($info) {
$imgPath = "/upload/user/" . date('Y') . '/' . date('m-d') . '/' . $info->getSaveName();
}
}else{
return $this->error($file->getError());
}
$insert_array["user_logo"]=$imgPath;
$result=Db::name("user")->insert($insert_array);
if ($result){
exit(json_encode(array("status"=>1,"msg"=>"添加成功")));
}else{
exit(json_encode(array("status"=>0,"msg"=>"添加失败")));
}
}else{
echo "<script>alert('请添加图片')</script>";
}
}
return $this->fetch("user-add");
}
在一些的开发中,可能会遇到将图片以base64编码的形式进行上传,
代码如下:
前端代码:
html:
<input class="img-input" type="file" value="" id="test1" data-src="" onchange="basess(this)" />
<img alt class="image" id="img1" src="" />
js:
function add_sumbit() {
var user_logo=$("#test1").attr("data-src");
$.post(
"{:url('admin/user/add')}",
{user_logo:user_logo},
function (data) {
console.log(data);
if(data.code==1){
layer.msg(data.msg,{icon:1});
setTimeout(function () {
parent.layer.closeAll();
parent.location.reload();
},1500);
}else{
layer.msg(data.msg,{icon:2});
}
});
}
function basess(t) {
var file = t.files[0];
var reader = new FileReader();
reader.onload = function(e) {
console.log(e);
var data = e.target.result;
$(t).parent().find('img').attr('src', data);
$(t).attr('data-src', data);
};
reader.readAsDataURL(file);
}
控制器代码:
$user_logo=input("param.user_logo");
if (is_image_base64($user_logo)) {
$upload=new UploadController();
$list["user_logo"]=$upload->upload_base64("user",$user_logo);
} else {
$list["user_logo"] = $user_logo;
}
方法说明:
function is_image_base64($base64) {
if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $base64, $result)){
return true;
}else{
return false;
}
}
upload控制器的方法;
public function upload_base64($type,$img){
if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $img, $result)){
$type_img = $result[2];
$new_files = ROOT_PATH . 'public' . DS . 'upload'. DS . $type. DS . date('Y') . DS . date('m-d') . DS ;
if(!file_exists($new_files)) {
mkdir($new_files, 0777,true);
}
$new_files = $new_files.date("YmdHis").".{$type_img}";
if (file_put_contents($new_files, base64_decode(str_replace($result[1], '', $img)))){
$filenames=str_replace('\\', '/', $new_files);
$file_name=substr($filenames,strripos($filenames,"/upload"));
return $file_name;
}else{
return false;
}
}else{
return false;
}
}