首页 > 解决方案 > 在 laravel 5.6 中使用 ajax 发布图片

问题描述

我想为ckeditor创建一个上传适配器,

我的 laravel ajax 应用程序有问题,

这是我的代码。

export default class UploadAdapter {
    constructor(loader) {
        this.loader = loader;
    }

   upload() {
    return new Promise((resolve, reject) => {
        let data = new FormData();
        data.append('upload', this.loader.file);


        $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: '/loadImage',
            type: 'POST',
            data: data,
            dataType: 'json',
            async:false,
            processData: false,
            contentType: false,
            success: function (data) {
                console.log(data.get('upload'));
            },
            error: function (request, status, error) {
                console.log(error);
            }
        });
     });
   }
}

我坚持用 ajax 响应 laravel 控制器。

这是我的控制器功能:

       try {
            $file = $request->file('upload');

            $uploader = MediaUploader::fromSource($file);
            $uploader->setAllowedMimeTypes(['image/jpeg', 'image/gif', 'image/png']);
            $uploader->setAllowedExtensions(['jpg', 'jpeg', 'png', 'gif']);
            $media = $uploader->upload();

            return response()->json([
                'uploaded' => true,
                'url' => $media->getUrl()
            ]);
        } catch (\Exception $e) {
            return response()->json(
                [
                    'uploaded' => false,
                    'error' => [
                        'message' => $e->getMessage()
                    ]
                ]
            );
        }

这是我的错误

SyntaxError: Unexpected end of JSON input
    at parse (<anonymous>)
    at ajaxConvert (app.js:11826)
    at done (app.js:12294)
    at XMLHttpRequest.<anonymous> (app.js:12587)

我的代码有什么错误???

我无法在 laravel 控制器中获取文件信息..

我该如何解决这个问题...?请帮帮我!!!

标签: javascriptphpajaxlaravel

解决方案


您有数据 - 为空

JSON.parse(''); // SyntaxError: Unexpected end of input

添加验证:

data = data != "" ? $.parseJSON(data) : {};

推荐阅读