For my PHP app, I need to use the Syncfusion Javascript Word Processor. To instantiate it with a default text, Syncfusion asks that this text be formatted in SFDT, a kind of JSON.

//SFDT Example
"sections": [
    {
        "blocks": [
            {
                "inlines": [
                    {
                        "characterFormat": {
                            "bold": true,
                            "italic": true
                         },
                         "text": "Hello World"
                     }
                 ]
             }
         ],
         "headersFooters": {
         }
     }
 ]

This code show this : Link

With a .NET Core Package Syncfusion.EJ2.WordEditor.AspNet.Core, I can convert a doc(x) file to sfdt format. So I create a new .NET Core Web Api App with Visual Studio 2017 For Mac with this package.

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Syncfusion.EJ2.DocumentEditor;

namespace SyncfusionConverter.Controllers
{
    [Route("api/[controller]")]
    public class SyncfusionController : Controller
    {

        [AcceptVerbs("Post")]
        public string Import(IFormCollection data)
        {
            if (data.Files.Count == 0)
                return null;
            Stream stream = new MemoryStream();
            IFormFile file = data.Files[0];
            int index = file.FileName.LastIndexOf('.');
            string type = index > -1 && index < file.FileName.Length - 1 ?
            file.FileName.Substring(index) : ".docx";
            file.CopyTo(stream);
            stream.Position = 0;

            WordDocument document = WordDocument.Load(stream, GetFormatType(type.ToLower()));
            string sfdt = Newtonsoft.Json.JsonConvert.SerializeObject(document);
            document.Dispose();
            return sfdt;
        }

        internal static FormatType GetFormatType(string format)
        {
            if (string.IsNullOrEmpty(format))
                throw new NotSupportedException("EJ2 DocumentEditor does not support this file format.");
            switch (format.ToLower())
            {
                case ".dotx":
                case ".docx":
                case ".docm":
                case ".dotm":
                    return FormatType.Docx;
                case ".dot":
                case ".doc":
                    return FormatType.Doc;
                case ".rtf":
                    return FormatType.Rtf;
                case ".txt":
                    return FormatType.Txt;
                case ".xml":
                    return FormatType.WordML;
                default:
                    throw new NotSupportedException("EJ2 DocumentEditor does not support this file format.");
            }
        }
    }
}

I make a Ajax request to call this .Net method with my doc(x) file as parameter.

function loadFile(file) {
    const ajax = new XMLHttpRequest();
    const url = 'https://localhost:5001/api/Syncfusion/Import';
    ajax.open('POST', url, true);
    ajax.onreadystatechange = () => {
        if (ajax.readyState === 4) {
            if (ajax.status === 200 || ajax.status === 304) {
                // open SFDT text in document editor
                alert(ajax.status);                                                          
             }else{
                 alert(ajax.status);
             }
         }else{
              alert(ajax.readyState);
         }
     };
     let formData = new FormData();
     formData.append('files', file);
     ajax.send(formData);
}

When loadFile function is executed, i got this error in browser's console : "Cross-Origin Request (Blocking of a Multi-Origin Request): the "Same Origin" policy does not allow to consult the remote resource located on https://localhost:5001/Syncfusion/Import. Reason: CORS request failed."

I follow this tutorial and those SO posts Link1 Link2 but it doesn't work. Any idea to solve this problem ?

Related posts

Recent Viewed