Export Excel ProxyURL Not Work

1 Answer 290 Views
Grid
vahid
Top achievements
Rank 2
Iron
Iron
Iron
vahid asked on 29 Sep 2022, 01:22 PM

Hello,

I need use export excel With ProxyURL 

i got error when I click on the button export to excel 

Samlpe Dojo

thanks

1 Answer, 1 is accepted

Sort by
1
Accepted
Lance | Senior Manager Technical Support
Telerik team
answered on 03 Oct 2022, 11:31 PM

Hello vahid,

This is an expected when you attempt to use that demo in a Dojo, due to the multiple frames and result (it doesn't support CORs and the result content, this is a deliberate security consideration).

Please use the official demo as we have the backend configured to accept requests and results => Export to Excel in jQuery Grid Widget Demo | Kendo UI for jQuery (telerik.com)

If you implement the same code in your application, and your web API is configured to support this type of API request, it will work. Please carefully review the following API documentation for the requirements and configuration expectations => excel.proxyURL - API Reference - Kendo UI Grid - Kendo UI for jQuery (telerik.com)

Regards,
Lance | Manager Technical Support
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

vahid
Top achievements
Rank 2
Iron
Iron
Iron
commented on 05 Oct 2022, 09:34 AM

Hi Lance,

thank you for answer

proxyURL does not work alone

i set forceProxy:true in your Sample

again not work

 

Lance | Senior Manager Technical Support
Telerik team
commented on 05 Oct 2022, 06:24 PM

Hi vahid, this will not work in Kendo Dojo due to security restrictions. It will only work in our primary demo website, or in your application. this is because of the Dojo's iframe. Please do not use the Dojo for testing proxy exports, you must implement the code in your real application.

vahid
Top achievements
Rank 2
Iron
Iron
Iron
commented on 05 Oct 2022, 09:59 PM

Hi Lance,

doesn't work in my real application

Lance | Senior Manager Technical Support
Telerik team
commented on 06 Oct 2022, 12:53 PM

Thank you for clarifying. My apologies for misunderstanding, I suspect we might have a little bit of a language barrier. I will do my best to communicate the properly.

Unfortunately, the information you shared is not enough to help you figure out the problem. You have only shared our demo in the Kendo Dojo, which I previously explained will not work because of the iframe.

To be able to help you, we need to see any client-side or server-side error messages (look in the browser dev console). It would also be helpful if you shared the file for the web API controller that is doing the proxy work and the client-side code you're using.

If you can zip up those files and share a link in your next reply, I can begin the investigation.

Backend Requirements

The most important thing to keep in mind is that as the application developer, you are responsible for implementing the server-side logic.

The Grid control can only make a POST request, after this, it's up to your web application's logic to handle that request, create a file and return it to the view. This has nothing to do with Kendo, so we do not have any libraries for it.

I can show you the information you need to know in order to design your proxy/server.

Incoming Request Requirements

The server needs to allow any CORS requests and your controller method must accept the POST request from the Grid. The proxy will receive a POST request from the Grid with the following parameters inside the request body:

  • contentType: The MIME type of the file
  • base64: The base-64 encoded file content
  • fileName: The file name, as requested by the caller.

Response Requirements

The server then needs to take that base64 content, create a file and return a result to the browser. The proxy should return the decoded file with the "Content-Disposition" header set to attachment; filename="<fileName.xslx>".

For example, in ASP.NET, it looks like this:

// YOUR API CONTROLLER
public class MyGridExportController : Controller
{
    [HttpPost]
    public ActionResult Index(string contentType, string base64, string fileName)
    {
        var fileContents = Convert.FromBase64String(base64);

        return File(fileContents, contentType, fileName);
    }
}

and in the Grid, point the proxyUrl to that controller

$("#grid").kendoGrid({
            toolbar: ["excel"],
            excel: {
                fileName: "Kendo UI Grid Export.xlsx",
                proxyURL: "/api/mygridexport",
                ...
            },

Real Example

Here's the exact code we use for that demo's proxy => https://github.com/telerik/kendo-ui-demos-service/blob/master/demos-and-odata-v3/KendoCRUDService/Controllers/ExportController.cs 

Lance | Senior Manager Technical Support
Telerik team
commented on 06 Oct 2022, 04:09 PM

Hi vahid,

I have put together a complete runnable example that you can use to try this on your local PC.

  • Find the proxy API controller inside Controllers/MyProxyController.cs
  • Find the Grid on Views/Home/Index.cshtml
    • The Grid has ForceProxy = true
    • The proxyUrlpoints to the  /api/MyProxy

In MyProxyController, I read each of the values in the body's FormData and then return the file after reading the base64:

Notes:

  • Due to the fact that this forum is only for front-end jQuery, I need to create the demo project using .NET 6 because it enables me to also provide you with a back-end proxy in the same project as the Grid.
  • If your server-side proxy is a different technology, use that framework's capabilities to read base64 and convert it to a file that can be returned to the client. If you are not the back-end dev, you can share this answer with your team and they'll know what to do from here.

Regards,
Lance | Manager Technical Support
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

vahid
Top achievements
Rank 2
Iron
Iron
Iron
commented on 06 Oct 2022, 06:48 PM

Thank you so much Lance
Tags
Grid
Asked by
vahid
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Lance | Senior Manager Technical Support
Telerik team
Share this question
or