Problem with document editor backed pdf export

[Yusuf Islam Zengin]

Hello,

This is my pdf export code

const exportToPdf = async (): Promise<void> => {

const documentEditor = documentEditorRef.current;

const sfdtContent = documentEditor.serialize();

try {

const response = await fetch(

'http://localhost:5000/api/documenteditor/ExportPdf',

{

method: 'POST',

headers: { 'Content-Type': 'application/json' },

body: JSON.stringify({ content: sfdtContent }),

},

);

if (!response.ok) {

throw new Error('PDF dışa aktarımı sırasında bir hata oluştu');

}

const blob = await response.blob();

const url = window.URL.createObjectURL(blob);

const a = document.createElement('a');

a.rel='nofollow' href = url;

a.download = `${documentName || 'Document'}.pdf`;

document.body.appendChild(a);

a.click();

a.remove();

window.URL.revokeObjectURL(url);

} catch (error) {

console.error('PDF indirme sırasında bir hata oluştu:', error);

}

};

<DocumentEditorComponent

enableSfdtExport={true}

enableSelection={true}

enablePrint={true}

ref={documentEditorRef}

documentEditorSettings={{ optimizeSfdt: false }}

height={'100%'}

width={'100%'}

created={() => {

documentEditorRef.current?.fitPage();

}}

>

<Inject services={[Print, Selection, SfdtExport]} />

</DocumentEditorComponent>

When i tried to pdf export. Its throwing this error:

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]

      Request starting HTTP/1.1 OPTIONS http://localhost:5000/api/documenteditor/ExportPdf  

info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]

      Policy execution successful.

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]

      Request finished in 4.965ms 204 

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]

      Request starting HTTP/1.1 POST http://localhost:5000/api/documenteditor/ExportPdf application/json 124300

info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]

      Policy execution successful.

info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[3]

      Route matched with {action = "ExportPdf", controller = "Documenteditor"}. Executing controller action with signature Microsoft.AspNetCore.Mvc.FileStreamResult ExportPdf(SaveParameter) on controller PdfExport.Controllers.DocumenteditorController (PdfExport).

info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[1]

      Executing action method PdfExport.Controllers.DocumenteditorController.ExportPdf (PdfExport) - Validation state: Valid

info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[2]

      Executed action PdfExport.Controllers.DocumenteditorController.ExportPdf (PdfExport) in 71.821ms

fail: Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware[1]

      An unhandled exception has occurred while executing the request.

Newtonsoft.Json.JsonSerializationException: Cannot deserialize the current JSON array (e.g. [1,2,3]) into type 'System.Collections.Generic.Dictionary`2[System.String,System.Object]' because the type requires a JSON object (e.g. {"name":"value"}) to deserialize correctly.

To fix this error either change the JSON to a JSON object (e.g. {"name":"value"}) or change the deserialized type to an array or a type that implements a collection interface (e.g. ICollection, IList) like List<T> that can be deserialized from a JSON array. JsonArrayAttribute can also be added to the type to force it to deserialize from a JSON array.

