Giter VIP home page Giter VIP logo

Comments (5)

jospas avatar jospas commented on September 25, 2024

Here is a worked example of showing a file open dialog and sending the file as the attachment parameter in the args:

function uploadFile()
{
  if (!chatSession)
  {
    return;
  }

  var input = document.createElement('input');
  input.type = 'file';

  input.onchange = e => {

    var file = e.target.files[0];
    chatSession.sendAttachment({
      attachment: file
    }).then(function(data) {
      console.info('Upload complete');
    })
    .catch(function(error) {
      console.error('Failed to upload', error);
    });
  }

  input.click();
}

from amazon-connect-chatjs.

spencerlepine avatar spencerlepine commented on September 25, 2024

Hi jospas, thank you for taking the time to raise this issue. I have added notes in the README, merged in #179

from amazon-connect-chatjs.

OctaveIdeas avatar OctaveIdeas commented on September 25, 2024

@spencerlepine Can you please help me to pass metadata in chatSession.sendAttachment().

from amazon-connect-chatjs.

senghuotlay avatar senghuotlay commented on September 25, 2024

@spencerlepine i am on react native, therefore i am currently using react-native-image-picker, for some reason why i use this conversion, the image wouldn't be able to be open.

private async convertUriToFile({
    uri,
    fileName,
    fileType,
  }: {
    uri: string;
    fileName: string;
    fileType: string;
  }): Promise<File> {
    const filePath = Platform.OS === 'ios' ? uri.replace('file://', '') : uri;
    const fileData = await RNFetchBlob.fs.readFile(filePath, 'base64');

    // Works from here

    const byteCharacters = decode(fileData);
    const byteNumbers = new Array(byteCharacters.length);
    for (let i = 0; i < byteCharacters.length; i++) {
      byteNumbers[i] = byteCharacters.charCodeAt(i);
    }
    const byteArray = new Uint8Array(byteNumbers);
    const blob = new Blob([byteArray], {type: fileType});

    return new File([blob], fileName, {type: fileType});
  }

the image type i got is

  export interface ImagePickerResponse {
    didCancel?: boolean;
    errorCode?: ErrorCode;
    errorMessage?: string;
    assets?: Asset[];
}

image

from amazon-connect-chatjs.

senghuotlay avatar senghuotlay commented on September 25, 2024

All good, this solution works

  private convertAssetToFile = async (asset: {
    uri: string;
    fileName: string;
    type: string;
  }): Promise<File> => {
    try {
      const resp = await fetch(asset.uri);
      const blob = await resp.blob();
      return new File([blob], asset.fileName, {type: asset.type});
    } catch (error) {
      throw error;
    }
  };

from amazon-connect-chatjs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.