formData上传图片，php获取不到图片扩展名

Question

前端用javascript剪裁完一张图片后，把图片放到formData对象中ajax上传到后台（Laravel），header内容是这样：

后台dd一下接收到的图片：

    public function changeAvatar(Request $request)
    {

        $file = $request->file('croppedImage');
        dd($file);

    }

返回的结果是这样：

可是，获取不到图片的扩展名,下面这样dd()扩展名得到的是一个空字符串''：

    public function changeAvatar(Request $request)
    {
        $file = $request->file('croppedImage');
        $extension = $file->getClientOriginalExtension();
        dd($extension);
    }

不知哪里有问题，麻烦解答一下。
下面是js代码，用到了cropper这个js剪裁工具 https://github.com/fengyuanch...

        $('#uploadAvatar').on('click', function (e) {

            $("#image").cropper('getCroppedCanvas').toBlob(function (blob) {
                var formData = new FormData();

                formData.append('croppedImage', blob);

                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                $.ajax({
                    type: "POST",
                    url: "{{ url('/avatar') }}",
                    processData: false,
                    contentType: false,
                    cache: false,
                    data: formData
                }).done(function (response) {
                    //...
                }).fail(function (data) {
                    //...
                });
            });
        });

Answer 1

不知道题主js怎么是写的，下面是我的Demo

javascript

var token = $("#token").attr('content');
var info = new FormData(document.getElementById('test'));
info.append('_token', token);
$.ajax({
    url: "/test",
    type: "POST",
    data: info,
    processData: false,
    contentType: false
}).done(function () {
    //......
}).fail(function () {
    //......
});

php

public function file (Request $request)
{
    $file = $request->file('image');
    
    $file->getMimeType();                   //文件类型
    $file->getClientOriginalExtension();    //文件后缀
}

结果

Answer 2

扩展名一般是从filename中取的，而你的filename是blob没有包含扩展名，js提交可能有问题。
未贴出js部分代码无法确认怎么修改

在你php部分$file输出可以看到有个--mimeType,你可以先判断前面部分是否为image/，如果不是就提示上传文件必须为图片格式。然后直接用str_replace替换掉image/剩下的就是扩展名。

Answer 3

问题解决了，因为用了canvas进行裁剪之后，得到的文件是没有后缀的，得到的filename不是‘*.jpg’这种格式的，后台拿到的文件也没有后缀名，所以给所有上传的图片指定扩展名。

---

fd.append('avatar', blob, '.jpg')
fd.append('filename', blob + '.jpg')

这样发送的数据是

后台会存入格式为*.jpg的文件