javascript - 使用vue axios和PHP上传多个文件——只上传一个文件
问题描述
我正在尝试使用 vue 和 axios 创建多文件上传。我的问题是只有ine文件会上传到服务器。这是我使用的代码:模板代码
<input type="file" name="images[]" multiple ref="images" @change="handleUpload()">
JS代码
//this is part of the handleUpload() vue method.
let formData = new FormData();
for(let i;i < $refs.images.files.length; i++){
let file = this.$refs.images.files[i];
formData.append('image', file);
}
axios.post('/upload', formData, { header: { 'Content-Type': 'multipart/form-data' } })
.then( (response) => console.log(response, response.data) )
.catch( (error) => console.log(error) );
PHP服务器代码
// I'm using slim 4 and sirius upload to manage the file validation/upload
use Psr\Http\Message\ResponseInterface as Response;
use Psr\Http\Message\ServerRequestInterface as Request;
use Psr\Http\Message\UploadedFileInterface;
use Slim\Factory\AppFactory;
use Sirius\Upload\Handler as UploadHandler;
require __DIR__ . '/vendor/autoload.php';
$app = AppFactory::create();
$app->post('/platform/api/v1/compress', function(Request $request, Response $response){
$uploadHandler = new UploadHandler('/uploads');
$uploadHandler->addRule('extension', ['allowed' => ['jpg', 'jpeg', 'png']]);
$result = $uploadHandler->process( $request->getUploadedFiles() );
// handle single input with single file upload
if( $result->isValid() ){
$result->confirm();
$url = ["master_image_url" => "/uploads/".$result->name];
$response->getBody()->write(json_encode($url));
}
return $response;
});
$app->run();
我如何上传多个文件?也许我需要修改代码?
解决方案
append
尝试在函数中将“image”更改为“image[]”
例子:
for(let i;i < $refs.images.files.length; i++){
let file = this.$refs.images.files[i];
formData.append('image[]', file);
}
在服务器中
$uploadedFiles=$request->getUploadedFiles();
foreach ($uploadedFiles['image'] as $uploadedFile) {
if ($uploadedFile->getError() === UPLOAD_ERR_OK) {
}
}
推荐阅读
- oracle - Oracle Application Express 11g
- php - 如何在 Laravel 的密码文本字段下方显示条件消息?
- java - 命令在我打开的终端中是可执行的,但是当我使用java函数打开终端并执行它时无法执行
- css - Firefox 模拟打印样式
- mongodb - mongodb 聚合框架中的性能下降
- c - 在c中减去不同大小的数组
- javascript - 我们如何在 jQuery 中使用选择器来选择兄弟姐妹?
- php - PHP - 将字符串添加到查询行数组
- javascript - 为什么 StyleSheet 的 ownerNode 插入后为空?
- geolocation - 无论如何,我们可以知道一个人的真实地理位置,以确保他们不会入侵 GPS