У цій статті ви дізнаєтесь, як створювати, читати та редагувати електронні таблиці Excel у програмі ASP.NET MVC. Для цього ми створимо додаток для роботи з електронними таблицями, що складається з багатофункціонального елемента керування сіткою для відображення та редагування файлів Excel, як показано нижче.

.NET API для створення таблиці ASP.NET MVC

Щоб створити додаток електронної таблиці в ASP.NET MVC, ми будемо використовувати Aspose.Cells.GridJs. API дозволяє створювати веб-програми для швидкого й легкого відображення або редагування електронних таблиць. Крім того, ви можете імпортувати популярні формати файлів електронних таблиць (XLS, XLSX, XLSM, XLSB, CSV, SpreadsheetML, ODS) (докладніше). Крім того, він забезпечує потужний і багатий механізм обчислення формул для обчислення не лише вбудованих функцій, але й спеціальних формул. Ви можете встановити Aspose.Cells.GridJs з NuGet.

PM> Install-Package Aspose.Cells.GridJs

Кроки для створення таблиці ASP.NET MVC

Нижче наведено кроки для створення веб-програми електронної таблиці в ASP.NET MVC.

  1. Створіть нову веб-програму ASP.NET Core (Model-View-Controller) у Visual Studio.
  1. Встановіть Aspose.Cells.GridJs з NuGet.
  1. Вставте наступний код у HomeController.cs.
public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return RedirectToRoute("default",
          new { controller = "GridJs2", action = "List" });
        }

        public IActionResult Privacy()
        {
            return Redirect("https://about.aspose.app/legal/privacy-policy");
        }

        [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
        public IActionResult Error()
        {
            return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
        }
    }
  1. Створіть новий клас під назвою TestConfig.cs у папці Models і додайте наступний код (змініть шлях до папки відповідно до свого середовища).
public class TestConfig
{
    ///<summary>
    /// каталог, який містить файли робочої книги
    ///</summary>
    internal static String ListDir = @"D:\tmpdel\storage\wb";
    ///<summary>
    /// temp каталог для зберігання файлів
    ///</summary>
    internal static String TempDir = @"D:\tmpdel\storage\wb\tmp\";
}
  1. Створіть новий клас під назвою LocalFileCache.cs у папці Models і додайте наступний код.
/* Add the following namespaces as well.
using Aspose.Cells.GridJs;
using System.IO;
*/

public class LocalFileCache : GridCacheForStream
{

    ///<summary>
    /// Реалізуйте цей метод, щоб зберегти кеш, зберегти потік до об’єкта кешу з ідентифікатором ключа.
    ///</summary>
    ///<param name="s"> вихідний потік</param>
    ///<param name="uid"> ідентифікатор ключа.</param>
    public override void SaveStream(Stream s, String uid)
    {
        String filepath = Path.Combine(Config.FileCacheDirectory + Path.DirectorySeparatorChar + "streamcache", uid.Replace('/', '.'));
        using (FileStream fs = new FileStream(filepath, FileMode.Create))
        {
            s.Position = 0;
            s.CopyTo(fs);
        }

    }

    ///<summary>
    /// Реалізуйте цей метод для завантаження кешу з ключем uid, повернення потоку з об’єкта кешу.
    ///</summary>
    ///<param name="uid"> ідентифікатор ключа</param>
    ///<returns> потік з кешу</returns>
    public override Stream LoadStream(String uid)
    {
        String filepath = Path.Combine(Config.FileCacheDirectory + Path.DirectorySeparatorChar + "streamcache", uid.Replace('/', '.'));
        FileStream fs = new FileStream(filepath, FileMode.Open);
        return fs;
    }
    ///<summary>
    /// реалізувати URL-адресу в контролері дій, щоб отримати файл
    ///</summary>
    ///<param name="uid"> ідентифікатор ключа</param>
    ///<returns></returns>
    public override String GetFileUrl(string uid)
    {
        return "/GridJs2/GetFile?id=" + uid;
    }

}
  1. Створіть новий контролер під назвою GridJs2Controller.cs і додайте наступний код.
