Server Integration

This page explains how to integrate Synap Editor with your back-end environment. Refer to the per-environment guides below to connect the editor to your stack.

Per-environment Integration Guides

• Java Spring Framework example
• Java Servlet example
• ASP.NET (C#) example
• ASP (Classic) example
• PHP example
• PHP4 example
• Django example
• Ruby on Rails example
• WordPress plugin example

The examples below assume the editor was configured like this:

// Synap Editor configuration
new SynapEditor('synapEditor', {
    'editor.upload.image.api': "/uploadImage",
    'editor.upload.video.api': "/uploadVideo",
    'editor.upload.file.api':  "/uploadFile",
    'editor.import.api':       "/importDoc"
});

Image File Upload

[request]

The editor sends the image to the customer-system URL specified for upload. This URL corresponds to the editor.upload.image.api value configured above.

• Request URL: http://hostname/uploadImage
• Request Method: POST

[response]

When the image is uploaded successfully, the customer system must return a response in the following form:

{
    "uploadPath": "uploads/36a43f36f442b5824c6b061eb734553d.png"
}

Video Upload

[request]

The editor sends the video to the customer-system URL specified for upload. This URL corresponds to the editor.upload.video.api value configured above.

• Request URL: http://hostname/uploadVideo
• Request Method: POST

[response]

When the video is uploaded successfully, the customer system must return a response in the following form:

{
    "uploadPath": "uploads/36a43f36f442b5824c6b061eb734553d.mp4"
}

Uploading an Arbitrary File

File Types that Require Caution

1. Document formats (doc, docx, ppt, pptx, xls, xlsx, pdf, rtf, odt, ods, odp, hwp, hwpx, etc.)

   • May contain macros or scripts
   • Recommended to allow only on import

2. Markup / styling languages (xml, css, svg, textile, html, etc.)

   • Risk of XSS or script injection

3. Executable / embedded files (swf, eof, etc.)

   • May be directly executable or otherwise unsafe

[request]

The editor sends the file to the customer-system URL specified for upload. This URL corresponds to the editor.upload.file.api value configured above.

• Request URL: http://hostname/uploadFile
• Request Method: POST

[response]

When the file is uploaded successfully, the customer system must return a response in the following form:

{
    "uploadPath": "uploads/36a43f36f442b5824c6b061eb734553d.docx"
}

Document Import

Document conversion for import is performed on the server by the sedocConverter module provided by Synap Editor (which supports Linux and Windows).

When the user triggers an import from the editor, the document is sent to the server, converted by sedocConverter, and the result is sent back to the editor.

When the import is triggered, the document is sent to the API configured in editor.import.api (for example, /importDoc). The back-end API portion must be implemented by you — refer to the per-environment examples (such as ASP.NET (C#) example, PHP example, etc.).

If the editor was configured with "editor.import.api": "/importDoc", the request and response are as follows.

[request]

The client sends the document file to the URL specified for document import.

• Request URL: http://hostname/importDoc
• Request Method: POST

[response]

When the document file is converted successfully, the following response must be sent back to the client:

{
    "serializedData": [10, 213, 156, ...],
    "importPath": "works/36a43f36f442b5824c6b061eb734553d"
}

Related Information

• Java Spring Framework example
• Java Servlet example
• ASP.NET (C#) example
• ASP (Classic) example
• PHP example
• PHP4 example
• Django example
• Ruby on Rails example
• WordPress plugin example