Category: HTML5

改版後托 Miniblog.Core 的福,部落格內建潮到出水的 PWA (Progressive Web App)支援,最近遇上 SSL 憑證更新,再學到 PWA / Service Worker 經驗一枚。 如下圖所示: 有個矛盾狀況:Chrome 顯示 SSL 憑證有效,但檢視內容憑證已於 ...

抓了開源專案 MiniBlog.Core 回來玩,想在其中套用 Form target 模擬 AJAX 表單傳送技巧時踢到鐵板,開啟 F12 偵錯工具後驚呼:天吶,這世界又變了! 新時代的 Postback 不再是單純送出一個 Request 拿回 HTTP 200,而是像這樣子: 如...

Chrome 自 59 版起內建了 Headless 模式,允許透過命令列啟動 Chrome 以無 GUI 方式執行,具備與正常開啟完全相同的網頁渲染及 JavaScript 引擎,還可透過網路連線遙控。這個功能可以用於不少有趣應用,這裡列舉幾種實用情境。 註:Headless Chrome ...

同事報案,Chrome 會莫名把客戶帳號填入輸入與帳號無關的 <input type="text"> 欄位,初步研判是 Chrome 內建的帳號密碼記憶小工具 Google Smart Lock 搞鬼。 用以下網頁重現問題。如操作所示,在登入網頁 Logon.a...

隨著主流瀏覽器支援度愈來愈好,在網頁裡用 SVG 取代 PNG、GIF 呈現圖示(Icon)及簡單圖案漸成趨勢,沒吃過豬肉也要看看豬走路,趕緊做點功課並整理筆記備忘。 網頁引用 SVG 有三種做法: Object: <embed src="…"> &l...

鹹蝦專案(利用閒暇經營的 Side Project)遇到的需求,先前把 MP3 音效資料整進 SQL 資料表轉成 IMAGE 資料型別,查詢起來像這樣: 如果我想試聽這段聲音該怎麼辦? 網路上可以找到一些 T-SQL 範例,將 SQL 裡的二進位資料匯出成檔案。不過這樣子每次試聽的步驟有點麻煩:...

就用這篇鬼故事當開場吧!在 2016 年学 JavaScript 是一种什么样的体验? 這幾年 HTML5 火紅,前端開發技術發展如黃河氾濫一發不可收拾,開發框架百家齊嗚,眼花瞭亂不知如何下手就算了,更要命的是市場主流每兩年就轉一次風向,兩年前我才含淚從 Knockout 轉到 Angular...

整合清代ASP的工作持續進行,上回提過用IFrame內嵌ASP網頁時,父網頁與IFrame必須為同樣的IE模式,若父網頁要採HTML5時代寫法,就得考量各程式庫的IE最低版本要求,例如:KendoUI為IE8以上、AngularJS 1.3+需要IE9,再加上XML Data Island最後的...

前文提到眼前的棘手任務是在HTML5網站整合活化石等級的ASP(是的,就是ASP!不是ASPX),其中一大挑戰是ASP網頁裡大量使用XML Data Island與VBScript,能不能與HTML5並存是未知數,心中最理想結果是以IFrame內嵌ASP,大草原上羚羊跟迅猛龍一起快樂奔跑,世界真...

始終沒認真搞懂X-UA-Compatible IE=7跟IE=EmulateIE7有什麼不同,最近專案要步入「古今合壁」的偉大工程,把許多IE Only的活化石網頁跟HTML5網頁摻在一起做瀨尿牛丸,再不弄清楚恐會死得難看,於是查了文件做了實驗,筆記備忘。 MSDN文件 Defining do...

文章標題有點饒舌難懂,直接說我需求就清楚了。我想在員工入口網站(例如:portal.utopia.com)加入人事、行政、會計、電子表單等現成網站功能,這些應用程式各有自己的網站(例如:webap.utopia.com),最簡單的整合方法是在入口網站放個Iframe將其他網站的網頁內嵌進來,兩分鐘...

同事報案網頁在IE與Chrome表現不同,依稀記得遇過,但沒寫成沒找到明確記錄,花了時間回想、研究、實驗,得到結論後才恍然憶起,從HipChat對談翻出以前的辦案記錄。明明是前科犯還重啟調查,記憶力壞掉好可怕,也懊悔浪費了時間。由此得一結論-「勿以茶包小而不記,永遠別信任中年人的記憶力」,故寫此...

開始試用docfx產生API文件(docfx是微軟程式庫文件產生器SandCastle的接班人),編譯專案時可一併產生API文件網頁,非常方便,大推!(docx的安裝使用可參考網友霧隱虎的文章,VS2015用NuGet在專案安裝docfx.msbuild,以後每次編譯時可在_site目錄找到API...

微軟在Windows Phone 8.1 Update裡幹了一件看似好笑的事,把Windows Phone的IE11 User Agent改成: Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Tou...

除了Canvas,HTML5還提供另一種向量繪圖技術--SVG(Scalable Vector Graphics),透過XML標籤定義矩形、圓弧、路徑(Path)、多邊形(Polygon)等向量模型,並可加上濾鏡、變形等特效,就能在網頁顯示可縮放的向量圖案。而SVG的XML元素如同HTML元素能...

程式寫多了,什麼死人骨頭都可能遇到題材都有機會玩到。最近在寫電子表單流程圖模組,根本是在複習國中數學: sin、cos、兩點距離...  被幾何邏輯搞到昏頭,在草稿紙畫了一堆三角形示意圖還是似懂非懂 orz(數學老師站在我背後,他非常火) 其中有個需求: 用線條連接矩形中心與外部點,...