mxEditor缺省的save action可以向后端提交图形的xml数据,可以通过urlPost属性定义后端接收数据的地址,比如:
editor.urlPost="SaveGraph";
数据保存在FormData中,字段名称为xml,下图是按保存后,浏览器Network中显示的结果:
图片.png
我们使用asp.net core编写简单的保存后端,代码如下:
endpoints.MapPost("/SaveGraph", async context =>
{
var requ = context.Request;
var xml = requ.Form["xml"];
var filename ="d:\\workflow\\temp\\"+ DateTime.Now.Ticks + ".xml";
System.IO.File.WriteAllText(filename, xml);
await context.Response.WriteAsync(filename);
});
图形以xml方式保存,结构与在配置文件中的定义相同,文件可以直接使用open打开,重新显示。下面的代码是从url中获取文件地址并显示的代码:
function open_xml_on_init(editor) {
var xml_file_path = 'GetXml?xml=' + urlParams['xml'];
if (urlParams['xml'] != null && urlParams['xml'].length > 0) {
editor.open(xml_file_path);
}
}
asp.net core 打开文件的服务端代码如下:
endpoints.MapGet("/GetXml", async context =>
{
var requ = context.Request;
var xml = requ.Query["xml"];
var filename = "d:\\workflow\\temp\\" + xml;
var content=System.IO.File.ReadAllText(filename);
await context.Response.WriteAsync(content);
});