【问题标题】:Failed to detect the image when an image sent form MultipartRequest in flutter在颤动中从 MultipartRequest 发送图像时无法检测到图像
【发布时间】:2020-09-01 04:54:56
【问题描述】:

我正在从包 image_picker 中获取图像:^0.6.6+1

我正在尝试将图像从 http.MultipartRequest 上传到无法识别图像的节点服务器。

当我使用 formdata 作为来自邮递员的图像发送 POST 请求时,图像正在被上传。

这里是代码

events.dart

import 'dart:io';
import 'package:flutter/material.dart';
import './event.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

Future<void> addEvents(Event event, File uploadPoster) async {
final url = 'http://10.0.2.2:8080/event/event';
String fileName = uploadPoster.path.split("/").last;
var request = http.MultipartRequest('POST', Uri.parse(url));
request.files
    .add(http.MultipartFile(
      'image',
      uploadPoster.readAsBytes().asStream(),
      uploadPoster.lengthSync(), 
      filename: fileName
    ));

  request.fields['titleOfTheEvent'] = event.title;
  request.fields['startingDateOfTheEvent'] = event.eventStartDate;
  request.fields['endingDateOfTheEvent'] = event.eventEndDate;
  request.fields['venue'] = event.venue;
  request.fields['industry'] = event.industry;
  request.fields['numberOfStalls'] = event.numberOfStalls;
  request.fields['stallBookingContactNumber'] = event.contactNumber;
  request.fields['description'] = event.description;
  request.fields['ticketSaleLink1'] = event.ticketSaleLink1;
  request.fields['ticketSaleLink2'] = event.ticketSaleLink2;
  request.fields['ticketSaleLink3'] = event.ticketSaleLink3;
  request.fields['eventLinkFacebook'] = event.facebookEventLink;
  request.fields['eventLinkInstagram'] = event.instagramEventLink;
  request.fields['token'] = authToken;

var res= await request.send();
}

app.js

const express = require('express');
const bodyparser = require('body-parser');
const mongoose = require('mongoose');
const multer = require('multer');
const path = require('path');
const eventRoutes = require('./routes/eventRouter');
const companyRoutes = require('./routes/companyRouter');
const authrouter = require('./routes/authrouter');
const exhibitorrouter = require('./routes/exhibitorrouter');
const stallsrouter = require('./routes/stallrouter');

const app = express();


app.use(bodyparser.json());
app.use('/images', express.static(path.join(__dirname, 'images')));

app.use((req, res, next) => {
    res.setHeader('Access-Control-Allow-Origin', '*');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, PATCH, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');
    next();
})

const fileStorage = multer.diskStorage({
    destination: (req, file, cb) => {
        cb(null, './images/');
    },
    filename: (req, file, cb) => {
        cb(null, file.originalname);
    }

});

const fileFilter = (req, file, cb) => {
    if (
        file.mimetype === 'image/png' ||
        file.mimetype === 'image/jpg' ||
        file.mimetype === 'image/jpeg'
    ) {
        cb(null, true);
    } else {
        cb(null, false);
    }
};

app.use(
    multer({ storage: fileStorage, fileFilter: fileFilter }).single('image')
);

app.use('/images', express.static(path.join(__dirname, 'images')));

app.use('/auth', authrouter);
app.use('/event', eventRoutes);
app.use('/company', companyRoutes);
app.use('/exhibitor', exhibitorrouter);
app.use('/stalls', stallsrouter);

app.use((error, req, res, next) => {
    console.log('App ' + error);
    const status = error.statusCode || 500;
    const message = error.message;
    const data = error.data;
    res.status(status).json({ error: message, data: data });
});

mongoose.connect('mongodb://localhost:27017/scope').then(result => {
    app.listen(8080)
}).catch(err => console.log(err));

【问题讨论】:

标签: node.js flutter dart multer


【解决方案1】:

这是使用颤振将图片上传到节点服务器的示例代码:

https://gist.github.com/chunhunghan/7711ca0f6a0e9cb3d41f5b50d2d857ba

其他尝试 Flutter dio 包 (https://pub.dev/packages/dio)

【讨论】:

    猜你喜欢
    • 2021-11-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-10-21
    • 2016-01-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多