tp5简单的图片上传

这里运用的是tp5的原始的图片上传功能如下：（1）增加了校验器验证图片格式，如果有兴趣的还可以添加大小等验证。（2）图片上传后显示图片。（3）等待更新的功能：图片上传实时预览，并将路径存入数据库。

一，创建index/controller/index.php控制器

<?php
namespace app\index\controller;
use think\Image;
use think\Controller;
class Index extends Controller
{

    // 文件上传表单
    public function index()
    {
        return $this->fetch();
    }

    // 图片上传处理
    public function picture()
    {

        // 获取表单上传文件 例如上传了001.jpg
        $file = request()->file('image');
        //校验器，判断图片格式是否正确
        if (true !== $this->validate(['image' => $file], ['image' => 'require|image'])) {
            $this->error('请选择图像文件');
        } else {
            // 移动到框架应用根目录/public/uploads/ 目录下
            $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
            if ($info) {
                // 成功上传后 获取上传信息

                //存入相对路径/upload/日期/文件名
                $data = DS . 'uploads' . DS . $info->getSaveName();
                //模板变量赋值
                $this->assign('image', $data);
                return $this->fetch('index');
            } else {
                // 上传失败获取错误信息
                echo $file->getError();
            }
        }
    }

二，创建视图文件index/view/index.html

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>图像上传和处理示例</title>
    <style>
        body {font-family:"Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif;
            font-size:16px;
            padding:5px;
        }.form{padding: 15px;
            font-size: 16px;
        }.form .text {padding: 3px;
            margin:2px 10px;
            width: 240px;
            height: 24px;
            line-height: 28px;
            border: 1px solid #D4D4D4;
        }.form select {padding: 5px;
            margin:2px 10px;
            width: 150px;
            height: 30px;
            line-height: 30px;
            border: 1px solid #D4D4D4;
        }.form .btn{margin:6px;
            padding: 6px;
            width: 120px;

            font-size: 16px;
            border: 1px solid #D4D4D4;
            cursor: pointer;
            background:#eee;
        }.form .file{margin:6px;
            padding: 6px;
            width: 220px;

            font-size: 16px;
            border: 1px solid #D4D4D4;
            cursor: pointer;
            background:#eee;
        }a{color: #868686;
            cursor: pointer;
        }a:hover{text-decoration: underline;
        }h2{color: #4288ce;
            font-weight: 400;
            padding: 6px 0;
            margin: 6px 0 0;
            font-size: 28px;
            border-bottom: 1px solid #eee;
        }div{margin:8px;
        }</style>
</head>
<body>
<h2>图像上传和处理示例</h2>
<form method="post" enctype="multipart/form-data" class="form" action="{:url('picture')}">
    选择图像文件：<input type="file" class="file" name="image"><br/>
    <input type="submit" class="btn" value=" 提交 ">
</form>
<div style="width: 200px;height: 500px;">
    <img src="{$image}"/>
</div>
</body>
</html>

第三,创建上传文件夹public/uploads

tp5简单的图片上传相关推荐

alert()的功能_前端实现简单的图片上传小图预览功能
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
python自动上传图片_使用Python实现一个简单的图片上传存储服务
使用flask实现的一个简单的图片上传服务设计初衷对于图片的存储,有很多选择,一般采用云服务如(七牛,又拍等),但是国内的服务像七牛自定义域名竟然需要域名备案(Excuse me,当初就是因为备 ...
用go来搭建一个简单的图片上传网站
提前说明一下:代码参考了<Go语言编程>,稍有变动, 自己亲自玩了一遍. 之前玩过go web server, 现在来用go来搭建一个简单的图片上传网站, 工作目录是:~/photoweb ...
用jsp实现简单的图片上传功能
用jsp实现简单的图片上传功能 1 先做一个页面,选择上传的图片 <body><form action="uploadServlet" enctype=" ...
一个.net6简单的图片上传（文件也可用）
#一个.net6简单的图片上传(文件也可用) ##页面 @{ViewData["Title"] = "图片上传Demo"; }<form asp-acti ...
bootstrap-fileinput的简单使用(图片上传和编辑)
简介: 一款非常优秀的HTML5文件上传插件,支持bootstrap 3.x 和4.x版本,具有非常多的特性:多文件选择.这个插件能最简单的帮你完成文件上传功能,且使用bootstrap样式.还支持多 ...
tp3.2简单的图片上传实现
//定义文件上传相关目录常量 define('ROOT_PATH', __DIR__); define('UPLOAD_PATH', '/Public/Uploads/'); //现在model封装一 ...
使用 PHP 实现简单的图片上传
一.HTML 表单准备 <!doctype html> <html lang="en"><head><meta charset=" ...
jquery批量上传图片 java_简单多图片上传 jquery+java 代码
/** 添加歌曲 */ function addSong(){ var id=$("#_activity_id").val(); window.location.href = &q ...
简单的图片上传和下载
一.图片的上传 1.图片的来源无非是照相和图库的选择将选择的图片进行封装到bean类中进行返回,之后通过上传的方式去上传 2.上传的方式也是两种方式,通过的字符串或者流的方式(先建立链接在通过流) ...

tp5简单的图片上传

tp5简单的图片上传相关推荐

最新文章

热门文章