ASP.NET MVC पाठ 9. विन्यास और फ़ाइल अपलोड

पाठ का उद्देश्य। Web.config कॉन्फ़िगरेशन फ़ाइल का उपयोग करना सीखें। अनुप्रयोग अनुभाग, अपना स्वयं का कॉन्फिगरेशन और IConfig बना रहा है। फ़ाइलें अपलोड करना सीखें, फ़ाइल डाउनलोड करने के लिए फ़ाइल-अपलोडर का उपयोग करें और फिर फ़ाइल को संसाधित करें।

इस ट्यूटोरियल में, हम Web.config कॉन्फ़िगरेशन फ़ाइल के साथ काम करेंगे। यह एक xml फ़ाइल है और यह प्रोग्राम सेटिंग्स को स्टोर करता है।

आइए अधिक विस्तार से विचार करें कि इस फ़ाइल में क्या है:

• विन्यास । यह खंड जिम्मेदार है जिसके लिए कक्षाएं आगे घोषित वर्गों की प्रक्रिया करेंगी। विशेषता नाम से मिलकर बनता है - यह एक टैग है, फिर घोषित अनुभाग और प्रकार - यह किस वर्ग से संबंधित है।
• कनेक्शन यह अनुभाग डेटाबेस कनेक्शन को इनिशियलाइज़ करने के लिए स्ट्रिंग्स के साथ काम करने के लिए जिम्मेदार है।
• appSettings । प्रकार कुंजी / मान के मापदंडों का खंड।
• system.web, system.webServer । वेब अनुप्रयोग के लिए पैरामीटर अनुभाग।
• क्रम। रनटाइम ट्यूनिंग अनुभाग। डीएल के बीच निर्भरता को परिभाषित करना।
• शेष खंड। ConfigSection में घोषित मापदंडों के साथ अन्य अनुभाग।

IConfig (और कार्यान्वयन)।

रिपोजिटरी की तरह, हम एक सेवा के रूप में एक विन्यासकर्ता बनाएंगे। वैश्विक फ़ोल्डर में IConfig और config कार्यान्वयन बनाएँ (/Global/Config/IConfig.cs):

public interface IConfig { string Lang { get; } } 

और

 public class Config : IConfig { public string Lang { get { return "ru"; } } } 

RegisterServices (/App_Start/NinjectWebCommon.cs) पर एक पंक्ति जोड़ें:

  kernel.Bind<IConfig>().To<Config>().InSingletonScope(); 

और बेसकंट्रोलर को आउटपुट:

 [Inject] public IConfig Config { get; set; } 

अब, कंट्रोलर इनिशियलाइज़ेशन में, हम CultureInfo को स्ट्रीम में पुन: असाइन करेंगे (/Controllers/BaseController.cs):

 protected override void Initialize(System.Web.Routing.RequestContext requestContext) { try { var cultureInfo = new CultureInfo(Config.Lang); Thread.CurrentThread.CurrentCulture = cultureInfo; Thread.CurrentThread.CurrentUICulture = cultureInfo; } catch (Exception ex) { logger.Error("Culture not found", ex); } base.Initialize(requestContext); } 

और Index.cshtml (/Areas/Default/Views/Home/Index.cshtml) में दिनांक आउटपुट जोड़ें:

  @DateTime.Now.ToString("D") 

हम निष्कर्ष निकालते हैं:


और सही मायने में इसे Web.Config से जोड़ते हैं। AppSettings में Web.config में लाइन जोड़ें:

 <add key="Culture" value="ru" /> 

Config.cs (/Global/Config/Config.cs) में:

 public string Lang { get { return ConfigurationManager.AppSettings["Culture"] as string; } } 

हम शुरू करते हैं - परिणाम समान है, अब वेब में मान को बदलें। fr में fr:

 <add key="Culture" value="fr" /> 

हमें तारीख मिलती है:

 mardi 5 mars 2013 

बहुत बढ़िया! आप कई और भाषाओं के साथ कोशिश कर सकते हैं। संक्षिप्त सूची यहां http://msdn.microsoft.com/en-us/goglobal/bb896001.aspx