/* Add the following namespaces as well.
System.IO;
System.Collections;
System.Threading;
Microsoft.AspNetCore.StaticFiles;
Aspose.Cells.GridJs;
*/


[Route("[controller]/[action]")]
[ApiController]
public class GridJs2Controller : Controller
{

    public ActionResult List()
    {
        //this.ViewBag.list = новий список<object> ();
        ArrayList dirlistsss = new ArrayList();
        ArrayList filelistsss = new ArrayList();

        DirectoryInfo dir = new DirectoryInfo(TestConfig.ListDir);

        //знайти файли в каталозі
        FileInfo[] fi = dir.GetFiles();
        foreach (FileInfo f in fi)
        {
            String fname = f.FullName.ToString();
            dirlistsss.Add(fname);
            filelistsss.Add(Path.GetFileName(fname));
        }
        //  ViewData.
        ViewBag.dirlist = dirlistsss;
        ViewBag.filelist = filelistsss;
        return View("~/Views/Home/list.cshtml");
    }

    // GET: /GridJs2/DetailJson?filename=
    public ActionResult DetailFileJson(string filename)
    {


        String file = Path.Combine(TestConfig.ListDir, filename);

        return DetailJson(file);
    }



    private ActionResult DetailJson(string path)
    {
        GridJsWorkbook wbj = new GridJsWorkbook();


        try
        {
            GridInterruptMonitor m = new GridInterruptMonitor();
            wbj.SetInterruptMonitorForLoad(m, 50 * 1000);
            Thread t1 = new Thread(new ParameterizedThreadStart(InterruptMonitor));
            t1.Start(new object[] { m, 90 * 1000 });




            using (FileStream fs = new FileStream(path, FileMode.Open))
            {
                wbj.ImportExcelFile(fs, GridJsWorkbook.GetGridLoadFormat(Path.GetExtension(path)));
            }

        }
        catch (Exception ex)
        {

            if (ex is GridCellException)
            {
                return Content(wbj.ErrorJson(((GridCellException)ex).Message + ((GridCellException)ex).Code), "text/plain", System.Text.Encoding.UTF8);
            }
            return Content(wbj.ErrorJson(ex.Message), "text/plain", System.Text.Encoding.UTF8);
        }
        //return File(stream, "application/octet-stream", "streamfile");
        return Content(wbj.ExportToJson(), "text/plain", System.Text.Encoding.UTF8);
    }
    private static void InterruptMonitor(object o)
    {
        object[] os = (object[])o;
        try
        {
            Thread.Sleep((int)os[1]);

            ((GridInterruptMonitor)os[0]).Interrupt();
        }
        catch (ThreadInterruptedException e)
        {
            Console.WriteLine("Succeeded for load in give time.");
        }
    }
    [HttpPost]
    // повідомлення: /GridJs2/UpdateCell
    public ActionResult UpdateCell()
    {

        string p = HttpContext.Request.Form["p"];
        string uid = HttpContext.Request.Form["uid"];
        GridJsWorkbook gwb = new GridJsWorkbook();
        String ret = gwb.UpdateCell(p, uid);

        return Content(ret, "text/plain", System.Text.Encoding.UTF8);
    }


    // ОТРИМАЙТЕ: /GridJs2/Xspreadtml
    public ActionResult Xspreadtml(String filename)
    {
        return Redirect("~/xspread/index.html?file=" + filename);
    }

    // GET: /GridJs2/Image?uid=&id=

    public FileResult Image()
    {

        string fileid = HttpContext.Request.Query["id"];
        string uid = HttpContext.Request.Query["uid"];

        return new FileStreamResult(GridJsWorkbook.GetImageStream(uid, fileid), "image/png");
    }

