Laravel框架+Blob实现的多图上传功能示例
这篇文章主要介绍了Laravel框架+Blob实现的多图上传功能,结合实例形式详细分析了Laravel框架+Blob进行多张图片上传操作的前端提交与后台处理相关操作技巧,对Laravel框架感兴趣的朋友可以参考下本篇文章
本文实例讲述了Laravel框架+Blob实现的多图上传功能。分享给大家供大家参考,具体如下:
一.介绍
我们知道多图上传一般都附带的又即时显示功能,即上传后可以立刻看到所传图片。之前一直用的一个多图上传插件是选择图片,点击上传然后图片资源上传到服务器,然后返回存储的路径信息,最后我们点击表单的提交按钮后将这些信息插入数据库。
现在有一个尴尬的地方,当我点击上传图片后,我又取消这次表单提交了。可是图片资源已经到服务器了,容易造成空间浪费等。
现在提供一个自己结合Laravel框架写的多图上传,(当然,在任何地方都可以直接套用),特点是:图片上传后可即时显示,但是是通过blob调用的浏览器缓存图片信息,当表单提交后,图片资源才会真正的上传服务器与数据库。
二.前端
注:本例基于Laravel框架
先上Form表单
<form method="post" enctype="multipart/form-data" action="#"> {{csrf_field()}} <ul class="list_btn"> <li><img id="imgone" class="sz" width="100px" height="100px" src="" style="display: none;"></li> <li> <input type="file" id="house_img_one1" name="art_thumb" multiple="multiple" onchange="houseImgOne(this)"></li> </ul> <p class="submit">上传</p> </form>
JS代码:
<script> var _btnId = ''; var all_urls=""; var all_types=""; function houseImgOne(_this) { var img = '<img class="sz" width="100px" height="100px" src="" >' _btnId = $(_this).attr('id'); var obj = document.getElementById("house_img_one1"); var length = obj.files.length; //多图上传时遍历文件信息(可以通过object.files查看) for (var i = 0; i < length; i++) { var objUrl = getObjectURL(_this.files[i]); //图片后缀类型拼接 all_types=all_types+_this.files[i].type; //将图片转换成base64自字符 var oFReader = new FileReader(); oFReader.readAsDataURL(_this.files[i]); oFReader.onload = function (oFREvent) { all_urls=all_urls+oFREvent.target.result+"&|||"; //拼接data形式base64的url }; if (objUrl) { $('.sz:last').before(img); $('.sz').eq($(".sz").length - 2).attr("src", objUrl); } } } //点击提交按钮触发ajax $(".submit").click(function(){ //console.log(all_types); $.ajax({ type:"post", url:"{{url('admin/img')}}", data:{'imgs':all_urls,'types':all_types,'_token':"{{csrf_token()}}"}, dataType:"json", success:function(data){ if (data==1){ // layer插件提示,可自行选择则 layer.msg("上传成功", {icon: 6}); window.location.reload(); }else { alert("上传失败!"); } } }); }); //获取blog对象url(实际获取的是缓存中的图片路径信息,用于即时显示,并非服务器返回的实际资源路径) function getObjectURL(file) { var url = null; if (window.createObjectURL != undefined) { url = window.createObjectURL(file); } else if (window.URL != undefined) { url = window.URL.createObjectURL(file); } else if (window.webkitURL != undefined) { url = window.webkitURL.createObjectURL(file); } return url; } </script>
三.后台处理代码
public function store(Request $request) { $data=$request->all(); $imgs = $data['imgs']; // array_values()用于重置数组下标 $types =array_values(array_filter(explode('image/',$data['types']))); $arr=array_values(array_filter(explode('&|||',$imgs))); foreach ($arr as $k => $v){ //文件路径 $filepath = base_path().'/storage/app/imgs/'.date('YmdHis').$k.'.'.$types[$k]; //提取base64字符 $imgdata = substr($v,strpos($v,",") + 1); $decodedData = base64_decode($imgdata); file_put_contents($filepath,$decodedData ); //插入数据库 $img = new Img; $filepath = strchr($filepath,'/'); $img->img_path=$filepath; $img->save(); }
以上就是本篇文章的所有内容,希望对大家的学习提供到帮助!
相关推荐:
Laravel Service Provider开发设置延迟加载时遇到的问题
Atas ialah kandungan terperinci Laravel框架+Blob实现的多图上传功能示例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

PHP dan Flutter ialah teknologi popular untuk pembangunan mudah alih. Flutter cemerlang dalam keupayaan merentas platform, prestasi dan antara muka pengguna, dan sesuai untuk aplikasi yang memerlukan prestasi tinggi, merentas platform dan UI tersuai. PHP sesuai untuk aplikasi sebelah pelayan dengan prestasi yang lebih rendah dan bukan merentas platform.

Operasi pangkalan data dalam PHP dipermudahkan menggunakan ORM, yang memetakan objek ke dalam pangkalan data hubungan. EloquentORM dalam Laravel membolehkan anda berinteraksi dengan pangkalan data menggunakan sintaks berorientasikan objek Anda boleh menggunakan ORM dengan mentakrifkan kelas model, menggunakan kaedah Eloquent atau membina sistem blog dalam amalan.

Laravel - Perintah Artisan - Laravel 5.7 hadir dengan cara baharu untuk merawat dan menguji arahan baharu. Ia termasuk ciri baharu untuk menguji arahan artisan dan demonstrasi disebut di bawah?

Analisis alat ujian unit PHP: PHPUnit: sesuai untuk projek besar, menyediakan fungsi yang komprehensif dan mudah dipasang, tetapi mungkin bertele-tele dan perlahan. PHPUnitWrapper: sesuai untuk projek kecil, mudah digunakan, dioptimumkan untuk Lumen/Laravel, tetapi mempunyai fungsi terhad, tidak menyediakan analisis liputan kod dan mempunyai sokongan komuniti terhad.

Versi terkini Laravel 9 dan CodeIgniter 4 menyediakan ciri dan penambahbaikan yang dikemas kini. Laravel9 menggunakan seni bina MVC dan menyediakan fungsi seperti migrasi pangkalan data, pengesahan dan enjin templat. CodeIgniter4 menggunakan seni bina HMVC untuk menyediakan penghalaan, ORM dan caching. Dari segi prestasi, corak reka bentuk berasaskan pembekal perkhidmatan Laravel9 dan rangka kerja ringan CodeIgniter4 memberikannya prestasi cemerlang. Dalam aplikasi praktikal, Laravel9 sesuai untuk projek kompleks yang memerlukan fleksibiliti dan fungsi berkuasa, manakala CodeIgniter4 sesuai untuk pembangunan pesat dan aplikasi kecil.

Bandingkan keupayaan pemprosesan data Laravel dan CodeIgniter: ORM: Laravel menggunakan EloquentORM, yang menyediakan pemetaan hubungan kelas-objek, manakala CodeIgniter menggunakan ActiveRecord untuk mewakili model pangkalan data sebagai subkelas kelas PHP. Pembina pertanyaan: Laravel mempunyai API pertanyaan berantai yang fleksibel, manakala pembina pertanyaan CodeIgniter lebih ringkas dan berasaskan tatasusunan. Pengesahan data: Laravel menyediakan kelas Pengesah yang menyokong peraturan pengesahan tersuai, manakala CodeIgniter mempunyai kurang fungsi pengesahan terbina dalam dan memerlukan pengekodan manual peraturan tersuai. Kes praktikal: Contoh pendaftaran pengguna menunjukkan Lar

Unit PHP dan Panduan Pengujian Penyepaduan Pengujian Unit: Fokus pada satu unit kod atau fungsi dan gunakan PHPUnit untuk mencipta kelas kes ujian untuk pengesahan. Ujian integrasi: Beri perhatian kepada cara berbilang unit kod berfungsi bersama, dan gunakan kaedah setUp() dan tearDown() PHPUnit untuk menyediakan dan membersihkan persekitaran ujian. Kes praktikal: Gunakan PHPUnit untuk melaksanakan ujian unit dan penyepaduan dalam aplikasi Laravel, termasuk mencipta pangkalan data, memulakan pelayan dan menulis kod ujian.

Apabila memilih rangka kerja untuk projek besar, Laravel dan CodeIgniter masing-masing mempunyai kelebihan mereka sendiri. Laravel direka untuk aplikasi peringkat perusahaan, menawarkan reka bentuk modular, suntikan pergantungan dan set ciri yang berkuasa. CodeIgniter ialah rangka kerja ringan yang lebih sesuai untuk projek kecil hingga sederhana, menekankan kelajuan dan kemudahan penggunaan. Untuk projek besar dengan keperluan yang kompleks dan bilangan pengguna yang ramai, kuasa dan kebolehskalaan Laravel adalah lebih sesuai. Untuk projek atau situasi mudah dengan sumber terhad, keupayaan pembangunan CodeIgniter yang ringan dan pantas adalah lebih ideal.
