Posting: From Webpage to Server
A message that is sent from a webpage (via an IFrame embedded in that webpage) to the server is called an embedded message. It is sent in the following stages:
1.JavaScript is used to send the embedded message from the webpage to the IFrame. The embedded message is sent as a JSON object that is the first parameter of the postMessage() method.
2.When the embedded message reaches the IFrame, the solution serializes the message to a JSON string and sends this string to the solution's workflow on MobileTogether Server. This step is carried out automatically; you do not need to specify any processing.
3.In the workflow, the embedded message can be picked up with the OnEmbeddedMessage event. If an action is specified for this event, then the $MT_EMBEDDEDMESSAGE JSON page source is created automatically. You can define additional actions as desired.
In this section, we discuss the postMessage() method of Step 1. See the HTML webpage examples that respectively post JSON and XML data for a detailed description of the whole process. Step 2 is carried out automatically, and so requires no explanation. Step 3 is described in detail in the JSON and XML examples. Also see the description of the OnEmbeddedMessage event for more information.
About the postMessage method
Note the following key points:
•The embedded message is passed as the first parameter of postMessage()
•The embedded message is passed as a JSON object
•The data in the message is serialized using the structured clone algorithm. This means that the message can contain any of a range of data objects; serialization will be carried out automatically. Note, however, that not all data types can be sent to MobileTogether Server
For example, if the data to be sent is in JSON format, then the postMessage() method can send the JSON data structure without any modification. So, if a JSON object is assigned to a variable named myJSONData, then this data structure can be sent with the postMessage() method like this:
function sendMyMessage() {
document.querySelector('iframe').contentWindow.postMessage(myJSONData, '*');
}
In this example, the JSON data structure will be received by the IFrame. The solution in the IFrame will send the data to the workflow as a JSON string. In the workflow, the data can be picked up by the OnEmbeddedMessage page event and stored in the $MT_EMBEDDEDMESSAGE JSON page source.
See this Mozilla Developer Network documentation for detailed information about postMessage(). Also see the JSON and XML examples.