Ajax_上传文件(FormData)

• 第一种

    <input  id="file" type="file" name="file">
    <br>
    <button id="upload" type="button" >Upload</button>

<script>
    $(function () {
        $('#upload').click(function() {
            var file = $("#file")[0].files[0];
            var formData = new FormData();
            formData.append("file",file);
            console.log(formData.get('file'));
            $.ajax({
                url: '/doupl/',
                type: "post",
                data: formData,
                dataType:'json',
                cache: false,
                processData:false,
                contentType:false,
                success: function(res) {
                    console.log(res)
                },
                error: function(err) {
                    // console.log(err)
                }
            })
        })
    })
</script>

• 第二种

    上传文件:<input name="file" type="file" id="file">

    <script>
        $(function () {
            $('#file').change( function () {
                var file = this.files[0];
                var formData = new FormData();
                formData.append('file', file);
                console.log(formData.get('file'))
                $.ajax({
                    url: "/doupl/",
                    type: 'post',
                    data: formData,
                    dataType:'json',
                    cache: false,
                    processData: false,    //不需要对数据做任何预处理
                    contentType: false,    //不设置数据格式
                    success:function (data) {
                        console.log(data);
                    },
                    error:function () {
                        console.log('失败');
                    }
                });
            });
        });
    </script>

• php后端

<?php
/**
 * Created by PhpStorm.
 * User: 14280
 * Date: 2019/8/30
 * Time: 9:21
 */

namespace app\index\controller;


use think\Controller;
use think\Db;
use think\Request;
use think\File;

class Upload extends Controller
{

    public function index()
    {

        return view(
            'uploade/uploade'
        );
    }

    public function doUpl(Request $request)
    {

        $file = $request->file('file');// 获取表单上传文件

        if(empty($file)){
            $this->error('请上传文件');
        }

        if($file){
            // 移动到框架应用根目录/public/uploads/ 目录下
            $info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');

//            dump($info);die();
            if($info){
                // 成功上传后 获取上传信息
                $info->getSaveName();// 输出 20160820/42a79759f284b767dfcb2a0197904287.jpg
                $info->getFilename();// 输出 42a79759f284b767dfcb2a0197904287.jpg
                //拼接路径和文件名存入数据库
                $files = DS . 'uploads' . DS . $info->getSaveName();
//                dump($files);

                $data = ['file' => $files];
//                dump($data);
//                die();

                $res = Db::table('tpfile')->insert($data);
//                dump($res);
//                die();
                if ($res > 0){
                    $ouinfo['status'] = true;
                    $ouinfo['ouinfo'] = '上传成功';
                }else{
                    $ouinfo['status'] = false;
                    $ouinfo['ouinfo'] = '上传失败,请重试';
                }

            } else{
                // 上传失败获取错误信息
                $file->getError();
            }

        }

        return json($ouinfo);
    }
}