能否在ASP.NET Core Web应用中实现文件编辑功能？

完全可以在ASP.NET Core中实现点击按钮编辑文件内容的功能，无需依赖React这类前端框架，用Razor Pages就能做到轻量实现，避免创建大量文件。

核心方案：Razor Pages服务器端处理 #

Razor Pages是ASP.NET Core中轻量的页面模型，一个页面仅需两个文件（.cshtml前端页面 + .cshtml.cs后台逻辑），所有文件操作逻辑在服务器端完成，前端用原生HTML和少量JS即可实现交互。

具体实现步骤 #

1. 创建一个Razor Pages项目（或在现有项目中添加Razor Page）
2. 编写后台文件读取、添加、删除的逻辑
3. 前端页面添加交互按钮，通过表单提交或原生AJAX触发后台方法

代码示例 #

后台逻辑（FileEdit.cshtml.cs）

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using System.IO;
using System.Collections.Generic;

namespace YourProjectNamespace.Pages
{
    public class FileEditModel : PageModel
    {
        // 指定要编辑的文件路径，示例放在wwwroot下的data.txt
        private readonly string _targetFile = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "data.txt");

        [BindProperty]
        public string FileContent { get; set; }

        [BindProperty]
        public string NewContentLine { get; set; }

        [BindProperty]
        public int LineIndexToDelete { get; set; }

        // 页面加载时读取文件内容
        public void OnGet()
        {
            if (System.IO.File.Exists(_targetFile))
            {
                FileContent = System.IO.File.ReadAllText(_targetFile);
            }
            else
            {
                // 文件不存在则创建空文件
                System.IO.File.Create(_targetFile).Close();
                FileContent = string.Empty;
            }
        }

        // 添加内容的后台方法
        public IActionResult OnPostAddLine()
        {
            if (!string.IsNullOrWhiteSpace(NewContentLine))
            {
                System.IO.File.AppendAllText(_targetFile, $"{NewContentLine}{Environment.NewLine}");
            }
            return RedirectToPage();
        }

        // 删除指定行的后台方法
        public IActionResult OnPostDeleteLine()
        {
            if (System.IO.File.Exists(_targetFile))
            {
                var lines = System.IO.File.ReadAllLines(_targetFile).ToList();
                if (LineIndexToDelete >= 0 && LineIndexToDelete < lines.Count)
                {
                    lines.RemoveAt(LineIndexToDelete);
                    System.IO.File.WriteAllLines(_targetFile, lines);
                }
            }
            return RedirectToPage();
        }
    }
}

前端页面（FileEdit.cshtml）

@page
@model YourProjectNamespace.Pages.FileEditModel

<h1>文件内容编辑器</h1>

<!-- 显示当前文件内容 -->
<div class="content-area">
    <h3>当前内容：</h3>
    <pre>@Model.FileContent</pre>
</div>

<!-- 添加内容表单 -->
<form method="post" asp-page-handler="AddLine" class="action-form">
    <label>输入要添加的内容：</label>
    <input type="text" asp-for="NewContentLine" placeholder="输入内容..." />
    <button type="submit">添加行</button>
</form>

<!-- 删除内容表单 -->
<form method="post" asp-page-handler="DeleteLine" class="action-form">
    <label>输入要删除的行索引（从0开始）：</label>
    <input type="number" asp-for="LineIndexToDelete" min="0" />
    <button type="submit">删除行</button>
</form>

<style>
    .content-area { margin: 20px 0; padding: 10px; border: 1px solid #eee; }
    .action-form { margin: 10px 0; }
    input { margin: 0 10px; padding: 5px; }
</style>

可选：无刷新交互（原生AJAX） #

如果不想页面刷新，可以用原生JS的fetch API实现无刷新操作，修改前端部分代码即可：

<!-- 替换原有表单为以下内容 -->
<div class="action-group">
    <label>输入要添加的内容：</label>
    <input type="text" id="newLineInput" placeholder="输入内容..." />
    <button onclick="handleAddLine()">添加行（无刷新）</button>
</div>

<div class="action-group">
    <label>输入要删除的行索引（从0开始）：</label>
    <input type="number" id="deleteLineInput" min="0" />
    <button onclick="handleDeleteLine()">删除行（无刷新）</button>
</div>

<script>
    // 获取防跨站请求伪造令牌
    const getAntiForgeryToken = () => document.querySelector('input[name="__RequestVerificationToken"]').value;

    async function handleAddLine() {
        const newLine = document.getElementById('newLineInput').value.trim();
        if (!newLine) return;

        await fetch('/FileEdit?handler=AddLine', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'RequestVerificationToken': getAntiForgeryToken()
            },
            body: `NewContentLine=${encodeURIComponent(newLine)}`
        });

        // 刷新页面内容（或局部更新）
        location.reload();
    }

    async function handleDeleteLine() {
        const lineIndex = document.getElementById('deleteLineInput').value;
        if (isNaN(lineIndex) || lineIndex < 0) return;

        await fetch('/FileEdit?handler=DeleteLine', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'RequestVerificationToken': getAntiForgeryToken()
            },
            body: `LineIndexToDelete=${lineIndex}`
        });

        location.reload();
    }
</script>

注意事项 #

• 确保目标文件所在目录有读写权限，建议将文件放在wwwroot目录下，或配置正确的文件系统权限
• 如果编辑的是敏感文件，需添加身份验证和授权逻辑，限制访问
• 可根据需求扩展逻辑，比如编辑指定行内容、批量操作等

内容的提问来源于stack exchange，提问作者SmartCod3r