अपने स्वयं के विन्यास प्रकार बनाना

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

• विस्तार
• माइम-प्रकार
• बड़े आइकन
• छोटा आइकन

और दूसरी बात, पूर्वावलोकन बनाने के लिए डेटा:

• पूर्वावलोकन शीर्षक (उदा। उपयोगकर्ता अवतार)
• चौड़ाई
• ऊंचाई

दोनों प्रकार एक ही तरीके से किए जाते हैं, इसलिए मैं केवल उनमें से एक के निर्माण को लिखूंगा। पूर्वावलोकन बनाने के लिए इसे आइकॉनसाइज़ होने दें। पहली बात यह है कि विन्यास के आधार पर विरासत में मिला वर्ग बनाने के लिए (/Global/Config/IconSize.cs):

 public class IconSize : ConfigurationElement { [ConfigurationProperty("name", IsRequired = true, IsKey = true)] public string Name { get { return this["name"] as string; } } [ConfigurationProperty("width", IsRequired = false, DefaultValue = "48")] public int Width { get { return (int)this["width"]; } } [ConfigurationProperty("height", IsRequired = false, DefaultValue = "48")] public int Height { get { return (int)this["height"]; } } } 

आइए अधिक विस्तार से विचार करें:

• कॉन्फ़िगरेशनप्रॉपर्टी में नाम शामिल हैं, यह स्ट्रिंग में विशेषता नाम है
• अनिवार्य - अनिवार्य या नहीं
• IsKey - कुंजी है (डेटाबेस में प्राथमिक कुंजी के रूप में)
• DefaultValue - डिफ़ॉल्ट मान

अगला कदम एक संग्रह वर्ग बनाना है (क्योंकि हमारे पास कई तत्व होंगे) और एक खंड (/Global/Config/IconSize.cs):

  public class IconSizesConfigSection : ConfigurationSection { [ConfigurationProperty("iconSizes")] public IconSizesCollection IconSizes { get { return this["iconSizes"] as IconSizesCollection; } } } public class IconSizesCollection : ConfigurationElementCollection { protected override ConfigurationElement CreateNewElement() { return new IconSize(); } protected override object GetElementKey(ConfigurationElement element) { return ((IconSize)element).Name; } } 

Web.config में, जोड़ें:

 <iconConfig> <iconSizes> <add name="Avatar173Size" width="173" height="176" /> … </iconSizes> </iconConfig> 

अब आपको configSection में इस अनुभाग के लिए एक पार्सिंग वर्ग घोषित करने की आवश्यकता है:

  <section name="iconConfig" type="LessonProject.Global.Config.IconSizesConfigSection, LessonProject" /> 

ध्यान दें कि टाइप विवरण में आपको dll ( LessonProject ) का नाम निर्दिष्ट करना होगा जिसमें यह निहित है। यह महत्वपूर्ण है, लेकिन इकाई परीक्षणों में शामिल किया जाएगा।

MailSettings

चलिए smtp-mail के साथ काम करने के लिए सेटिंग्स के लिए एक सिंगल कॉन्फिगर बनाते हैं। हमें आवश्यकता होगी:

• SmtpServer। सर्वर का नाम
• SmtpPort। पोर्ट, आमतौर पर 25 वें।
• SmtpUserName। लॉग इन।
• SmtpPassword। पासवर्ड।
• SmtpReply। उत्तर-पंक्ति में वापसी पता।
• SmtpUser। से उपयोगकर्ता नाम लाइन में है।
• EnableSsl। हाँ / नहीं, Ssl पर काम का उपयोग करना है या नहीं।

