我使用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);
}
}
}
}
}
答案 0 :(得分:0)
不知道为什么我之前无法找到它,但整个问题出现在Visual Studio设置中。刷新可能不会发生在localhost之外:Refresh in browser when uploading mvc file c # 在设置中更改后,不再刷新。