第25個冬天

  通常富文本編輯器中還涉及到圖檔上傳的處裡 我們可在Blazor Server專案目錄創建webapi 目錄並新增一個API 控制器 ImageHandlerController 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 using System ; using System.Collections.Generic ; using System.IO ; using System.Linq ; using System.Text ; using System.Threading.Tasks ; using Microsoft.AspNetCore.Http ; using Microsoft.AspNetCore.Mvc ; namespace XXXProj.WebApi { [Route("api/Images")] [ApiController] public class ImageHandlerController : ControllerBase { [HttpPost, DisableRequestSizeLimit] public IActionResult Upload () { try { IFormFile file = Request.Form.Files[ 0 ]; if (file.Length > 0 ) { string strFileName = $ "{Guid

  書局網站優化 配置一個loading效果載入的css檔案 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 body { margin : 0 ; padding : 0 ; width : 100 vw; height : 100 vh; background-color : #eee ; } .content { display : flex; justify - content : center ; align-items: center ; width : 100 %; height : 100 %; } .loader-wrapper { z-index : 500 ; width : 100 %; height : 100 %; position : absolute ; top : 0 ; left : 0 ; background-color : #242f3f ; display :flex; justify - content : center ; align-items: center ; } .loader { z-index : 500 ; display : inline - block ; width : 30px ; height : 30px ; position : relative ; border : 4px solid #Fff ; animation: loader 2s infinite ease; } .loader-inner { vertical-align : top ; display : inline - block ; width : 100 %; background-color : #fff ; animation: loader-inner 2s infinit

  近期又開始超忙碌了 要忙鐵人 還要協助研究技術>~<||| 好吧廢話不多說來準備整合富文本編輯器(CKEditor)到 Blazor 中吧 在很久前曾研究並於專案中使用過 那時結合NodeJs後端搭配ckeditor4 https://coolmandiary.blogspot.com/2021/02/nodejswysiwygckeditor4.html 這次採用新版本ver5做整併 https://ckeditor.com/ckeditor-5/online-builder/ 這裡多加兩項plugins (CKEditor 可讓我自行組合所需的插件) 這裡我就選以下這些 若有勾選到涉及雲端服務付費的會在最後一步驟匯出前有提醒 https://ckeditor.com/pricing/ 預設自動幫我們挑選了這個有premium的 那就先取消選取 等他下載匯出一版js 預設解壓出來會有sample code直接可以運行跑效果 將ckeditor.js添加至專案當中的 wwwroot 再到_Host.cshtml 去引入此js 詳情可參考 Blazor第6天_Blazor_在Blazor中去呼叫存取javascript https://coolmandiary.blogspot.com/2022/04/blazor6blazorblazorjavascript.html 預設build過的js會壓縮 這邊若要排版好看觀察有哪些function 可以先線上js排版好後觀察有哪些function可以使用 https://beautifier.io/ 由於太長就省略 將新增好的另一個editor.js存放在相同目錄 editor.js程式碼 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 editors = {}; function CreateEditor(editorId, defaultValue, height, dotNetReference) { ClassicEditor

  由於光罩反光導致在OTSU二值化要去分割指針線 會有較長那端點誤判問題 使演算法較為不穩定 就用簡易版的原始影像通道分割後各自做值方圖均衡 再合併回來即可 原始灰度圖值方圖分布 補償後的效果

  https://www.trademag.org.tw/page/itemsd/?id=7857896&no=47 OE : 原始設備(Original Equipment) 行業內的行話:OE號碼是一個配件的統一代號，一般由生產商標定。 汽配批發商，經銷商，汽修廠，配件使用者，藉由這個oe號，可以快速定位到具體的配件，對於配件採購非常的重要。 OEM :原始設備製造商(Original Equipment Manufacturer)->(代工廠 or 貼牌代工) 是原大廠牌車廠(比方福特、Toyota)將零件授權給零件廠製造，但該零件廠無法以相同的設計圖進行其他車廠的 OEM 製造。 常見車子零組件製造商 台灣最大OEM車燈製造商-大億 大億替福特生產車燈，就無法自行替 Toyota代作同一款車燈。 因為知識產權在車廠手上，因此被委託的零件廠也可以稱為 “代工廠”。 OE 跟 OEM之間會產生價差 例如: A汽車公司將某個汽車零配件委託B工廠為其加工生產，貼上A公司原廠商標售出 這類產品就被稱作OE或OES產品。 但若A公司並沒有買斷該產品的所有權，那B工廠就可以生產一模一樣的產品， 而且沒有A公司的標籤，這樣的產品就屬於OEM產品。 通常同樣商品OE會來的筆OEM還昂貴 在台灣的則多半是以 OEM 的形式代工經營，而有些代工廠會較積極提升自己的技術 讓大型車廠依賴自己的研發技術與設計能力，以轉型為 ODM 。 ODM: 原始設計製造商(Original Design Manufacturer) 零件的設計、製造由零件廠一手包辦，完成後在交給大型車廠。和 OEM 狀況不同的是受委託的零件商因為自有擁有知識產權，有辦法稍微修改一下設計再拿來替其他品牌生產，被委託的零件廠的生產可以稱為 “貼牌”。 OES: 原廠委託售後服務(Original Equipment Suppliers) 當汽車需要維修時，有原廠指定的售後維修提供零件稱為 OES。汽車車廠仍然掌握零件的核心技術，再交由其他 OES 的零件廠生產，也可能是直接由原廠生產。OES 的零件都掛有原廠的品牌，但是價格相對於副廠還是較昂貴，銷售管道多為原廠指定店家。 AM: 售後維修的非原廠零件(Aftermarket) 售後維修的非原廠零件，也就是我們稱的副廠。 廠商並非透過供應鏈將成品流向汽車

  有時在上一些第三方的開設課程時候 可能是透過FB社團影片方式在做限制View Only課程影片資源的分享 會鎖定時限內影片會關閉 此時若要將影片資料給備份 在FB中無法去下載(只給唯讀權限) 因此可透過此網址來進行下載 https://snapsave.app/download-private-video 當然還是必須尊重講師的版權不要散播 備份出來自行複習用途 複製該影片URL 再來開啟該頁檢視原始碼整個複製出來

  有時在上一些第三方平台課程時候 可能是透過onedrive方式在做課程影片資源的分享 會鎖定時限內onedrive影片會關閉 此時若要將影片資料給備份 在onedrive中無法去下載(只給唯讀權限) 第一種方式透過螢幕錄影 當然會比較麻煩電腦此時都不能做其他事情 第二種方式透過 ffmpeg -i指令 ffmpeg -i " https://theURLtoTheManifestYouCopiedHere " -codec copy 影片檔名.mp4 windows平台若要下載ffmpeg可以到 https://www.gyan.dev/ffmpeg/builds/ 看是要解壓直接移動至該exe相應目錄做cmd執行 還是添加至系統環境變數後再全域執行皆可 onedrive影片開啟後切換開發人員工具可以到network頁籤 針對關鍵字videomanifest搜尋 並將link address給右鍵copy出來再複製粘貼到上方的紅色部分做取代 在執行整句命令即可 Ref: Win 10 安裝 FFmpeg https://annkuoq.github.io/blog/2019-12-17-install-ffmpeg/ Force Download View Only Video From Microsoft Sharepoint / Streams https://vball.fun/2021/12/10/download-view-only-video-from-microsoft-sharepoint/index.html How to download protected files from onedrive using WGET https://stackoverflow.com/questions/62634214/how-to-download-protected-files-from-onedrive-using-wget

  有時可能會將一些表單資料封裝成DTO或者來自EF某張表的record entity 剛好又涉及到要寫複製資料功能進行局部欄位資料異動時候 就會時常發生連動到舊物件資料的問題 有問題寫法 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 using System ; class Person { public string Name { get ; set ; } public int Age { get ; set ; } } public class Program { public static void Main () { Person person1 = new Person(); person1.Age= 23 ; person1.Name= "Amy" ; Console.WriteLine(String.Format( "person1 name:{0} / Age:{1}" ,person1.Name,person1.Age)); Person person2 = person1; person2.Name = "Ted" ; Console.WriteLine(String.Format( "person1 name:{0} / Age:{1}" ,person1.Name,person1.Age)); Console.WriteLine(String.Format( "person2 name:{0} / Age:{1}" ,person2.Name,person2.Age)); Console.ReadLine(); } } 會觀察到物件複製寫法不對只有異動person2的Name也連動到person1的Name 第一種修正法.重新new並指定欄位 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 using System ; class Person { pub