फ़ाइल (/Global/Config/MailSetting.cs):

 public class MailSetting : ConfigurationSection { [ConfigurationProperty("SmtpServer", IsRequired = true)] public string SmtpServer { get { return this["SmtpServer"] as string; } set { this["SmtpServer"] = value; } } [ConfigurationProperty("SmtpPort", IsRequired = false, DefaultValue="25")] public int SmtpPort { get { return (int)this["SmtpPort"]; } set { this["SmtpPort"] = value; } } [ConfigurationProperty("SmtpUserName", IsRequired = true)] public string SmtpUserName { get { return this["SmtpUserName"] as string; } set { this["SmtpUserName"] = value; } } [ConfigurationProperty("SmtpPassword", IsRequired = true)] public string SmtpPassword { get { return this["SmtpPassword"] as string; } set { this["SmtpPassword"] = value; } } [ConfigurationProperty("SmtpReply", IsRequired = true)] public string SmtpReply { get { return this["SmtpReply"] as string; } set { this["SmtpReply"] = value; } } [ConfigurationProperty("SmtpUser", IsRequired = true)] public string SmtpUser { get { return this["SmtpUser"] as string; } set { this["SmtpUser"] = value; } } [ConfigurationProperty("EnableSsl", IsRequired = false, DefaultValue="false")] public bool EnableSsl { get { return (bool)this["EnableSsl"]; } set { this["EnableSsl"] = value; } } } 

Web.config में जोड़ें:

  <section name="mailConfig" type="LessonProject.Global.Config.MailSetting, LessonProject" /> 

और

  <mailConfig SmtpServer="smtp.gmail.com" SmtpPort="587" SmtpUserName="lxndrpetrov" SmtpPassword="**********" SmtpReply="lxndrpetrov@gmail.com" SmtpUser="test" EnableSsl="true" /> 

यह सब अब IConfig.cs और config.cs में जोड़ें (/Global/Config/IConfig) .cs:

 public interface IConfig { string Lang { get; } IQueryable<IconSize> IconSizes { get; } IQueryable<MimeType> MimeTypes { get; } MailSetting MailSetting { get; } } 

और

 public IQueryable<IconSize> IconSizes { get { IconSizesConfigSection configInfo = (IconSizesConfigSection)ConfigurationManager.GetSection("iconConfig"); return configInfo.IconSizes.OfType<IconSize>().AsQueryable<IconSize>(); } } public IQueryable<MimeType> MimeTypes { get { MimeTypesConfigSection configInfo = (MimeTypesConfigSection)ConfigurationManager.GetSection("mimeConfig"); return configInfo.MimeTypes.OfType<MimeType>().AsQueryable<MimeType>(); } } public MailSetting MailSetting { get { return (MailSetting)ConfigurationManager.GetSection("mailConfig"); } } 

हम MailTemplates - टेम्पलेट्स भी जोड़ेंगे जिन्हें हमें पंजीकरण करते समय, या पासवर्ड याद दिलाते समय ईमेल भेजने की आवश्यकता होगी।

आसान फ़ाइल अपलोड

अब एक फ़ाइल को सर्वर पर अपलोड करने के एक मानक उदाहरण को देखते हैं, और हम इस पद्धति का उपयोग फिर कभी नहीं करेंगे। बातचीत के लिए SimpleFileView वर्ग (/Models/Info/SimpleFileView.cs):

 public class SimpleFileView { public HttpPostedFileBase UploadedFile { get; set; } } 

फ़ाइलें प्राप्त करने के लिए वर्ग के नाम पर ध्यान दें। तो, SimpleFileController नियंत्रक (/Areas/Default/Controllers/SimpleFileController.cs) बनाएं:

 public class SimpleFileController : DefaultController { [HttpGet] public ActionResult Index() { return View(new SimpleFileView()); } [HttpPost] public ActionResult Index(SimpleFileView simpleFileView) { return View(simpleFileView); } } 

और देखें:

 @model LessonProject.Models.Info.SimpleFileView @{ ViewBag.Title = "Index"; Layout = "~/Areas/Default/Views/Shared/_Layout.cshtml"; } <h2>Index</h2> @using (Html.BeginForm("Index", "SimpleFile", FormMethod.Post, new {enctype = "multipart/form-data", @class = "form-horizontal" })) { <fieldset> <div class="control-group"> <label class="control-label" for="Email">  :</label> <div class="controls"> @Html.TextBox("UploadedFile", Model.UploadedFile, new { type = "file", @class = "input-xlarge" }) @Html.ValidationMessage("UploadedFile") </div> </div> <div class="form-actions"> <button type="submit" class="btn btn-primary"> Upload</button> </div> </fieldset> } 

