एएसपी.नेट एमवीसी के साथ काम करने के लिए मैं jQuery की अपलोडिफ़ाई प्लगइन कैसे प्राप्त करूं?

Question

मैं एएसपी.नेट एमवीसी के साथ काम करने के लिए, jQuery प्लगइन, Uploadify प्राप्त करने की कोशिश करने की प्रक्रिया में हूं।

मैं ठीक दिख रहा निम्नलिखित जावास्क्रिप्ट के साथ प्लगइन मिल गया है स्निपेट:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#fileUpload').fileUpload({ 
      'uploader': '/Content/Flash/uploader.swf', 
      'script': '/Placement/Upload', 
      'folder': '/uploads', 
      'multi': 'true', 
      'buttonText': 'Browse', 
      'displayData': 'speed', 
      'simUploadLimit': 2, 
      'cancelImg': '/Content/Images/cancel.png' 
     }); 
    }); 
</script> 

कौन सा सब की तरह लगता है अच्छा में अच्छी तरह से है। यदि आप देखते हैं, "स्क्रिप्ट" विशेषता मेरे/प्लेसमेंट/अपलोड पर सेट है, जो मेरा प्लेसमेंट कंट्रोलर और मेरी अपलोड एक्शन है।

मुख्य समस्या यह है कि, मुझे फ़ाइल प्राप्त करने के लिए इस क्रिया को आग लगने में कठिनाई हो रही है। मैंने उस क्रिया पर ब्रेकपॉइंट सेट किया है और जब मैं अपलोड करने के लिए एक फ़ाइल का चयन करता हूं, तो इसे निष्पादित नहीं किया जा रहा है।

मैं विधि this article बंद आधारित हस्ताक्षर को बदलने की कोशिश की है:

public string Upload(HttpPostedFileBase FileData) 
{ 
    /* 
    * 
    * Do something with the FileData 
    * 
    */ 
    return "Upload OK!"; 
} 

लेकिन यह अभी भी आग नहीं करता है।

क्या कोई मुझे अपलोड कंट्रोलर एक्शन के हस्ताक्षर को सही तरीके से लिखने और प्राप्त करने में मदद कर सकता है, तो यह वास्तव में आग लग जाएगा? मैं फिर फ़ाइल डेटा से निपटने को संभाल सकता हूं। मुझे बस कार्रवाई की कार्रवाई करने में कुछ मदद की ज़रूरत है।

Answer 1

public string Upload(HttpPostedFileBase FileData) {} 

सही है - uploadify द्वारा अपलोड की गई फ़ाइल FileData से आबद्ध हो जाएगी। फ़ाइल को पुनर्प्राप्त करने के लिए Request.Files में प्रवेश करने की आवश्यकता नहीं है - जो इसे नकली और परीक्षण करना कठिन बनाता है।

अपनी कार्रवाई को शुरू नहीं किया जाता है (अर्थात डिबगिंग कोशिश करते हैं और अगर विधि के भीतर एक ब्रेकपाइंट मारा जाता है देखें), तो आपकी समस्या का सबसे अधिक संभावना 'स्क्रिप्ट' मूल्य है - आप एक आभासी निर्देशिका के अंतर्गत चल रहे हैं? यदि ऐसा है तो आपको निर्देशिका का नाम सामने रखना होगा। अपलोडिफ़ाई एक पूर्ण पथ का उपयोग कर रहा है।

उदाहरण के लिए 'स्क्रिप्ट:'/virtual_directory/प्लेसमेंट/अपलोड '

अभी uploadify http://localhost/Placement/Upload को भेज रहा है।

