image - 使用AWS Amplify从React Native上传到S3(Upload to S3 from React Native with AWS Amplify)

Question

I'm trying to upload an image to S3 from React Native using Amplify.

(我正在尝试使用Amplify将图像从React Native上传到S3。)

I am able to upload a text file SUCCESSFULLY.

(我能够成功上传文本文件。)

But not an image.

(但不是图像。)

Here is my code:

(这是我的代码：)

import React from 'react';
import {View, Text, Button, Image} from 'react-native';
import {identityPoolId, region, bucket} from '../auth';
import image from '../assets/background.png';
import Amplify, {Storage} from 'aws-amplify';

Amplify.configure({
    Auth: {identityPoolId,region},
    Storage : {bucket,region}
})

const upload = () => {
    Storage.put('logo.jpg', image, {contentType: 'image/jpeg'})
        .then(result => console.log('result from successful upload: ', result))
        .catch(err => console.log('error uploading to s3:', err));
}

const get = () => {   //this works for both putting and getting a text file
    Storage.get('amir.txt')
        .then(res => console.log('result get', res))
        .catch(err => console.log('err getting', err))
}

export default function ImageUpload(props) {

    return (
        <View style={{alignItems : 'center'}}>
            <Image style={{width: 100, height: 100}} source={image} />
            <Text>Click button to upload above image to S3</Text>
            <Button title="Upload to S3" onPress={upload}/>
            <Button title="Get from S3" onPress={get}/>
        </View>
    )

}

the error message is:

(错误消息是：)

error uploading to s3: [Error: Unsupported body payload number]

  ask by Amir Yunas translate from so

Answer 1

In our recent Single Page Application (SPA) style web application, from React, we used "S3 Signed URLs" for efficient upload/download of files and I felt this has resulted in a cleaner design as compared to direct upload/download.

(在我们最近的React单页应用程序（SPA）样式的Web应用程序中，我们使用了“ S3签名URL”来高效地上传/下载文件，与直接上传/下载相比，我认为这样做的设计更加简洁。)

What is the back-end services implemented in?

(实施的后端服务是什么？)