प्रपत्र विशेषताएँ और पाठ बॉक्स विशेषताओं में प्रकार में वास्तव में नोट करें (वास्तव में, प्रकार अभी भी पासवर्ड, चेकबॉक्स, रेडियो है, लेकिन @ Html वर्ग में उनके लिए इसी तरीके हैं)। बड़ी मात्रा में सूचनाओं को लोड करने में सक्षम होने के लिए Enctype को "मल्टीपार्ट / फॉर्म-डेटा" पर सेट किया जाना चाहिए।

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

पहला दोष यह है कि सभी ब्राउज़रों में फ़ाइल चयन फ़ॉर्म अलग दिखता है:



बेशक, डिजाइनर कल्पना करता है कि फाइलें सफारी में डाउनलोड की जाती हैं, और ग्राहक क्रोम और आईई में जांच करता है, और डेवलपर्स से पूछना शुरू करता है: "किस तरह की पहल?"
दूसरा दोष यह है कि यदि फॉर्म ने सत्यापन नहीं किया है, तो इन क्षेत्रों को फिर से चुनना होगा। यानी एक ऐसा रूप है:

• पहला नाम
• उपनाम
• ई-मेल
• जन्म की तारीख
• फ़ोटो
• पासपोर्ट के पहले प्रसार की तस्वीर
• पासपोर्ट के दूसरे प्रसार की तस्वीर
• पंजीकरण के साथ पासपोर्ट फोटो
• पासवर्ड
• फिर से पासवर्ड
• कैप्चा

और अचानक आपने पासवर्ड गलत लिख दिया, या आपने गलत तरीके से कैप्चा दर्ज किया, या आपके पासपोर्ट की दूसरी बारी की फोटो बहुत बड़ी है, या आप कच्चे-प्रारूप से जेपीईजी से आगे निकलना भूल गए।

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

Ajax का उपयोग करके फ़ाइल अपलोड करें

निर्धारित करें कि फ़ाइल अपलोड को कैसे व्यवहार करना चाहिए:

• उपयोगकर्ता "डाउनलोड" पर क्लिक करता है।
• फ़ाइल चयन फ़ॉर्म खुल जाता है
• उपयोगकर्ता फ़ाइल का चयन करता है
• फ़ाइल लोड हो रही है, या यह कहते हुए एक त्रुटि जारी की जाती है कि कुछ गलत है
• यहां तक ​​कि अगर फॉर्म सत्यापन पास नहीं करता है, तो फ़ाइल लोड रहती है और उसे फिर से डाउनलोड करने की आवश्यकता नहीं है।

