Question 193227 in React native Question posted in
The official React Native documentation can be found here.

React native – How can I upload a buffer from a base 64 encoded file to Amazon S3?

I’m trying to upload a PDF picked in React Native to Amazon s3. In order to do so, I sent the PDF encoded in base64 to my nodejs/adonis server and transformed it into a buffer (because I don’t wanna save it in base 64).

The PDF is actually being saved in my S3 Bucket, but not properly, as I can neither open it nor download it.

That’s how I’m trying to do it:

  public async storeFile({ request }: HttpContextContract) {


    const hash = crypto.randomBytes(32).toString('hex');
    let key = `PDF-${hash}`;
    //create a single key for each file

    const file = request.input('file');
    const fileBuffer = Buffer.from(file, 'base64');
    //transform the file encoded in base64 into a buffer

    await S3Service.uploadManually2(fileBuffer, key);

  }

  public async uploadManually2(file: Buffer, key: string): Promise<string> {


    const params = {
      Bucket: Env.get('AWS_BUCKET_NAME'),
      Body: file,
      Key: key,
      ContentType: 'application/pdf',
      ACL: 'public-read',
    }
    await s3.send(new PutObjectCommand(params))

    const url = `https://${Env.get('AWS_BUCKET_NAME')}.s3.amazonaws.com/${key}`
    return url
  }
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    My goal in the first place was to send a PDF from react-native to S3. Firstly I tried to send the file to the server and then to s3, but the way it worked for me was to send directly to s3 from react-native. To do so, I installed the library "react-native-aws3" and used the function "put".

    That's the code I used:

    import { RNS3 } from "react-native-aws3"

async function enviaPdfS3(uri, fileName){

  const chave = `PDF-${(Math.random() * 100).toString()}-${fileName}`
  //create a single key for each file

  const file = {
    uri: uri,
    name: key,
    type: 'application/pdf'
  }


  const options = {
    bucket: INSERT YOUR BUCKET'S NAME,
    region: INSERT YOUR BUCKET'S REGION,
    accessKey: INSERT YOUR BUCKET'S ACCESS KEY,
    secretKey: INSERT YOUR BUCKET'S SECRET KEY,
    successActionStatus: 201
  }

  await RNS3.put(file, options)

}

  2. 0

    The simplest fix here would be to convert the buffer form of the PDF file to a readable stream and then pass that stream to S3.

    // Add the following import on your module
const { Readable } = require('stream');

public async storeFile({ request }: HttpContextContract) {

     const hash = crypto.randomBytes(32).toString('hex');
     let key = `PDF-${hash}`;

     const file = request.input('file');
     const fileBuffer = Buffer.from(file, 'base64');
     const stream = new Readable();

     stream.push(fileBuffer)   
     stream.push(null);

     await S3Service.uploadManually2(stream, key);
}

public async uploadManually2(stream: Stream, key: string): Promise<string> {
    const params = {
      Bucket: Env.get('AWS_BUCKET_NAME'),
      Body: stream,
      Key: key,
      ContentType: 'application/pdf',
      ACL: 'public-read',
    }
    await s3.send(new PutObjectCommand(params))

    const url = `https://${Env.get('AWS_BUCKET_NAME')}.s3.amazonaws.com/${key}`
    return url
  }
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search