ASP.NET + jQueryアップロード画像オリジナルサイズ+トリミングサイズ

Question

私はmvcアプリケーションを持っており、写真のアップロード機能を追加したいと思います。この要件は、元のサイズを保存することと、サムネイルを使用するために四角いサイズに切り取ることです。

uiでjqueryを使用してクロップされたイメージを作成し、元のサイズとクロップされたイメージを同時にアップロードできますか？私はこの効果を達成するためにどこから始めるべきですか？

編集：私は長い間、これを行っている

Answer 1

（元のサイズを使用して、写真をクリックすると表示されます）元の写真が保存されているところFacebookはそのプロフィール画像トリミングんが、プロフィール画像が正方形である方法を知りたいです時間は前にVB.NETで、私は冗長なコードを削除し、ここでどのようにそれは次のようになります。

HTML部分：

<form action="AddToDatabase" method="post" enctype="multipart/form-data"> 
<input type="id" name="pictureId"/> <br/> 
<input type="file" name="picture" accept="image/gif, image/jpeg" required/> <br/> 
<input type="submit" value="Upload" /> 
</form> 

この閲覧画像を取り込み、コントローラ内部でAddToDatabase関数に渡す

コントローラー：コントローラーはpictureIdを取り、画像自体をしてDbWorksサービスクラスに渡し

Public Class HomeController 
Public Function AddToDatabase(ByVal pictureId as Long, ByVal picture As HttpPostedFileBase) 
Dim manager As New DbWorks 
Dim result = manager.SaveAndResize(pictureId, picture) 
Return Content(result) 
End Class 

、すべての作業

を行います

DbWorksクラス：

Public Class DbWorks 
    Public Function SaveAndResize(ByVal picturetId As Long, ByVal picture As HttpPostedFileBase) As String 
    Dim picSource As Image = Image.FromStream(picture.InputStream) 
    Dim bmSource As New Bitmap(picSource) 
    Dim bmDest As New Bitmap(300, 300) //Saves in 300x300 resolution 
    Dim grDest As Graphics = Graphics.FromImage(bmDest) 
    grDest.DrawImage(bmSource, 0, 0, bmDest.Width, bmDest.Height) 
    Dim picDest As Image = bmDest 
    picDest.Save(HttpContext.Current.Server.MapPath("~/Pictures/" + CStr(pictureId) + ".jpeg")) 
    Dim path = ("~/Pictures/" + CStr(pictureId) + ".jpeg") 
    Return path 
    End Function 
    End Class 

SaveAndResize関数は、idを使用してイメージを取得し、ビットマップに変換し、pictureIdに関連付けられたシステムでファイルへのパスを作成する300x300の解像度で保存します。

Image.Drawingライブラリを追加して画像を管理することを忘れないでください。

P.S.私はあなたがC＃であなたの仕事をしているとはかなり確信していますが、それを変えるのに多くの時間がかかりません。また、この場合、jqueryライブラリの使用を避けることができます。