Changes for page Multipart form-data
Last modified by Erik Bakker on 2024/06/17 11:39
From version 9.2
edited by Erik Bakker
on 2022/07/26 13:04
on 2022/07/26 13:04
Change comment:
Update document after refactoring.
To version 20.1
edited by Erik Bakker
on 2022/08/05 14:50
on 2022/08/05 14:50
Change comment:
There is no comment for this version
Summary
-
Page properties (2 modified, 0 added, 0 removed)
Details
- Page properties
-
- Title
-
... ... @@ -1,1 +1,1 @@ 1 - expert-securing-data-traffic-api-gw-security-external-idp1 +Multipart form-data - Content
-
... ... @@ -1,5 +1,5 @@ 1 1 {{container}}{{container layoutStyle="columns"}}((( 2 - In mostcases,youwilltransformXML messagestootherXML messages,oryouwilltransformJSONorEDImessages inanotheroftheseformats.However,sometimes youwanttoperform animagetransformation.With thisimage transformation, you can convertimagesinspecificformats toanotherformat(i.e.,png). This can comeinhandywhen you want to standardize theimageformat beforeusing itfurtherdownstreaminyour business application(s).2 +Sometimes when you call an external REST endpoint, they require you to send meta information and one or more "attachments" in one call to the REST endpoint. To make this possible, you need to send the information with the contentType called multipart/form-data. In this microlearning, we will discuss how you can configure a valid message within the eMagiz platform that allows you to send out messages with this contentType and have them accepted by the endpoint in question. 3 3 4 4 Should you have any questions, please get in touch with [[academy@emagiz.com>>mailto:academy@emagiz.com]]. 5 5 ... ... @@ -9,55 +9,73 @@ 9 9 10 10 == 2. Key concepts == 11 11 12 -This microlearning focuses on performingimagetransformations in eMagiz.12 +This microlearning focuses on configuring a multipart/form-data message within eMagiz to ensure it is sent correctly to an endpoint. 13 13 14 - Byimage transformation, we mean transforming the raw data that represents an image into anotherimageformat.14 +Key aspects are: 15 15 16 -* Readthe helpxtofthecomponenttounderstand whichformatsresupported17 -* Ensure theinputimageis supplied in thecorrectformat18 -* Ensureyouwrapthe outputimagein somethingif you wanttodo additionaltransformations on the data further downstream16 +* Defining the boundary that separates the parts of the message 17 +* Defining the content types of each part of the message 18 +* Construction of the complete message according to the specification 19 19 20 -== 3. Image Transformation==20 +== 3. Multipart form-data == 21 21 22 - In mostcases,youwilltransformXML messagestootherXML messages,oryouwilltransformJSONorEDImessages inanotheroftheseformats.However,sometimes youwanttoperform animagetransformation.With thisimage transformation, you can convertimagesinspecificformats toanotherformat(i.e.,png). This can comeinhandywhen you want to standardize theimageformat beforeusing itfurtherdownstreaminyour business application(s).22 +Sometimes when you call an external REST endpoint, they require you to send meta information and one or more "attachments" in one call to the REST endpoint. To make this possible, you need to send the information with the contentType called multipart/form-data. In this microlearning, we will discuss how you can configure a valid message within the eMagiz platform that allows you to send out messages with this contentType and have them accepted by the endpoint in question. 23 23 24 - Beforewe dive into thespecifics of howto configure this,let us first consider the following:24 +Key aspects are: 25 25 26 -* Readthe helpxtofthecomponenttounderstand whichformatsresupported27 -* Ensure theinputimageis supplied in thecorrectformat28 -* Ensureyouwrapthe outputimagein somethingif you wanttodo additionaltransformations on the data further downstream26 +* Defining the boundary that separates the parts of the message 27 +* Defining the content types of each part of the message 28 +* Construction of the complete message according to the specification 29 29 30 - {{warning}}This microlearning focuses on the image transformer component.Ensuring that theinput is valid and theoutput fits theremainder of the processis highly dependenton the use case and will therefore not be discussed in this microlearning{{/warning}}30 +=== 3.1 Prepare the message === 31 31 32 - Whenturningto theCreate phase of eMagiz, we need to openthe flowandenter"StartEditing" mode toaddthenecessarycomponent. For example,intheleftpanel,youcan search for"Image."Thiswillyieldthefollowingresult.32 +To construct the message, several steps are needed to make it work. Luckily, most of the steps necessary have to do with concepts we have already discussed in previous microlearnings. As you can imagine, based on what multipart/form-data entails, we need a way to both store the meta information and the file(s) we want to send to the external party. For example, put the metadata in one (or multiple) header(s) and use the file content as a payload. This you can achieve with a header enricher and standard transformer. 33 33 34 - [[image:Main.Images.Microlearning.WebHome@expert-create-your-transformations-image-transformation-image-transformation-component.png]]34 +Once the file content is your payload, you must ensure that the data is "raw." So when you have a base64 encoded string, you should decode it before sending it to the endpoint. 35 35 36 - After draggingthe componentontothecanvas,youmustdefine the channelsfirst.36 +On top of that, we need to define the contentType header. 37 37 38 -[[image:Main.Images.Microlearning.WebHome@expert- create-your-transformations-image-transformation-image-transformation-component-help.png]]38 +[[image:Main.Images.Microlearning.WebHome@expert-data-handling-multipart-form-data--content-type-header-config.png]] 39 39 40 - Secondly,wemustselect thedesired imageformat we want to transform. Finally, the field indicatesll valid valuesyou can choose. Please note that 'PNG' is the default selection.40 +=== 3.2 Construct the message === 41 41 42 - [[image:Main.Images.Microlearning.WebHome@expert-create-your-transformations-image-transformation-image-transformation-component-image-options.png]]42 +After you have set the stage, you can use a standard transformer component to build your message correctly. To create it correctly, you need to take the following into account: 43 43 44 -Once you have done this, the component configuration is finished, and you can transform your input image to a desired output image format. 44 +* Each part of the message needs to be separated by a boundary 45 +* The message needs to start with a boundary and finish with a boundary 46 +* Line breaks are needed to differentiate between the boundary and the text content 47 +* No line break is needed when the content is not text-based 45 45 49 +Given all this, you can write the following SpEL expression that will yield a desirable output: 50 + 51 +{{code}}'${multi-part-form-data.data-handling.boundary}' + headers.metaInfo + T(com.emagiz.util.Newline).CRLF.characters + '${multi-part-form-data.data-handling.boundary}' + T(com.emagiz.util.Newline).CRLF.characters + 'Content-Disposition: form-data; name="file"; filename="' + headers.filename + '"' + T(com.emagiz.util.Newline).CRLF.characters + 'Content-Type: application/pdf' + T(com.emagiz.util.Newline).CRLF.characters + T(com.emagiz.util.Newline).CRLF.characters + payload + '${multi-part-form-data.data-handling.boundary}'{{/code}} 52 + 53 +Putting this in a standard transformation gives you the following solution in the flow. 54 + 55 +[[image:Main.Images.Microlearning.WebHome@expert-data-handling-multipart-form-data--standard-transformer-config.png]] 56 + 57 +=== 3.3 Calling the endpoint === 58 + 59 +Now that we have constructed our message correctly, the last thing to do is call the endpoint in question. Since we have prepared our message and accurately defined our contentType calling the endpoint does not require any additional configurations compared to what you are already used to when dealing with REST endpoints. 60 + 46 46 == 4. Assignment == 47 47 48 - Checkwhetherthe solutionwe discussed todaycanbe foundwithinyourproject.49 -This assignment can be completed with inthe (Academy) project you created/used in the previous assignment.63 +Try to see whether you can construct the flow so that it outputs a valid multipart/form-data message. 64 +This assignment can be completed with the help of the (Academy) project you created/used in the previous assignment. 50 50 51 51 == 5. Key takeaways == 52 52 53 -* Read the help text of the component to understand which formats are supported 54 -* Ensure the input image is supplied in the correct format 55 -* Ensure you wrap the output image in something if you want to do additional transformations on the data further downstream 68 +* Make sure to define the boundary that separates the parts of the message 69 +* Make sure to define the content types of each part of the message 70 +* Make sure to define the content type that matches the specification for multipart/form-data 71 +* Construct the complete message according to the specification 56 56 57 57 == 6. Suggested Additional Readings == 58 58 59 -If you are interested in this topic and want more information, please read the help text providedbyeMagiz.75 +If you are interested in this topic, please read the help texts on the platform and read the following link: 60 60 77 +* https://www.sobyte.net/post/2021-12/learn-about-http-multipart-form-data/ 78 + 61 61 == 7. Silent demonstration video == 62 62 63 63 As this is more of theoretical microlearning, there is no video accompanying the microlearning.)))((({{toc/}}))){{/container}}{{/container}}