Ajax调用刷新客户端页面

时间:2018-04-02 21:00:13

标签: asp.net-mvc html2canvas

我使用html2canvas获取div的屏幕截图,然后将其上传到服务器。将图像保存在服务器上后,客户端上的页面将刷新。这是我不想要的。这是保存图片的代码:

public void SaveImage(string imageString, int id)
    {
        string s = imageString.Replace("data:image/png;base64,", "");
        byte[] imageB = Convert.FromBase64String(s);

        var filePath = Path.Combine(Server.MapPath("~/screens/" + id));
        Directory.CreateDirectory(filePath);
        using (var ms = new MemoryStream(imageB))
        {
            using (var image = Image.FromStream(ms))
            {
                image.Save(filePath + "/screen.png", ImageFormat.Png);                          
            }
        }                           
    }

这是Javascript代码

html2canvas(document.querySelector("#screen")).then(function (canvas) {
                var data = canvas.toDataURL("image/png");                      
                $.ajax({
                    url: '@Url.Action("SaveImage")',
                    type: 'POST',
                    data: { imageString: data, id: @ViewBag.id },
                    dataType: 'json'                        
                });
            });

我在网上找到了一些建议,比如jQuery中的preventDefault()。但那是关于它的。我觉得所有其他问题和解决方案都不会影响我。

编辑:刷新页面的简单HTML

    <!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Test</title>
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/html2canvas.js"></script>
    <script>
        $(document).ready(function () {
            html2canvas(document.querySelector("#screen")).then(function (canvas) {
                var data = canvas.toDataURL("image/png");
                $.ajax({
                    url: '@Url.Action("SaveImage")',
                    type: 'POST',
                    data: { imageString: data, id: 2 },
                    dataType: 'json',
                });
            });
        });
    </script>
</head>

<body>
  <div id="screen">Some text</div>
</body>
</html>

编辑1:整个控制器使用SaveImage方法

using System;
using System.Linq;
using System.Web.Mvc;
using Microsoft.AspNet.Identity;
using BcVnc.Models;
using System.IO;
using System.Drawing;
using System.Drawing.Imaging;

namespace BcVnc.Controllers
{
    [Authorize(Roles = "Admin, User")]    
    public class ConnectionController : Controller
    {
        private ApplicationDbContext db = new ApplicationDbContext(); 

        // GET: Connection
        public ActionResult Index(int id, bool viewOnly)
        {
            int access = checkUserAccess(id, viewOnly);
            if(access != 0)
            {
                ViewBag.id = id;                
                if (access == 1 & viewOnly == true)
                    ViewBag.viewOnly = true.ToString().ToLower();
                else if(access == 1 && viewOnly == false)
                    ViewBag.viewOnly = false.ToString().ToLower();
                else
                    ViewBag.viewOnly = true.ToString().ToLower();
                return View();
            }
            else
            {
                return View("Error");
            }
        }

        private int checkUserAccess(int id, bool viewOnly)
        {
            var userId = User.Identity.GetUserId();            
            var userDevice = db.UserDevices.Where(ud => ud.UserId == userId).FirstOrDefault(ud => ud.DeviceId == id);
            var device = db.Devices.FirstOrDefault(d => d.Id == id);
            ViewBag.name = device.Name;

            if (userDevice == null)
                return 0;
            else
            {
                if (userDevice.ViewOnly == false)
                    return 1;
                else
                    return -1;
            }
        }

        public void SaveImage(string imageString, int id)
        {
            string s = imageString.Replace("data:image/png;base64,", "");
            byte[] imageB = Convert.FromBase64String(s);

            var filePath = Path.Combine(Server.MapPath("~/screens/" + id));
            Directory.CreateDirectory(filePath);
            using (var ms = new MemoryStream(imageB))
            {
                using (var image = Image.FromStream(ms))
                {
                    image.Save(filePath + "/screen.png", ImageFormat.Png);                          
                }
            }                           
        }
    }
}

1 个答案:

答案 0 :(得分:0)

不知道为什么我之前无法找到它,但整个问题出现在Visual Studio设置中。刷新可能不会发生在localhost之外:Refresh in browser when uploading mvc file c # 在设置中更改后,不再刷新。