問題

• 生成縮略圖
• 生成驗證碼
• 生成二維碼
• 給圖片加水印

外部引用

• Node ?不解釋 ?https://nodejs.org/en/download/
• sharp 高性能縮略圖 ?https://github.com/lovell/sharp
• qr-image ?二維碼 ?https://github.com/alexeyten/qr-image
• captchagen ?驗證碼 ?https://github.com/contra/captchagen
• node-images ?輕量級跨平臺圖像編解碼庫?https://github.com/zhangyuanwei/node-images
  
  

生成縮略圖代碼
resizeImage.js

1 var sharp = require('sharp'); 2 3 module.exports = function (result, physicalPath, mimeType, maxWidth, maxHeight) { 4 // Invoke the 'sharp' NPM module, and have it pipe the resulting image data back to .NET 5 sharp(physicalPath) 6 .resize(maxWidth || null, maxHeight || null) 7 .pipe(result.stream); 8 }

ResizeController.cs

1 public class ResizeController : Controller 2 { 3 private const int MaxDimension = 1000; 4 private static string[] AllowedMimeTypes = new[] { "image/jpeg", "image/png", "image/gif" }; 5 6 private IHostingEnvironment _environment; 7 private INodeServices _nodeServices; 8 9 public ResizeController(IHostingEnvironment environment, INodeServices nodeServices) 10 { 11 _environment = environment; 12 _nodeServices = nodeServices; 13 } 14 15 [Route("resize_{maxWidth}_{maxHeight}/{*imagePath}")] 16 public async Task<IActionResult> Index(string imagePath, int maxWidth, int maxHeight) 17 { 28 imagePath = imagePath; 29 // Validate incoming params 30 if (maxWidth < 0 || maxHeight < 0 || maxWidth > MaxDimension || maxHeight > MaxDimension 31 || (maxWidth + maxHeight) == 0) 32 { 33 return BadRequest("Invalid dimensions"); 34 } 35 36 var mimeType = GetContentType(imagePath); 37 if (Array.IndexOf(AllowedMimeTypes, mimeType) < 0) 38 { 39 return BadRequest("Disallowed image format"); 40 } 41 42 // Locate source image on disk 43 var fileInfo = _environment.WebRootFileProvider.GetFileInfo(imagePath); 44 if (!fileInfo.Exists) 45 { 46 return NotFound(); 47 } 48 49 // Invoke Node and pipe the result to the response 50 var imageStream = await _nodeServices.InvokeAsync<Stream>( 51 "./Node/resizeImage", 52 fileInfo.PhysicalPath, 53 mimeType, 54 maxWidth, 55 maxHeight); 56 return File(imageStream, mimeType); 57 } 58 59 private string GetContentType(string path) 60 { 61 string result; 62 return new FileExtensionContentTypeProvider().TryGetContentType(path, out result) ? result : null; 63 } 64 }

效果

生成驗證碼代碼
captchagen.js

1 var captchagen = require('captchagen'); 2 module.exports = function (result, width, height, text) { 3 // optional object arg with keys: height, width, text, font 4 var captcha = captchagen.create({ width: width, height: height, text: text||'8888'}); 5 captcha.generate(); // Draws the image to the canvas 6 /* call `generate()` before running the below */ 7 captcha.stream().pipe(result.stream); // outputs an image stream. type can be either png or jpeg (png is the default) 8 }

效果


生成二維碼代碼

1 var qr = require('qr-image'); 2 module.exports = function (result, size, url) { 3 qr.image(url, { type: 'png', size: size, margin: 1 }) 4 .pipe(result.stream); 5 }

效果


總結(jié)

安裝Node引用組件時費了不少時間主要是因為沒細看作者給出的各種環(huán)境下的安裝說明。

加水印目前還沒做好，主要是要修改源碼實現(xiàn)支持stream類型輸出

拋磚引玉，希望更多朋友分享 Node各種組件的應(yīng)用，

轉(zhuǎn)載于:https://www.cnblogs.com/wspnet/p/NodeJS_NetCore_System_Drawing_Faq.html

總結(jié)

以上是生活随笔為你收集整理的跨平台的 NodeJS 组件解决 .NetCore 不支持 System.Drawing图形功能的若干问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。