【问题标题】:Save high resolution (size:width:1800px, height:1080px) canvas image to server using asp.net [duplicate]使用asp.net将高分辨率(大小:宽度:1800px,高度:1080px)画布图像保存到服务器[重复]
【发布时间】:2015-05-06 20:32:25
【问题描述】:

我有这段代码可以将画布图像保存到网络服务器。但是当图像具有超过 200*200 像素和高分辨率时它不起作用:它不保存。一个小图像作品;但是高分辨率的较大图像不起作用。

<script type="text/Javascript">
        function drawShapes() {
            var canvas = document.getElementById("myCanvas");
            var context = canvas.getContext("2d");
            var imageObj = new Image();
            imageObj.src = "im.jpg";
            imageObj.onload = function () {
                context.drawImage(imageObj, 0, 0, 1800, 1080);
            }
        }

    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#TZ").click(function () {
                var image = document.getElementById("myCanvas").toDataURL("image/png");
                image = image.replace('data:image/png;base64,', '');
                $.ajax({
                    type: 'POST',
                    url: 'Include/CS.aspx/UploadImage',
                    data: '{ "imageData" : "' + image + '" }',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    /*success: function (msg) {
                        alert('Image saved successfully !');
                    }*/
                });
            });
        });
    </script>



<body onload="drawShapes()">
    <form id="form1" runat="server">
        <div>
            <canvas id="myCanvas" width="1800" height="1080"></canvas>
            <a id="TZ">Save</a>
        </div>
    </form>
</body>



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
using System.Web.Script.Services;
using System.Web.Services;

[ScriptService]

public partial class Include_CS : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    [WebMethod()]
    public static void UploadImage(string imageData)
    {
        string path = System.Web.Hosting.HostingEnvironment.MapPath("~/Images/");
        string fileNameWitPath = path + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png";
        using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create))
        {
            using (BinaryWriter bw = new BinaryWriter(fs))
            {
                byte[] data = Convert.FromBase64String(imageData);
                bw.Write(data);
                bw.Close();
            }
        }
    }
}

【问题讨论】:

  • 我不确定,但我认为这是配置问题而不是代码问题?看看stackoverflow.com/questions/29895196/…
  • (你可以使用string fileNameWitPath = Path.Combine(path, DateTime.Now.ToString("yyyy-MM-dd- HHmmss") + ".png"。)

标签: javascript asp.net canvas


【解决方案1】:

我不确定这是否是您的情况,但 ASP.net 的上传限制为 4mb,可能您生成的文件比这大。

解决此问题的一种方法是更改​​ web.config 的 httpRuntime 标签:

<httpRuntime maxRequestLength="4096" />

4096 是默认值 (4mb),尝试将其增加到 16mb(16384) 以查看是否有效。

另一个非常有用的选项是使用免费的上传库,例如PlUpload

Here's an very good example of its implementation on C# and ASP.Net

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2014-10-03
    • 2015-10-20
    • 1970-01-01
    • 2018-04-27
    • 2013-04-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多