要使用多图片上传,首先要在input添加multipart,同时注意name的参数要加[],不然,不算是数组。具体如下,注意绿色地方。如果是单张图片,把[]去掉,不要multiple;

<input type="file" name="up_photos[]" class="form-control-file" v-model="up_photos" multiple>

jquery异步上传

$.ajax({
url: "/base/test",
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function (returndata) {
console.log(returndata);
},
error: function (returndata) {
console.log(returndata);
} });

控制器里的设置

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use Illuminate\Support\Facades\Storage;

class BaseController extends Controller
{
public function test(Request $r)
{
$pathname = "/public/images/".date('Y/m/d'); $photo_paths=[];
if(isset($r->up_photos)){
foreach ($r->up_photos as $key => $photo) {
$photo_paths[]=$photo->store($pathname);
}
}
return $photo_paths;
} }

其中返回的是图片链接,也可以直接保存到数据库。

有时我们要判断文件类型,下面举例

$file->getClientOriginalName()   这个是取文件名;

$file->getMimeType()   这个是取文件类型 如 image/jpeg

larave异步多图片上传的实现和注意事项及$file的对象函数的更多相关文章

  1. Newtonsoft.Json C# Json序列化和反序列化工具的使用、类型方法大全 C# 算法题系列(二) 各位相加、整数反转、回文数、罗马数字转整数 C# 算法题系列(一) 两数之和、无重复字符的最长子串 DateTime Tips c#发送邮件,可发送多个附件 MVC图片上传详解

    Newtonsoft.Json C# Json序列化和反序列化工具的使用.类型方法大全   Newtonsoft.Json Newtonsoft.Json 是.Net平台操作Json的工具,他的介绍就 ...

  2. vue图片上传组件

    前言:很多项目中都需要用到图片上传功能,而其多处使用的要求,为了避免重复造轮子,让我决定花费一些时间去深入了解,最终封装了一个vue的图片上传组件.现将总结再次,希望有帮助. Layout <d ...

  3. [python][flask] Flask 图片上传与下载例子(支持漂亮的拖拽上传)

    目录 1.效果预览 2.新增逻辑概览 3.tuchuang.py 逻辑介绍 3.1 图片上传 3.2 图片合法检查 3.3 图片下载 4.__init__.py 逻辑介绍 5.upload.html ...

  4. PHP 图片上传工具类(支持多文件上传)

    ====================ImageUploadTool======================== <?php class ImageUploadTool { private ...

  5. html之file标签 --- 图片上传前预览 -- FileReader

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  6. MVC图片上传详解

    MVC图片上传--控制器方法 新建一个控制器命名为File,定义一个Img方法 [HttpPost]public ActionResult Img(HttpPostedFileBase shangch ...

  7. file图片上传之前先预览

    链接:https://www.cnblogs.com/tandaxia/p/5125275.html 记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<inp ...

  8. file标签 - 图片上传前预览 - FileReader & 网络图片转base64和文件流

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  9. vue+axios实现移动端图片上传

    在利用vue做一些H5页面时,或多或少会遇到有图片上传的操作,主要是运用html5里面的input[type=file]来实现,传递到后端的数据是以二进制的格式传递,所以上传图片的请求与普通的请求稍微 ...

随机推荐

  1. $m$ 整除 $10^k$ 的一个充分条件

    若 (1) 既约分数 $\cfrac{n}{m}$ 满足 $0<\cfrac{n}{m}<1$; (2) 分数 $\cfrac{n}{m}$ 可以化为小数部分的一个循环节有 $k$ 位数字 ...

  2. requests.session

    # -*- coding: utf-8 -*- """requests.session~~~~~~~~~~~~~~~~ This module provides a Se ...

  3. 利用div绘制细线居中

    利用div配合css代码实现细线方式: 块级元素水平居中步骤: 设置宽度width 设置margin-left:auto; 设置margin-right:auto; 实现方法是,让其左右两边的外边距自 ...

  4. gulp学习笔记——最好的学习文档是官网

    官网:http://www.gulpjs.com.cn/docs/api/ 当然还有一个博客写的也很好,当我看不下去官网的时候,这个帮助了我很多,明了易懂:http://www.ydcss.com/a ...

  5. 使用node.js 脚手架搭建Vue项目

    1.安装node.js https://nodejs.org/zh-cn/ 下载安装node.js 在命令行测试 node -v 输出版本号说明安装成功 2.使用npm更新安装cpnm npm ins ...

  6. Ansible------常用功能

    local_action Ansible 默认只会对控制机器执行操作,但如果在这个过程中需要在 Ansible 本机执行操作就需要使用到local_action become:True Ansible ...

  7. python 中and,or计算规则

    and :如果表达式都不为假,则返回最后一个表达式的值,如果为假返回第一个表达式为假的值.(遇到假的表达式就返回此表达式的值) or :如果都为假,,返回最后一个假表达式的值,如果有真,则返回第一个真 ...

  8. vue 使用swiper的一些问题(页面渲染问题)

    //Swiper上下滚动初始化 swiper_init(){ this.$nextTick(function(){ var mySwiper = new Swiper ('.swiper-contai ...

  9. 此主机支持Intel VT-x,但Intel VT-x处于禁用状态

    原因:未开启虚拟化技术 解决方法:https://www.cnblogs.com/jiefu/p/10711955.html

  10. 【深度学习】吴恩达网易公开课练习(class2 week1 task2 task3)

    正则化 定义:正则化就是在计算损失函数时,在损失函数后添加权重相关的正则项. 作用:减少过拟合现象 正则化有多种,有L1范式,L2范式等.一种常用的正则化公式 \[J_{regularized} = ...