Asp.net-Web-Api
直接從 Web api 核心端點返回 base64 編碼圖像
我已經看到了這些答案:
但這些要麼直接提供物理文件,要麼從字節數組提供服務。
請問有沒有辦法讓我們的 Web API 端點直接從 data:image/png;base64,(我們的 base64 字元串)返回 content-type: image/png
從文件夾中讀取文件非常簡單。訣竅是在ASP.NET Core中使用IHostingEnvironment來獲取目前的 Web 根路徑。
文件控制器
using System; using Microsoft.AspNetCore.Hosting; using Microsoft.AspNetCore.Mvc; namespace DemoWebApiCore.Controllers { [Route("api/[controller]")] public class FilesController : Controller { private readonly IHostingEnvironment _hostingEnvironment; public FilesController(IHostingEnvironment hostingEnvironment) { _hostingEnvironment = hostingEnvironment; } // GET api/files/sample.png [HttpGet("{fileName}")] public string Get(string fileName) { string path = _hostingEnvironment.WebRootPath + "/images/" + fileName; byte[] b = System.IO.File.ReadAllBytes(path); return "data:image/png;base64," + Convert.ToBase64String(b); } } }用法
家庭控制器.cs
using Microsoft.AspNetCore.Mvc; namespace DemoWebApiCore.Controllers { public class HomeController : Controller { // GET: /<controller>/ public IActionResult Index() { return View(); } } }索引.cshtml
<html> <body> <img id="sample-img" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script type="text/javascript"> $(function () { var url = "/api/files/sample.png"; $.get(url, function (data) { console.log(data); $("#sample-img").attr('src', data); }); }) </script> </body> </html>