Telerik剑道ui图纸导出PDF发送到服务器

Telerik kendo ui drawing exportPDF send to server

本文关键字:PDF 服务器 剑道 ui Telerik      更新时间:2023-09-26

我使用来自kendo ui(此处)的绘图功能

并且它可以很好地为用户导出PDF

但我想用AJAX将PDF提交回服务器。

我为什么要它?我想允许客户从我的服务器发送一封带有PDF的电子邮件

这里是向服务器发送请求的代码:

  kendo.drawing.drawDOM($("#statement-print-area"))
                  .then(function (group) {
                      // Render the result as a PDF file
                      return kendo.drawing.exportPDF(group, {
                          paperSize: "auto",
                          margin: { left: "1cm", top: "1cm", right: "1cm", bottom: "1cm" }
                      });
                  })
                  .done(function (data) {
                      $.ajax({
                          type: "POST",
                          url: "/Customer/EmailStatement",
                          processData: false,  // tell jQuery not to process the data
                          contentType: false,  // tell jQuery not to set contentType
                          data: '{ "docData" : "' + data + '" ,"email": "' + vm.sendEmailTo + '"}',
                          contentType: 'application/json; charset=utf-8',
                          dataType: 'json',
                      }).done(handleResponseInfo).fail(ajaxError);
                  });

这是服务器端的代码(asp.net MVC)

            docData = docData.Replace("data:application/pdf;base64,", "");
            byte[] bytes = Convert.FromBase64String(docData);
            Stream stream = new MemoryStream(bytes);
new Attachment(stream, "Customer statement.pdf", "application/pdf")
                message.Attachments.Add(attachment);

这里是另一个例子:

<script>
    $(function () {
        $("#button0PDF").kendoButton();
        var button = $("#button0PDF").data("kendoButton");
        button.bind("click", function (e) {
            kendo.drawing.drawDOM("#divId", {
                forcePageBreak: ".page-break",
                //template: $("#page-template").html()
            })
            .then(function (group) {
                // Render the result as a PDF file
                return kendo.drawing.exportPDF(group, {
                    landscape: false
                });
            })
            .done(function (data) {
                // Save the PDF file
                kendo.saveAs({
                    dataURI: data,
                    fileName: "fileName.pdf",
                    proxyURL: "/API/Main/Post",
                });
            });
        });
    });
</script>

而服务器端部分:

public HttpResponseMessage Post([FromBody]FileData file)
        {
            var data = Convert.FromBase64String(file.Base64);
            var result = new HttpResponseMessage(HttpStatusCode.OK)
            {
                Content = new StreamContent(new MemoryStream(data))
            };
            result.Content.Headers.ContentType = new MediaTypeHeaderValue(file.ContentType);
            result.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
            {
                FileName = file.FileName
            };
            return result;
        }