इसे अजाक्स लोडिंग कहा जाता है और हम इसके लिए ( http://fineuploader.com/ ) फाइनपलोडर का उपयोग करते हैं। पुस्तकालय का भुगतान किया जाता है, लेकिन हम स्रोतों को डाउनलोड करते हैं और इकट्ठा करते हैं (हमारे पास बंडल है!)। लिंक पर दिए गए स्रोतों को डाउनलोड करें: https://github.com/valums/file-uploader । Js फ़ाइलों को / Scripts / महीन-अपलोडर फ़ोल्डर में ले जाएँ। हम css फ़ाइलों को / सामग्री और छवियों / सामग्री / छवियों को स्थानांतरित करते हैं। हम छवियों के लिए ठीक से url को ठीक से पुनः लिखते हैं।

 .qq-upload-spinner { display: inline-block; background: url("images/loading.gif"); width: 15px; height: 15px; vertical-align: text-bottom; } .qq-drop-processing { display: none; } .qq-drop-processing-spinner { display: inline-block; background: url("images/processing.gif"); width: 24px; height: 24px; vertical-align: text-bottom; } 

हम बंडलकॉन्फ़िग.क्स (/App_Start/BundleConfig.cs) में फ़ाइलों को आरंभ करते हैं:

 bundles.Add(new ScriptBundle("~/bundles/fineuploader") .Include("~/Scripts/fine-uploader/header.js") .Include("~/Scripts/fine-uploader/util.js") .Include("~/Scripts/fine-uploader/button.js") .Include("~/Scripts/fine-uploader/ajax.requester.js") .Include("~/Scripts/fine-uploader/deletefile.ajax.requester.js") .Include("~/Scripts/fine-uploader/handler.base.js") .Include("~/Scripts/fine-uploader/window.receive.message.js") .Include("~/Scripts/fine-uploader/handler.form.js") .Include("~/Scripts/fine-uploader/handler.xhr.js") .Include("~/Scripts/fine-uploader/uploader.basic.js") .Include("~/Scripts/fine-uploader/dnd.js") .Include("~/Scripts/fine-uploader/uploader.js") .Include("~/Scripts/fine-uploader/jquery-plugin.js") ); bundles.Add(new StyleBundle("~/Content/css/fineuploader") .Include("~/Content/fineuploader.css")); 

कंट्रोलर बनाएँ FileController.cs (/Areas/Default/Controllers/FileController.cs):

 public class FileController : DefaultController { [HttpGet] public ActionResult Index() { return View(); } public ActionResult Upload(HttpPostedFileWrapper qqfile) { return Json(new { result = "ok", success = true}); } } 

क्रिया-अपलोड विधि qqfile स्ट्रिंग मान को स्वीकार करती है, मैं नीचे चर्चा करूंगा कि क्यों। अब इंडेक्स के लिए एक दृश्य बनाएं। ऐसा करने के लिए:

• एक बटन बनाएँ, जब क्लिक किया जाता है, तो हम फ़ाइल डाउनलोड करते हैं।
• फ़ाइल अपलोड की गई है और पूर्वावलोकन बनाया गया है।
• फ़ाइल और पूर्वावलोकन फ़ाइल सिस्टम में सहेजा गया
• विधि उस लिंक को वापस करती है जहां फ़ाइल और पूर्वावलोकन को Json प्रतिक्रिया के माध्यम से अपलोड किया गया था
• यदि फ़ाइलें डाउनलोड नहीं की जा सकीं, तो एक उपयुक्त त्रुटि जारी की जाती है
• हम json परिणाम को संसाधित करते हैं और सूचित करते हैं कि फ़ाइल और पूर्वावलोकन लोड किए गए हैं
• डेटाबेस के लिए फॉर्म सत्यापन और लेखन की आवश्यकता नहीं है।

सूचकांक के लिए देखें:

 @{ ViewBag.Title = "Index"; Layout = "~/Areas/Default/Views/Shared/_Layout.cshtml"; } @section styles { @Styles.Render("~/Content/css/fineuploader") } @section scripts { @Scripts.Render("~/bundles/fineuploader") @Scripts.Render("~/Scripts/default/file-index.js") } <h2>Index</h2> <fieldset> <div class="control-group"> <label class="control-label" for="Text"> Image </label> <div class="controls"> <div id="UploadImage"> Upload </div> </div> </div> <div> <img src="" alt="" id="ImagePreview" /> </div> </fieldset> 

आईडी = UploadImage के साथ हमारा बटन। प्रसंस्करण के लिए फ़ाइल- index.js फ़ाइल जोड़ें (/ स्क्रिप्ट्स / ओवरफ़ॉल्ट / फ़िले-index.js):

 function FileIndex() { _this = this; this.ajaxFileUpload = "/File/Upload"; this.init = function () { $('#UploadImage').fineUploader({ request: { endpoint: _this.ajaxFileUpload }, }).on('error', function (event, id, name, reason) { //do something }) .on('complete', function (event, id, name, responseJSON) { alert(responseJSON); }); } } var fileIndex = null; $().ready(function () { fileIndex = new FileIndex(); fileIndex.init(); }); 

अब डाउनलोड की प्रक्रिया करें:

 public ActionResult Upload(HttpPostedFileWrapper qqfile) { var extension = Path.GetExtension(qqfile.FileName); if (!string.IsNullOrWhiteSpace(extension)) { var mimeType = Config.MimeTypes.FirstOrDefault(p => string.Compare(p.Extension, extension, 0) == 0); //  if (mimeType.Name.Contains("image")) { //    var filePath = Path.Combine("/Content/files", qqfile.FileName); qqfile.SaveAs(Server.MapPath(filePath)); return Json(new { success = true, result = "error", data = new { filePath } }); } } return Json(new { error = "  ", success = false }); } 

फ़ाइलें फ़ोल्डर को सामग्री में जोड़ें - यह उपयोगकर्ता डेटा फ़ोल्डर होगा। आइए कोड का विश्लेषण करें:

• हम qqfile प्राप्त करते हैं (यहां कुछ भी नहीं बदलते हैं, यह पैरामीटर फाइनूप लोडर के कारण है)।
• उससे हमें विस्तार मिलता है।
• विस्तार से हम mimeType पाते हैं। .Jpg, .gif, .png के लिए - हमें "छवि / ..." प्रकार का माइम मिलता है। इस प्रकार, हम सत्यापित करते हैं कि यह फ़ाइल डाउनलोड की जा सकती है।
• अगला, फ़ाइल नाम का उपयोग करते हुए, हम Server.MinPath का उपयोग करके / Content / files फ़ोल्डर (जो हमने पहले बनाया था) के लिए पूर्ण पथ की रचना करते हैं।
• अगला, SaveAs का उपयोग करके फ़ाइल को सहेजें।
• Json data.filePath में फ़ाइल नाम लौटाएं।

हम जांचते हैं कि क्या सब कुछ लोड हो रहा है, और पूर्वावलोकन बनाने के लिए आगे बढ़ें।

निर्माण का पूर्वावलोकन करें

सबसे पहले, हमने माइम-टाइप = "इमेज \ ..." के साथ थोड़ा धोखा दिया, क्योंकि इनमें bmp और tiff फाइलें शामिल हैं जो ब्राउज़र द्वारा समर्थित नहीं हैं।
तो चलिए LessonProject.Tools (PreviewCreator.cs) प्रोजेक्ट में प्रीव्यू क्रिएटर क्लास बनाएं:

  public static class PreviewCreator { public static bool SupportMimeType(string mimeType) { switch (mimeType) { case "image/jpg": case "image/jpeg": case "image/png": case "image/gif": return true; } return false; } } 

और FileController.cs (/Areas/Default/Controller/FileController.cs) में बदलें:

 if (mimeType != null && PreviewCreator.SupportMimeType(mimeType.Name)) 

प्रीव्यू क्रिएटर में पूर्वावलोकन बनाने के लिए कई कार्य हैं, इसलिए मैं एक छवि बनाने के लिए विभिन्न विकल्पों की सूची बनाऊंगा और उनमें से किसी एक का विस्तार से विश्लेषण करूंगा। यह विचार करने योग्य है कि सभी पूर्वावलोकन जेपीईजी प्रारूप में बनाए गए हैं। तो क्या विकल्प हैं:

• रंग और काले और सफेद विकल्प। ग्रेस्केल पैरामीटर द्वारा नियंत्रित (डिफ़ॉल्ट = गलत)
• पूर्वावलोकन। ( CreateAndSavePreview ) यदि मूल छवि पूर्वावलोकन आकार से छोटी है, तो छवि को एक सफेद कैनवास के बीच में रखा गया है। यदि आकारों के संबंध में प्रारंभिक आकार में एक ऊर्ध्वाधर अभिविन्यास (पोर्ट्रेट प्रारूप से एक वर्ग) है - ऊपरी भाग को काट दें। यदि अनुपात आकार के संबंध में क्षैतिज रूप से उन्मुख है, तो बीच में काट लें।
• अवतार। ( CreateAndSaveAvatar ) यदि मूल छवि पूर्वावलोकन आकार से छोटी है, तो छवि बस बच जाती है। यदि आकारों के संबंध में प्रारंभिक आकार में एक ऊर्ध्वाधर अभिविन्यास (पोर्ट्रेट प्रारूप से एक वर्ग) है - तो हम इसे ऊंचाई में घटाते हैं। यदि अनुपात आकार के संबंध में क्षैतिज रूप से उन्मुख है, तो बीच में काट लें।
• छवि। ( CreateAndSaveImage ) यदि छवि अधिकतम आकार से छोटी है, तो मूल रखें। यदि छवि सीमाओं में फिट नहीं होती है, तो कम करें ताकि यह अधिकतम आकार से अधिक न हो, और सहेजें।
• आकार से। ( CreateAndSaveFitToSize ) यदि छवि आकार से छोटी है, तो इसे आवश्यक आकार तक बढ़ाया जाएगा। गुणवत्ता की कमी के साथ, निश्चित रूप से।
• काट-छांट करें। ( CropAndSaveImage ) मानक मापदंडों के अलावा, छवि को क्रॉप करने के लिए निर्देशांक प्रेषित होते हैं।

आइए एक पूर्वावलोकन बनाएं ( CreateAndSavePreview ), अवतार से पूर्वावलोकन बनाने के लिए कॉन्फ़िगरेशन से आयाम ले रहे हैं (/Areas/Default/Controllers/FileController.cs):

 var filePreviewPath = Path.Combine("/Content/files/previews", qqfile.FileName); var previewIconSize = Config.IconSizes.FirstOrDefault(c => c.Name == "AvatarSize"); if (previewIconSize != null) { PreviewCreator.CreateAndSavePreview(qqfile.InputStream, new Size(previewIconSize.Width, previewIconSize.Height), Server.MapPath(filePreviewPath)); } return Json(new { success = true, result = "error", data = new { filePath, filePreviewPath } }); 

हम शुरू करते हैं। लोड हो रहा है। फ़ाइलें लोड होनी चाहिए और एक पूर्वावलोकन बनाया जाता है।
अब हम फाइल-इंडेक्स.जेएस (/ स्क्रिप्ट्स / डिफॉल्ट / एफिल- इंडेक्स.एक्स) में प्रोसेसिंग करेंगे:

 $('#UploadImage').fineUploader({ request: { endpoint: _this.ajaxFileUpload }, }) .on('error', function (event, id, name, reason) { //do something }) .on('complete', function (event, id, name, responseJSON) { $("#ImagePreview").attr("src", responseJSON.data.filePreviewPath); }); 

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

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

लिंक द्वारा फ़ाइलें पुनर्प्राप्त कर रहा है

एक और फ़ाइल अपलोड विधि है। फ़ाइल इंटरनेट पर स्वतंत्र रूप से लटकी हुई है, और हम इसे पथ को इंगित करते हैं (उदाहरण के लिए, जब फेसबुक में लॉग इन करते हैं), और हम पहले से ही लिंक का उपयोग करके इस फ़ाइल को सहेजते हैं।
यह इस प्रकार किया जाता है:

 var webClient = new WebClient(); var bytes = webClient.DownloadData(url); var ms = new MemoryStream(bytes); 

जहाँ url फ़ाइल का पथ है। यह HttpWebRequest का उपयोग करके अधिक जटिल हो सकता है:

 public ActionResult Export(string uri) { HttpWebRequest webRequest = (HttpWebRequest)WebRequest.Create(uri); webRequest.Method = "GET"; webRequest.KeepAlive = false; webRequest.PreAuthenticate = false; webRequest.Timeout = 1000; var response = webRequest.GetResponse(); var stream = response.GetResponseStream(); var previewIconSize = Config.IconSizes.FirstOrDefault(c => c.Name == "AvatarSize"); var filePreviewPath = Path.Combine("/Content/files/previews", Guid.NewGuid().ToString("N") + ".jpg"); if (previewIconSize != null) { PreviewCreator.CreateAndSavePreview(stream, new Size(previewIconSize.Width, previewIconSize.Height), Server.MapPath(filePreviewPath)); } return Content("OK"); } 

यहाँ फ़ाइल के निर्माण के माध्यम से तय किया गया है। हम जाँच करते हैं:

 http://localhost/File/Export?uri=https://st.free-lance.ru/users/chernikov/upload/sm_f_81850beffd0d0c89.jpg 

फ़ाइल अपलोड और संसाधित की गई थी। सब कुछ सुपर है!

मेरा सुझाव है कि प्रीव्यूक्रीट डिबगर के माध्यम से यह समझने की कोशिश करें कि वहां सब कुछ कैसे काम करता है।

सभी स्रोत https://bitbucket.org/chernikov/lessons पर स्थित हैं