Posts

[ASP.NET] 如何把檔案上傳到WEB API?

Image
研究背景:

最近協助朋友研究在公司網站建立新功能,讓客戶可以直接上傳檔案到公司的內部伺服器。

系統架構如下圖,檔案最後會放在公司內部的Web API Servr。而Web API接收上傳檔案的API是使用HTML的FormData格式


問題: 網路上大部分教學是利用jquery ajax把檔案直接上傳到Web API上,可是公司Web API是內部使用的伺服器,所以只能透過Web Server存取。解決方案: 以下是其中一種試過可行的做法。
Web Server部分Web API接收上傳檔案的API是使用HTML的FormData格式,所以當Web Server接收到Browser的上傳後需要把檔案轉成multipart/form-data的http Request,然後發送到後端的Web API去。產生的方法至少有兩種自己寫HTTP Request Message
post Upload上传文件中multipart/form-data 做的那些事
使用套件 RESTSharp
 Git
我們所使用的是REST Sharp。先讀取來自Browser的Request,然後把檔案變成multipart/form-data,再產生Http Request上傳到Web API。

namespace/*project name*/.Controllers { publicclass FilesController : Controller { // GET: Filespublicstring Upload() { List<string> filesList = new List<string>(); try { foreach(string file in Request.Files) { var fileContent = Request.Files[file]; if (fileContent != null & fileContent.ContentLength > 0) …

[雜] ThinkPad X200 上安裝Ubuntu版本經驗

Image
陪了我8年的ThinkPad X200自上一年開始使用Ubuntu 14.04 + SSD 加持後簡直是重振雄風,除了一些硬件問題 (螢幕變暗反應變慢,CPU不夠強不能看4K影片,沒有獨顯Scrolling不要太快) 外基本上還是順順的。聖誕節的時候手癢直接升級Ubuntu 16.04,結果問題就出來了...杯具。

我的ThinkPadX200規格:

CPU:Intel® Core™2 Duo Processor P8800記憶體:8GB硬碟:128GB SSD (品牌都忘了,反正是撿便宜)

在我這種老筆電跑Ubuntu16.04暫時發現了以下問題:

畫面太華麗: 16.04有很多Transparent的特效,每次秀出來都卡死了,就是用了 GNOME Tweak Tool and Unity Tweak Tool 把過場畫面關掉效果也不會回到14.04那種順暢感
GNOME Tweak Tool and Unity Tweak Tool 安裝方法CPU資源:P8800 速度本身不高,用Top查詢發現有些比較耗CPU的系統程序經常在跑,導致CPU溫度稍為高。我猜如果用在今天的筆電應該沒有太大問題,但是老筆電對於CPU就是斤斤計較。用Chrome異常慢:我也不知道是啥問題。 所以最後昨天我實在忍不下去了,還是重灌回14.04,再看看情況再上來報告。 暫時使用14.04是很順暢的,雖然畫面比較老舊。

01/03/2017更新:暫時來說沒有任何問題,而且連裡面的Win7 VM也順了很多
*不要問我身為堐踢狗為什麼不換筆電......

[ASP.NET MVC] 利用OAuth2為網站進行使用者認證的簡單實作

Image
前言:
公司最近打算使用由政府提供的市民登入平台,原因是利用這個平台登入的帳號具有等同自然人的法律效力,其他廠商不用老遠跑來公司簽約可以直接網路上搞定。政府使用的技術是OAuth2認證機制,所以小弟必需被逼研究熟悉整個流程再把公司的系統整合進去。

老實說,Oauth2一開始還真的看得我一頭霧水(霧煞煞),因為OAuth2跟傳統UserName Password的認證方式很不一樣,而且OAuth2在網站上及APP上的實現方法也不同,再加上網路上的圖文說明也很複雜。最後找到神人「鴨七」大大整理出三百多頁的PPT[1]及他在網站上的詳細介紹[2],來回看了幾次終於比較明白整套理論,以下說明是精簡版本,全部概念以網站架構為中心,未必完全適用於APP及Winform:

為什麼要OAuth2?
政府用的是OAuth2小弟又有什麼辦法呢我個人的看法是使用OAuth2的網站必須先向提供OAuth2的服務提供者進行登記,再加上對用戶的認證以後,就相當於有兩層的保護。再加上網站從頭到尾沒有碰過你的使用者帳號跟密碼,減少被盜取的可能,當然trust機制還是會有很多漏洞,例如User亂授權,不過已經是社交層面了。


OAuth2常用角色

Client: 通常是指你自己開發的系統。 Authorization Server: 處理認證、發出access Token的伺服器。Resource Server:保持資源的伺服器,在facebook的例子就是你的個人資料。Resource Owner: 就是人,或者User。 User Agent: 用戶代理,通常指的是Browser。OAuth2常用術語 Client ID and Client secret:
由於使用OAuth2的Client網站要先向Authorzation Endpoint(OAuth2提供者)進行登記,說明用途及Redirect URL,登記完之後Client ID就像OAuth2提供者發給你網站的身份證字號,通常為亂數, 而srcret就是公開金鑰。
Redirect URL:
由於當完成OAuth2程序後轉回Client網站的動作是由OAuth2提供者直接執行,以防止CSRF (Cross-site request forgery)攻擊。所以必須向Authorization Server登記URL。
AccessToken:
要讀取R…

[ASP.NET MVC] jquery 常見問題整理

Image
筆記動機: 
公司要開發一堆給客戶用的網路服務,由於IT部門預算很緊 那有一天不緊的,
一向負責寫RESTFUL後端商業流程的小弟終於還是要面對程序猿最害怕的使用者界面部分。
初步想法是把後端Restful API處理完的資料變成Json,再透過Viewbag把資料顯示在View上,所以最後變成以下塔配:

後端商業邏輯:Restful API網站: ASP.NET MVC、Newton.Json前端: jquery + json資料 由於小弟jquery是lv 1,所以一定要筆記一下不然很快會忘記
內容: 如何把data變成Json?
可以利用System.Web.Sript.Serialization的JavaSceiptSerializer() 或者Newtonsoft的JsonConvert.SerializaObject()
returnnewJavaScriptSerializer().Serialize(data);
View收到Json的ViewBag後怎樣可以讓jquery存取? 利用@Html.Raw(@ViewBag) 先將ViewBag轉回Json,例如我要把回傳回來的user profile轉回成JSONvar data = @Html.Raw(ViewBag.userprofile); 回傳回來的Json raw data 怎樣轉成人看的資料?
先在打算顯示資料的地方寫一個具有Id的 <div>,例如
<divid="appendUserProfile"></div> 然後在<script> 中加入.each迴圈把json每個item取出來
var data =@Html.Raw(ViewBag.userprofile); $(document).ready( function () { $.each(data, function (key, value) { $('#appendUserProfile').append('<tr><th>'+key+'</th><th>'+value+…

[Visual Studio] 使用Team Service進行系統開發心得整理

Image
前言:
身為C#的Code guy仆街當然會有自己私下開發的專案,遇到Versioning Control或者Scrum的時候就比較麻煩。用Github不是不好,不過有些時候專案只是想一個人使用就不行。最近開始試用Microsoft 的Team foundation Service,直接把經驗記錄下來當個筆記。

安裝:


1. 在Team Service建立專案:


首先建立一個Team Service Location (還沒申請的話可以按這裡申請)


在Team Service頁面(https://xxxxx.visualstudio.com)中「Recent Projects & teams」中選擇「New」,彈出視窗後填寫資料,然後按「Create project」。



生成專案需要一點時間,完了以後會出現以下畫面,按「Navigate to project」



順利產生專案



2. 連接Visual Studio

小弟使用的是Visual Studio 2015。先打開VS,按右邊的「Team Explorer」,在「Manage Connections」中選擇「Connect to Team Project」


按下右邊的「Servers」,選擇「Add」,加入Team Service的https路徑


選擇你剛新增的專案,按「Connect」就完成囉
3. Push/Pull

[ASP.NET MVC] Rich Text Editor 安裝心得 (以TinyMce為例)

Image
前言:

最近小弟幫公司開發的系統內需要撰寫郵件及發送,所以要找一個Rich Text Editor放在系統內。網路上找到TinyMCE口碑不錯,決定使用它。還蠻夠隨便
TinyMCE官網:https://www.tinymce.com/


安裝:
先用Visual Studio打開專案,選擇Tools➜Nuget Package Manager➜ Manage NuGet Packages for Solution


在「Browse」中輸入「TinyMCE」按「Search」找到以後在右邊選擇你的Project後按「Install」。
(小弟試過安裝的時候Visual Studio會像當掉一樣持續幾分鐘沒反應,不用最後還是成功嚇死寶寶了)

安裝成功後在「Solution Explorer」中找到「Scripts」資料夾,底下應該會出現一個叫「tinymce」的子資料夾



TinyMCE好處是Model或者ViewModel變化不大。開啟要加入TinyMCE的Model或者VIewModel,把需要變成TinyMCE的欄位加入 [AllowHtml] 的Data Annotations。

再來找出要加入TinyMCE的View,在Section Scripts中加入相對應Reference。
然後在View加入以下Javascript (如果要客制化Editor的話官網有文件可以查) <script type="text/javascript"> // Initialize your tinyMCE Editor with your preferred options tinyMCE.init({ // General options mode: "textareas", theme: "modern", // Theme options theme_advanced_buttons1: "save,newdocument,|,bold,italic,underline,strikethrough,…

[SQL Server] 解決不斷出現 ASYNC_NETWORK_IO 導致TimeOut的問題

Image
病徵:

公司在VMware上的SQL Server最近不斷出現大量的ASYNC_NETWORK_IO錯誤,而且有時候會出現TimeOut的情況。檢查RAM, CPU, IO皆正常沒有異常的情況。

研究:
拜了一下Google大神,如果硬體自我感覺良好,不外乎也是幾個原因[1][2]:

回傳過大的查詢結果。Database網路卡設定有問題,回傳速度很慢。Client端跟Database 端的網路連結出現問題。Linked Server等待遠端資料表的回應。第一個原因可以在Activity monitor裡面Process這一欄找一下出現Error的Process SQL Statement是什麼。小弟發現出現ASYNC_NETWORK_IO的SQL查詢100%來自一個資料表,這個資料表有60萬筆的數據、沒有Primary Key、而且每次回傳也要做Ordering,使用CPU是Top Ten,不過還沒嚴重到影響資料庫的效能。
發現問題的時候打開了效能檢示器,傳輸的量沒有達到網路卡的最大值。跟infra team討論後VMware的實體網路卡也是正常,暫時排除這個可能。
隨機取樣一些出現這個情況的user打電話問看看,沒有發現網路不正常的情況,暫時排除這個可能。
這個資料表不是Linked Server,所以也排除掉。暫時得出的結論
直像告訴我好像是第一個原因比較像。
解決方法 由於還不能100%保證病因,所以今天小弟做了兩件事: 跟programmer溝通一下,發現這些查詢是Delphi 內部的 Data engine產生,所以programmer無法刪除這種回傳全部Data還要Ordering的百痴沒用查詢,也由於這個資料表是公司內部很多系統的log table,因此I/O很高,也無法減少存取次數。
所以最後我把資料表的資料量盡量壓縮,縮成只儲存一個星期,每天把剩下的自動備份到另一個資料表去。看看情況有沒有改善。
加入Cluster Index,不能改SQL至少也讓它快一些。暫時還不太清楚是否有效,過一陣子小弟會在這裡再更新。


reference:
[1] Troubleshooting ASYNC_NETWORK_IO, NETWORKIO
https://blogs.msdn.microsoft.com/joesack/2009/01/08/troubleshooting-asy…