2014-06-06 6 views
0

지난 2 주 동안 내 머리를 긁어 내고 이것을 알아 내려고 노력했습니다.summernote 이미지를 s3 (asp.net)에 업로드

Summernote (https://github.com/HackerWins/summernote)는 필자가 선호하는 편집기이지만 데이터베이스에 비해 너무 커질 수 있으므로 base64로 저장되는 대신 이미지를 S3에 업로드해야합니다. summernote github 페이지에서 this (https://github.com/HackerWins/summernote/issues/72), 그러나 .net 코드 샘플이 없습니다.

내 ASP 웹 사이트에서 S3로 파일을 업로드해도 괜찮습니까? 제 문제는 내 webmethod에 파일을 어떻게 보내야합니까? 예, summernote 코드가 js로 처리되므로 webmethod를 사용하고 있습니다. asp가 그것을 이해할 수있는 방법?

'파일'을 보내고 서버 측에서 개체로 수신하려고했지만 "개체 파일"문자열 만 수신됩니다.

저는 VB에서 코딩하고 있지만 C# 코드도 이해할 수 있습니다!

미리 감사드립니다.

답변

2

나는이 VB 코드가 당신에게 도움이되기를 바랍니다.

우선 amazon-s3을 사용하지 않았습니다. 구체적인 예는 제공하지 않지만 빠른 검색은 사용자가 실제로 이미지를 업로드하는 방법을 알려주는 다른 스레드를 찾았습니다 메모리 스트림을 사용하여 아마존으로 here.

옵션이 여기에 MVC를 사용하여 C#에서 니펫하는 업로드 작업 서버 측을 작성하는 것입니다 :이 작업의 결과는 콘텐츠 형식과 실제 이미지를 포함하는 HttpPostedFileBase 이미지를 받게됩니다

[HttpPost] 
    public ActionResult UploadImage(HttpPostedFileBase file) 
    { 
     // TODO: your validation goes here, 
     // eg: file != null && file.ContentType.StartsWith("image/") etc... 

     var imageUrl = _myAmazonWrapper.UploadImage(file.InputStream); 

     return Json(imageUrl); 
    } 

는, 파일 이름 등 .

남은 마지막은 summernote 스크립트의 실제 초기화입니다 :

$('#summernote').summernote({ 
     onImageUpload: uploadImages 
    }); 

어디 기능 uploadImages coul 다음과 같이 정의 할 수 D : 예를 들어, uploadImage 기능은 여러 이미지를 지원하지 않는 것을

var uploadImages = function (files, editor, $editable) { 

    var formData = new FormData(); 
    formData.append("file", files[0]); 

    $.ajax({ 
     url: "Image/UploadImage", 
     data: formData, 
     type: 'POST', 
     cache: false, 
     contentType: false, 
     processData: false, 
     success: function (imageUrl) { 

      if (!imageUrl) { 

       // handle error 

       return; 
      } 

      editor.insertImage($editable, imageUrl); 
     }, 
     error: function() { 

      // handle error 
     } 
    }); 
}; 

참고는 summernote 위젯에 이미지 앤 드롭 드래그 앤 특정 경우에 "파일"매개 변수가 포함됩니다 여러 개의 이미지가 있으므로 열거하고 업로드하십시오.

행운을 빈다.