    //якщо використовується GridCacheForStream, вам потрібно встановити цей API
    // GET: /GridJs2/ImageUrl?uid=&id=
    public JsonResult ImageUrl(string id, string uid)
    {


        return new JsonResult(GridJsWorkbook.GetImageUrl(uid, id, "."));

    }
    private string GetMimeType(string FileName)
    {
        string contentType;
        new FileExtensionContentTypeProvider().TryGetContentType(FileName, out contentType);
        return contentType ?? "application/octet-stream";
    }




    // GET: /GridJs2/GetFile?id

    public FileResult GetFile(string id)
    {

        string fileid = id;
        string mimeType = GetMimeType(fileid);

        return File(GridJsWorkbook.CacheImp.LoadStream(fileid), mimeType, fileid.Replace('/', '.'));
    }


    ///<summary>
    /// завантажити файл
    ///</summary>
    ///<returns></returns>
    [HttpPost]

    public JsonResult Download()
    {

        string p = HttpContext.Request.Form["p"];
        string uid = HttpContext.Request.Form["uid"];
        string filename = "123.xlsx";

        GridJsWorkbook wb = new GridJsWorkbook();
        wb.MergeExcelFileFromJson(uid, p);



        GridInterruptMonitor m = new GridInterruptMonitor();
        wb.SetInterruptMonitorForSave(m);
        Thread t1 = new Thread(new ParameterizedThreadStart(InterruptMonitor));
        t1.Start(new object[] { m, 30 * 1000 });
        try
        {
            wb.SaveToCacheWithFileName(uid, filename, null);
        }
        catch (Exception ex)
        {

            if (ex is GridCellException)
            {
                return Json(((GridCellException)ex).Message + ((GridCellException)ex).Code);
            }
        }
        if (filename.EndsWith(".html"))
        {
            filename += ".zip";
        }
        String fileurl = GridJsWorkbook.CacheImp.GetFileUrl(uid + "/" + filename);
        return new JsonResult(fileurl);
    }


}
  1. Вставте наступний код у функцію Configure Startup.cs і встановіть шлях до файлу ліцензії (отримайте ліцензію безкоштовно).
/* Add the following namespace as well.
using Aspose.Cells.GridJs;
*/

License l = new License();
LocalFileCache mwc = new LocalFileCache();
GridJsWorkbook.CacheImp = mwc;
l.SetLicense(@"D:\licenses\Conholdate.Total.Product.Family.lic");
  1. Вставте наступний код у Views/Home/index.cshtml.
@{
    ViewData["Title"] = "Home Page";
}
  1. Створіть нове представлення під назвою list.cshtml у папці Views/Home/ і вставте наступний код.
<div id="body" style="  width: 800px; height: 800px; border: 1px solid; overflow-y: scroll; SCROLLBAR-BASE-COLOR: #8ccc8c;">
    @foreach (var item in ViewBag.filelist)
    {
        <a href="Xspreadtml?filename=@item" target="_blank"><em> @item   </em>  </a> <br />
    }
</div>
  1. Завантажте папку xspread із GitHub і розмістіть її в папці wwwroot, як показано нижче.
  1. Переконайтеся, що номер порту, указаний у wwwroot/xspread/index.html, збігається з номером порту проекту.

  2. Створіть програму та запустіть її у своєму улюбленому браузері.

Демонстрація – створення або редагування файлів Excel в ASP.NET MVC

Нижче наведено демонстрацію програми електронної таблиці ASP.NET MVC, яку ми щойно створили.

Завантажити вихідний код

Ви можете завантажити повний вихідний код програми для роботи з електронними таблицями з GitHub.

Отримайте безкоштовну ліцензію

Ви можете використовувати Aspose.Cells.GridJs без обмежень оцінки за допомогою тимчасової ліцензії.

Висновок

У цій статті ви дізналися, як створити програму для роботи з електронними таблицями ASP.NET MVC із набором функцій для створення та редагування файлів Excel та інших електронних таблиць. Ви можете налаштувати цю програму або інтегрувати її у власну веб-програму. Якщо у вас виникнуть запитання, надішліть допис на нашому форумі.

Дивись також