在summernote中复制粘贴屏幕截图并作为文件上传答案

【问题标题】：copy paste screenshot in summernote and upload as file在summernote中复制粘贴屏幕截图并作为文件上传
【发布时间】：2016-06-17 08:34:53
【问题描述】：

我正在使用带有PHP的summernote文本编辑器，我可以拖放图像文件.png，.jpeg，并且可以上传图像并获取返回的图像路径和显示图像。

我确实使用 codeigniter，下面用于验证图像，

$config['upload_path']   = './uploads/parts/';
$config['allowed_types'] = 'gif|jpg|png|jpeg';
$config['max_size']      = '2000';
$config['encrypt_name']  = TRUE;
$config['remove_spaces'] = TRUE;

当我拖放 png 扩展文件时，它可以完美运行，下面是请求 paylod，预计会运行，因为文件已经具有 png 扩展名。

------WebKitFormBoundaryZoezKRGNH5LYW3oL
Content-Disposition: form-data; name="userfile"; filename="2016-06-17_12-53-01.png"
Content-Type: image/png


------WebKitFormBoundaryZoezKRGNH5LYW3oL--

但是当我截取屏幕截图并简单地复制它并粘贴到编辑器中时，它会变成 BLOB，我的验证抛出错误，

------WebKitFormBoundaryagedeUpo2DrEPCbg
Content-Disposition: form-data; name="userfile"; filename="blob"
Content-Type: image/png


------WebKitFormBoundaryagedeUpo2DrEPCbg--

并且由于没有文件扩展名，它会抛出错误The filetype you are attempting to upload is not allowed.

我们如何以 .png 格式发送复制粘贴图像，或者我应该允许哪个扩展名？

谢谢，

【问题讨论】：

标签： php image upload

【解决方案1】：

转到application/config/mimes.php

'gif'   =>  'image/gif',
'jpeg'  =>  array('image/jpeg', 'image/pjpeg'),
'jpg'   =>  array('image/jpeg', 'image/pjpeg'),
'jpe'   =>  array('image/jpeg', 'image/pjpeg'),
'png'   =>  array('image/png',  'image/x-png'),

如果它仍然失败 echo pathinfo($fileName, PATHINFO_EXTENSION); 并检查扩展名并模仿

阅读CodeIgniter Image and File Upload in Formget.com

【讨论】：

这与我的 mimes 文件相同，但如何允许该 blob 文件？见 filename="blob" 它没有扩展名。
@rjcode 允许所有，添加这个$config['allowed_types'] = '';
我以另一种方式做到了，我不希望一切都被允许，我所做的是将文件名更改为始终 upload.png，我将在这里发布我的答案
这就是我在回答中提到的内容
我修改了 JS，而不是 PHP 控制器。

【解决方案2】：

我确实修改了我的上传 JS，

早先的如下，

data = new FormData();
data.append("userfile", files[0])

因此，它会根据附加的文件名示例 myfilename.png 获取文件名，

现在要删除文件名的依赖关系，我将代码更改为下面，

data = new FormData();
data.append("userfile", files[0], upload.png)

所以现在所有的复制粘贴图像和拖放图像文件将始终作为upload.png。甚至 blob 也会被命名为 upload.png。

参考——https://developer.mozilla.org/en-US/docs/Web/API/FormData/append

【讨论】：