यह भी जांचने के लिए कि आपका मार्ग कहां से मैप किया जा रहा है, मार्ग डीबगर (http://haacked.com/archive/2008/03/13/url-routing-debugger.aspx) का उपयोग करने का प्रयास करें।

Answer 2

ऐसा नहीं है कि मुझे फ़ाइल अपलोड को कैसे कार्यान्वित करना था। मेरे पास कोई पैरामीटर नहीं था जिसमें पोस्ट पैरामीटर के संग्रह में गोता लगाने के लिए वर्तमान अनुरोध ऑब्जेक्ट का उपयोग नहीं किया गया था।

मेरी कार्यान्वयन से

कुछ नमूना कोड:

[AcceptVerbs(HttpVerbs.Post)] 
public ContentResult Upload() { 
    if (Request.Files.Count > 0 && Request.Files[0].ContentLength > 0) { 
     HttpPostedFileBase postedFile = Request.Files[0]; 
     // Do something with it 
    } 
} 

बेशक

, परीक्षण के लिए इस एक PITA हो जाता है लेखन। आपको उदाहरण के लिए, यह काम करने के लिए प्राप्त करने के लिए कई वस्तुओं नकली करने के लिए है:

var mockHttpContext = mocks.StrictMock<HttpContextBase>(); 
var mockRequest = mocks.StrictMock<HttpRequestBase>(); 
var postedFile = mocks.StrictMock<HttpPostedFileBase>(); 

var postedFileKeyCollection = mocks.StrictMock<HttpFileCollectionBase>(); 

mockHttpContext.Expect(x => x.Request).Return(mockRequest).Repeat.Any(); 
mockRequest.Expect(x => x.Files).Return(postedFileKeyCollection).Repeat.Any(); 

postedFileKeyCollection.Expect(x => x[0]).Return(postedFile).Repeat.Any(); 
postedFileKeyCollection.Expect(x => x.Count).Return(1); 

postedFile.Expect(f => f.ContentLength).Return(1024); 
postedFile.Expect(f => f.InputStream).Return(null); 

यह पोस्ट फ़ाइलों में एक इंटरफेस बनाने के लिए और केवल नकली है कि, के साथ एक ठोस कार्यान्वयन का उपयोग कर अपने नियंत्रक में इंजेक्शन आसान होगा आईओसी।

मुझे लगता है कि यह काफी हद तक इस पोस्ट के आधार पर किया गया था: Implementing HTTP File Upload with ASP.NET MVC including Tests and Mocks

Answer 3

प्रलेखन पढ़ना, ऐसा लगता है जैसे यह फ़ाइलों की एक सरणी भेज रहा है लग रहा है। आप की कोशिश की है:

public string Upload(HttpPostedFileBase[] fileData) 

यह भी संभव है कि डिफ़ॉल्ट मॉडल बांधने की मशीन HttpPostedFileBase साथ काम नहीं करेंगे और आप या तो रोरी के तंत्र का उपयोग करें या अपना स्वयं का मॉडल बांधने की मशीन लिखने के लिए की आवश्यकता होगी।

Answer 4

समस्या यह हो सकती है कि आपको यह निर्दिष्ट करने की आवश्यकता है कि जिस क्रिया को आप अपलोड कर रहे हैं वह पोस्ट पर सेट है ... यह क्रिया के साथ कार्रवाई के साथ काम नहीं करेगा।

तो, यह:

[AcceptVerbs(HttpVerbs.Post)] 
public ActionResult Upload(HttpPostedFileBase FileData) 
{ 
    //do something 
} 

ही, ध्यान रखें कि यदि आप में अपनी साइट की धारा एक "लॉग इन" यह प्रयोग कर रहे हैं, तो आप ले जाना चाहिए हो:

public string Upload(HttpPostedFileBase FileData) 
{ 
    //do something 
} 

इस होना चाहिए अपलोडिफ़ और प्रमाणीकरण के साथ एक ज्ञात बग के लिए यहां एक नज़र: http://geekswithblogs.net/apopovsky/archive/2009/05/06/working-around-flash-cookie-bug-in-asp.net-mvc.aspx

इसके अलावा, बस एक तरफ, फ़ाइल अपलोड को संभालने के लिए एमवीसी में कई तरीके हैं (Rory Fitzp के अनुसार Request.Files का उपयोग करना एट्रिक के सुझाव, साथ ही साथ HttpPostedFileBase फ़ाइल को एक्शन परिभाषा में एक तर्क के रूप में पास करना)। काम पर अपलोड करने के लिए वास्तव में कोई फर्क नहीं पड़ता।

Answer 5

मेरा पूरा समाधान आपकी समस्या का समाधान कर सकता है। आशा करता हूँ की ये काम करेगा।

http://zootfroot.blogspot.com/2010/12/mvc-file-upload-using-uploadify-with.html

Answer 6

यहाँ मेरी सरल उस्तरा देखें

@{ 
ViewBag.Title = "Upload Email CSV"; 
Layout = "~/Views/Shared/_Layout.cshtml"; 
} 
<script type="text/javascript" src="@Url.Content("~/Scripts/Uploadify/jquery.uploadify.js")"></script> 

<script type="text/javascript"> 

$(function() { 
    var uploadUrl = "@Url.Content("~/UploadFile/UploadEmailCSV/")"; 
    var uploadSWF = "@Url.Content("~/Scripts/Uploadify/uploadify.swf")"; 
    var uploadifyButtonImage = "@Url.Content("~/Scripts/Uploadify/uploadify.swf")"; 

    $('#file_upload').uploadify({ 
     'fileSizeLimit': '0', 
     'buttonImage': '/uploadify/browse-btn.png', 
     'swf': uploadSWF, 
     'uploader': uploadUrl, 
     'onUploadSuccess': function(file, data, response) { 
      alert('The file was saved to: ' + data); 
     } 
    }); 
}); 
</script> 
<h2>Upload a comma separated list of email addresses</h2> 
@using (Html.BeginForm("UploadEmailCSV", "UploadFile", FormMethod.Post, new { @class = "form-horizontal", @enctype = "multipart/form-data", @id = "frmUploadFiles" })) 
{ 
    <input type="file" name="file_upload" id="file_upload" /> 
} 

यहाँ Contoller विधि

public ActionResult UploadEmailCSV() 
    { 
     var uploadedFile = Request.Files["Filedata"]; 

     if (uploadedFile != null && uploadedFile.ContentLength > 0) 
     { 
      var filePath = Path.Combine(Server.MapPath("~/UploadedFiles"), string.Format("{0}_{1}{2}", Path.GetFileNameWithoutExtension(uploadedFile.FileName), DateTime.Now.Ticks, Path.GetExtension(uploadedFile.FileName))); 
      uploadedFile.SaveAs(filePath); 
      return Content(string.Format("{0}_{1}{2}", Path.GetFileNameWithoutExtension(uploadedFile.FileName), DateTime.Now.Ticks, Path.GetExtension(uploadedFile.FileName))); 

     } 
     return Content("Error Uploading file!"); 
    } 

Thats यह है (लेआउट मास्टर जावास्क्रिप्ट बंडलों है) है!