如何使用flutter web将图像直接上传到s3存储桶? [英] How to upload image directly to s3 bucket using flutter web?

问题描述

我一直在关注本教程 https://docs.amplify.aws/lib/storage/getting-started/q/platform/flutter.我有一个使用按钮上传的图像.如何使用 Flutter web 将图像直接上传到 s3 存储桶?我遇到过多个堆栈溢出帖子，其中有答案，但我在任何文件中都找不到正确的答案.我没有后台.我只是想将图像从按钮上传到 s3 存储桶.我只有以下文件.我希望我能得到答案.提前致谢.

I have been following this tutorial https://docs.amplify.aws/lib/storage/getting-started/q/platform/flutter. I have a image that i have uploaded using a button. How can I upload the image directly to s3 bucket using Flutter web ? I have came across multiple stack overflow posts where there are answers but I couldn't find the correct answers in any file. I don't have a backend. I am just trying to upload image from button to s3 bucket. I have the following file only. I hope i could get answers. Thank you in advance.

import 'package:flutter/material.dart';
import 'package:flutter_web_image_picker/flutter_web_image_picker.dart';
void main() {
  runApp(App());
}

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ImagePickerPage(),
    );
  }
}

class ImagePickerPage extends StatefulWidget {
  @override
  _ImagePickerPageState createState() => _ImagePickerPageState();
}

class _ImagePickerPageState extends State<ImagePickerPage> {
  Image image;
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        ElevatedButton(
          child: Text("Select Image"),
          onPressed: () async {
            final _image = await FlutterWebImagePicker.getImage;
            setState(() {
              image = _image;
              print(image);
            });
          },
        ),
        CircleAvatar(
          radius: 50,
          backgroundColor: Colors.transparent,
          child: image != null
              ? image
              : Image.asset(
                  'dummy.png',
                  fit: BoxFit.cover,
                ),
        ),
        SizedBox(
          height: 50,
        ),
        ElevatedButton(
          child: Text("Upload to s3 bucket"),
          onPressed: () {
            print(image.semanticLabel);
          },
        ),
      ],
    );
  }
}

推荐答案

我发现使用 flutter web 将图像直接上传到 s3 存储桶是有点困难的方法.但不是直接上传图像，我可以将图像作为文件对象，然后传递 AWS S3.在选择文件时，我可以验证它只拍摄图像.通过这种方式，我已经成功地将图像上传到 s3，没有太多麻烦.

I find that using flutter web for uploading image directly to s3 bucket is somewhat hard approach. But instead of uploading image directly, i can make image as a file object then, pass on the AWS S3. While choosing file, i can validate it to take images only. In this way, i have successfully uploaded image to s3 without much hassle.

这篇关于如何使用flutter web将图像直接上传到s3存储桶?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！