Rumah pembangunan bahagian belakang tutorial php Laravel框架+Blob实现的多图上传功能示例

Laravel框架+Blob实现的多图上传功能示例

Jan 13, 2018 am 11:48 AM
laravel muat naik

这篇文章主要介绍了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>
Salin selepas log masuk

JS代码:

<script>
  var _btnId = &#39;&#39;;
  var all_urls="";
  var all_types="";
  function houseImgOne(_this) {
    var img = &#39;<img class="sz" width="100px" height="100px" src=""  >&#39;
    _btnId = $(_this).attr(&#39;id&#39;);
    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) {
        $(&#39;.sz:last&#39;).before(img);
        $(&#39;.sz&#39;).eq($(".sz").length - 2).attr("src", objUrl);
      }
    }
  }
  //点击提交按钮触发ajax
    $(".submit").click(function(){
    //console.log(all_types);
    $.ajax({
      type:"post",
      url:"{{url(&#39;admin/img&#39;)}}",
      data:{&#39;imgs&#39;:all_urls,&#39;types&#39;:all_types,&#39;_token&#39;:"{{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>
Salin selepas log masuk

三.后台处理代码

public function store(Request $request)
{
  $data=$request->all();
  $imgs = $data[&#39;imgs&#39;];
  // array_values()用于重置数组下标
  $types =array_values(array_filter(explode(&#39;image/&#39;,$data[&#39;types&#39;])));
  $arr=array_values(array_filter(explode(&#39;&|||&#39;,$imgs)));
  foreach ($arr as $k => $v){
  //文件路径
  $filepath = base_path().&#39;/storage/app/imgs/&#39;.date(&#39;YmdHis&#39;).$k.&#39;.&#39;.$types[$k];
  //提取base64字符
  $imgdata = substr($v,strpos($v,",") + 1);
  $decodedData = base64_decode($imgdata);
  file_put_contents($filepath,$decodedData );
  //插入数据库
  $img = new Img;
  $filepath = strchr($filepath,&#39;/&#39;);
  $img->img_path=$filepath;
  $img->save();
}
Salin selepas log masuk

以上就是本篇文章的所有内容,希望对大家的学习提供到帮助!

相关推荐:

零起步构建一个基于Docker的Laravel应用

七个非常有用的Laravel中Carbon方法

Laravel Service Provider开发设置延迟加载时遇到的问题

Atas ialah kandungan terperinci Laravel框架+Blob实现的多图上传功能示例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
2 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Repo: Cara menghidupkan semula rakan sepasukan
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Cara mendapatkan biji gergasi
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

PHP vs. Flutter: Pilihan terbaik untuk pembangunan mudah alih PHP vs. Flutter: Pilihan terbaik untuk pembangunan mudah alih May 06, 2024 pm 10:45 PM

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.

Bagaimana untuk menggunakan pemetaan hubungan objek (ORM) dalam PHP untuk memudahkan operasi pangkalan data? Bagaimana untuk menggunakan pemetaan hubungan objek (ORM) dalam PHP untuk memudahkan operasi pangkalan data? May 07, 2024 am 08:39 AM

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 - Perintah Artisan Aug 27, 2024 am 10:51 AM

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 kelebihan dan kekurangan alat ujian unit PHP Analisis kelebihan dan kekurangan alat ujian unit PHP May 06, 2024 pm 10:51 PM

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.

Perbandingan versi terkini Laravel dan CodeIgniter Perbandingan versi terkini Laravel dan CodeIgniter Jun 05, 2024 pm 05:29 PM

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.

Bagaimanakah keupayaan pemprosesan data dalam Laravel dan CodeIgniter dibandingkan? Bagaimanakah keupayaan pemprosesan data dalam Laravel dan CodeIgniter dibandingkan? Jun 01, 2024 pm 01:34 PM

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

Ujian unit kod PHP dan ujian integrasi Ujian unit kod PHP dan ujian integrasi May 07, 2024 am 08:00 AM

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.

Laravel vs CodeIgniter: Rangka kerja manakah yang lebih baik untuk projek besar? Laravel vs CodeIgniter: Rangka kerja manakah yang lebih baik untuk projek besar? Jun 04, 2024 am 09:09 AM

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.

See all articles