1

How to upload images to portfolio using a landing page, I tried the following but it is only taking in from an URL but not from the local machine. Could anyone guide me on how to achieve this?

Processing page:

%%[
SET @Image = RequestParameter("fileToUpload")

SET @PortfolioObject = CreateObject("Portfolio")
 SetObjectProperty(@PortfolioObject, "DisplayName", GUID())
 SetObjectProperty(@PortfolioObject, "CustomerKey", GUID())
 SetObjectProperty(@PortfolioObject, "FileName", "example.png")

SET @ClientID = CreateObject("ClientID")
 SetObjectProperty(@ClientID, "ID", "xxxxxxx")
 SetObjectProperty(@PortfolioObject, "Client", @ClientID )

SET @ResourceSpecification = CreateObject("ResourceSpecification")
 SetObjectProperty(@ResourceSpecification, "URN", @Image)
 SetObjectProperty(@PortfolioObject, "Source", @ResourceSpecification)

SET @StatusCode = InvokeCreate(@PortfolioObject, @StatusMsg, @ErrorCode)
]%%

%%=v(@StatusCode)=%%

HTML page:

<!DOCTYPE html>
<html>
<body>

<form action="" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="text" name="fileToUpload" id="fileToUpload" size="50"> <br/><br/>
    <input type="submit" value="Upload Image" name="submit">
</form>

</body>
</html>
2

You will need to Base64 encrypt your file that is uploaded via the form you have. Check this Stack Exchange question for some client-side JS options to handle this.

Try the solution using the FileReader class:

function getBase64(file) {    var reader = new FileReader();   
 reader.readAsDataURL(file);    reader.onload = function () {
      console.log(reader.result);    };    reader.onerror = function (error) {
      console.log('Error: ', error);    }; }     
 var file = document.querySelector('#files >
 input[type="file"]').files[0]; getBase64(file); // prints the base64
 string

Notice that .files[0] is a File type, which is a sublcass of Blob. Thus it can be used with FileReader. See the complete working example.

After it is Base64 encoded, you will need to create a REST API Content Builder call Create Asset - (POST /asset/v1/content/assets)

This would need to be added into the JSON Body as File:

File   |   string   |   Base64-encoded string of a file associated with an asset

Simple Sample of the JSON body:

{
  "CustomerKey" : "ExternalKeyofFile",
  "AssetType" : {
    "name": "FileType",
    "id" : ID_Number_for_FileType
    },
  "Name" : "Test_Img",
  "File" : "YOUR_BASE64_FILE"
  }
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.