ASP.NET Core中提交新记录后播放声音的实现方法

• 步骤1：在Post提交方法中添加提交标记
  在你的[HttpPost]控制器方法里，完成记录保存逻辑后，通过TempData存入一个标识，用来告知视图本次请求是提交完成后的跳转：

  [HttpPost]
  public IActionResult Create(YourModel model)
  {
      if (ModelState.IsValid)
      {
          // 执行记录保存操作
          _context.Add(model);
          _context.SaveChanges();
          // 添加提交成功标记
          TempData["SubmissionDone"] = "1";
          return RedirectToAction(nameof(Index)); // 跳转到展示所有记录的视图
      }
      return View(model);
  }
  

• 步骤2：在展示视图中添加音频播放逻辑
  在展示所有记录的视图（比如Index.cshtml）底部，添加一段JS代码，检测TempData中的标记，存在则触发音频播放。先把提示音频（比如success.mp3）放到wwwroot/audio目录下：

  @if (TempData["SubmissionDone"] != null)
  {
      <script>
          // 创建音频实例并尝试播放
          const successAudio = new Audio('/audio/success.mp3');
          successAudio.play().catch(err => {
              console.log('音频播放失败:', err);
          });
      </script>
  }
  

• 额外说明

  • 部分浏览器有自动播放限制，若遇到播放失败的情况，可以考虑添加一个手动触发的提示按钮，或者使用短时长的提示音（这类音频的自动播放限制相对宽松）。
  • 确保音频文件路径正确，wwwroot目录下的资源可直接通过根路径访问。

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