UploadStream for locally generated file content

[former_member763914]

Hello Experts,

I am generating PDF file in MDK App based on data on the page. I can convert file content into Base64 or Arraybuffer.

Is there a way to upload file content (Base64 or Arraybuffer) using MDK action UploadStream?

Backend service is CAP and defined as offline on MDK App.

Thanks.

[mingkho]

Hi Ujjaval

Yes, you can pass array buffer but you must contain it inside media content object as described here.

For example:

You can return it from a rule e.g.

export default function GetMedia(context) {
    let myArrayBuffer = context.getActionBinding()["MyArrayBuffer"];
    return [{
      'contentType': 'images/jpeg',
      'content': myArrayBuffer
    }]; //NOTE: You must return it as an array, even if it's one item only
}

And in your upload stream action:

{
  "_Type": "Action.Type.ODataService.UploadStream",
  "Properties": {
    "SomePhoto": "/MyMDKApp/Rules/GetMedia"
  },
  "Target": {
    "Service": "/MyMDKApp/Services/MyOData.service",
    "EntitySet": "Products",
    "QueryOptions": "$filter=ProductID eq {ProductID}"
  }
}

Regards

Ming

[former_member763914]

Hi Ming Kho,

Thanks. I missed to passed it as array. Uploadstream action is not throwing an error now.

However, content being stored might not be correct as it is giving invalid content while reading/previewing. could you please check if anything else might needed here in the code.

Image upload with Attachment control;

    let attach = clientAPI.getPageProxy().evaluateTargetPath("#Control:FCAttachments/#Value/" + resultData.attachment_id);
    let filedata = { content: attach.content, contentType: attach.contentType };
    
    return clientAPI.executeAction({
        Name: "/Take5App/Actions/Media/UploadAttachmentStream.action",
        Properties: {
            Target: {
                ReadLink: resultData['@odata.readLink']
            },
            Properties: {
                content: [filedata]
            }
        }
    }).catch(function (error) {
        console.log(`Upload Failed: ${error}`);
        return false;
    });<br>

local PDF file upload(generated using PDFMake);

    const pdfDocGenerator = pdfMakeLib.createPdf(docDefinition);
    pdfDocGenerator.getBuffer((bufferData) => {
        var filedata =
        [{
            'contentType': 'application/pdf',
            'content': bufferData.buffer
          }];

        return context.executeAction({
            Name: "/Take5App/Actions/Media/UploadAttachmentStream.action",<br>            Properties: {
                Target: {
                    ReadLink: "Attachment(parent_risk_id='eV5qntRriM',attachment_id='3')"
                },
                Properties: {
                    content: filedata
                }
            }
        }).catch(function (error) {
            console.log(`Upload Failed: ${error}`);
            return false;
        });        
    });<br>

Thanks.

[mingkho]

ujjaval-bourne Your codes looks fine to me.

Few questions:

1. Did both Image upload and PDF upload have the same issue where you can't preview them at all after uploading them?
2. How do you read/preview the uploaded images/PDFs?
3. Have you tried to open the uploaded binary from the OData Service directly with the browser, directly?
4. Have you tried uploading a pdf / image via postman to your OData Service? Does it get the same issue?

FYI, I forgot mentioned that using ArrayBuffer in upload stream action is only available in MDK web app, so if you are running in MDK mobile app then it won't work (you'll have to convert it to NSData for iOS or Byte Array for Android). But since the upload stream was successful (even if it can't be previewed) then I assumed you are running MDK web app.

Alternatively, I'd suggest that you raise an MDK support ticket and we'll look into it (information of what you need to provide in the ticket can be found here).

[former_member763914]

Hi Ming Kho,

Please see answers to your questions as below;

1. Did both Image upload and PDF upload have the same issue where you can't preview them at all after uploading them?

Yes, That’s correct. Both having same issue.

2. How do you read/preview the uploaded images/PDFs?

I use MDK action DownloadStream (please see attachment) and also used direct assignment in object table

"/Take5App/Services/Take5CloudSrv.service/"+ firstImage["@odata.readLink"] +"/content";

3. Have you tried to open the uploaded binary from the OData Service directly with the browser, directly?

Yes, I tried to open uploaded image using browser directly. It is returning invalid data.

4. Have you tried uploading a pdf / image via postman to your OData Service? Does it get the same issue?

Yes, I tried postman to upload file as binary which works fine and stores the files perfectly to backend.

Yes, I am currently testing in web only but needs to add the same functionality in iOS and Android.

Thanks

uploadstream-payload-web.pngdownloadstream-response-web.png

[mingkho]

Hi Ujjaval

Then, I'd suggest that you raise an MDK support ticket and we'll look into it (information of what you need to provide in the ticket can be found here). Please also include a link to this question.

Regards

Ming