Path '', line 1, position 1.

   at Newtonsoft.Json.Serialization.JsonSerializerInternalReader.EnsureArrayContract(JsonReader reader, Type objectType, JsonContract contract)

   at Newtonsoft.Json.Serialization.JsonSerializerInternalReader.CreateList(JsonReader reader, Type objectType, JsonContract contract, JsonProperty member, Object existingValue, String id)

   at Newtonsoft.Json.Serialization.JsonSerializerInternalReader.Deserialize(JsonReader reader, Type objectType, Boolean checkAdditionalContent)

   at Newtonsoft.Json.JsonSerializer.DeserializeInternal(JsonReader reader, Type objectType)

   at Newtonsoft.Json.JsonConvert.DeserializeObject(String value, Type type, JsonSerializerSettings settings)

   at Newtonsoft.Json.JsonConvert.DeserializeObject[T](String value, JsonSerializerSettings settings)

   at Syncfusion.EJ2.DocumentEditor.DocxExporting.SerializeColumnLayout(Dictionary`2 secformat, IWSection section)

   at Syncfusion.EJ2.DocumentEditor.DocxExporting.SerializeSectionFormat(Object data, IWSection section)

   at Syncfusion.EJ2.DocumentEditor.DocxExporting.SerializeSection(Object data, WordDocument document)

   at Syncfusion.EJ2.DocumentEditor.DocxExporting.ConvertSfdtToDocIO(String sfdt)

   at Syncfusion.EJ2.DocumentEditor.WordDocument.Save(String sfdtText, FormatType formatType)

   at PdfExport.Controllers.DocumenteditorController.ExportPdf(SaveParameter data) in C:\Users\ysfis\Projects\udfpdf\Export-document-as-PDF-in-Document-Editor\ASP.NET Core\Controllers\DocumenteditorController.cs:line 72

   at lambda_method(Closure , Object , Object[] )

   at Microsoft.AspNetCore.Mvc.Internal.ActionMethodExecutor.SyncActionResultExecutor.Execute(IActionResultTypeMapper mapper, ObjectMethodExecutor executor, Object controller, Object[] arguments)

   at Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker.InvokeActionMethodAsync()

   at Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker.InvokeNextActionFilterAsync()

   at Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker.Rethrow(ActionExecutedContext context)

   at Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)

   at Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker.InvokeInnerFilterAsync()

   at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeNextResourceFilter()

   at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Rethrow(ResourceExecutedContext context)

   at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)

   at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeFilterPipelineAsync()

   at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeAsync()

   at Microsoft.AspNetCore.Builder.RouterMiddleware.Invoke(HttpContext httpContext)

   at Microsoft.AspNetCore.Cors.Infrastructure.CorsMiddleware.Invoke(HttpContext context)

   at Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware.Invoke(HttpContext context)

   at Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware.Invoke(HttpContext context)

info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]

      Policy execution successful.

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]

      Request finished in 84.9405ms 404 

I can succesfully import my sfdt content in your live demo

https://ej2.syncfusion.com/documentation/document-editor/import

[Dhanush Sekar]

Hi Yusuf,

We suspect that the reported problems are might be due to the contents of the input Word document, which is used at your end. We need to investigate the contents of your input Word document to reproduce the exact problem at our end. So, could you please provide us the input Word document that was used at your end? Thereby, we will analyze further and provide you the appropriate solution at the earliest.

 

Note: If you have any confidential data in your Word document, please replace with some dummy data and provide us the same. We just need your document to recreate the problem you face.

Regards,

Dhanush S

[Yusuf Islam Zengin]

Hello thanks for reply,

this is the sample sfdt

Attachment: test.sfdt_e4f22cff.zip

[Dhanush Sekar]

Hi Yusuf,

Thanks for providing the input word document.

We were unable to reproduce the reported issue in our latest version, v27.1.59. We have attached a sample and video for your reference. 

Sample:  Cyzrqk (forked) - StackBlitz

Could you please confirm that whether you are able to reproduce the issue in above sample?

if not, please upgrade the document editor to latest version v27.1.59.

NPM link:

https://www.npmjs.com/package/@syncfusion/ej2-react-documenteditor

 

NuGet links:‎

https://www.nuget.org/packages/Syncfusion.Ej2.Wordeditor.ASPNet.Core/

https://www.nuget.org/packages/Syncfusion.Ej2.Wordeditor.ASPNet.MVC5/

if yes, modify the above sample and share us issue reproducible sample with issue replication video? it will be helpful to validate the issue from our end.

Regards,

Dhanush S

Attachment: New_folder_(26)_98c9c71e.zip

[Yusuf Islam Zengin]

Yes, the approach you suggested works without any issues. However, when I try using the SFDT JSON directly with the API, it throws an error, as I mentioned.

I resolved my issue by first converting the document to DOCX format, then converting the DOCX to PDF on a .NET server.

Now, my current problem is that, in some documents (like the one I sent you), there is a vertical line in the header in the PDF output, which is not present in the original document. You can observe this issue in your video as well.

[Dhanush Sekar]

Hi Yusuf,

Currently, document editor doesn't provide support to render lines for the bar tab stop. We are validating this feature request and will update the details on November 19, 2024.

Regards,

Dhanush S

[Yusuf Islam Zengin]

I think its not about document editor. Cause i can see the document right format in editor or i can see the right format in converted docx. When i try to convert this converted docx document to pdf there is problem.

Attachment: ss_e64fb405.zip

[Dhanush Sekar]

Hi Yusuf,

The line shown in the PDF document is not a issue. It will appear in the paragraph if we insert a bar tab stop in MS Word. Please refer the attached video.

Currently, document editor doesn’t provide support for render bar tab.

 

We have logged this as feature request. We don’t have any immediate plans to implement this feature now.

 

We usually have an interval of at least three months between the releases. At the planning stage for every release cycle, we review all open features once again and finalize features for implementation based on specific parameters including product vision, technological feasibility, and customer interest. We will let you know when this feature is implemented.            

      

You can track the status of feature from the below link: 

https://www.syncfusion.com/feedback/63235/provide-support-to-render-bar-tab-in-document-editor

Attachment: Bartab_4cb6a58c.zip