दिलचस्प पोस्ट
पीजी मणि स्थापित करने का प्रयास करते समय 'libpq-fe.h शीर्षलेख नहीं मिला सीएसएस में एक स्टार-पूर्ववर्ती संपत्ति का मतलब क्या है? पंडों में कॉलम का नाम बदलना स्थापना पर एंड्रॉइड सेवा कैसे आरंभ करें एआरसी के साथ आईओएस एप, किसी ऑब्जेक्ट के स्वामी कौन है यह पता लगाएं संयोजन और क्रमांतरण सी ++ में संदर्भ में मान / सी ++ में दर क्यों नहीं: पहले और: छद्म तत्वों के बाद `img` तत्वों के साथ काम करते हैं? यूएसबी ड्राइव सम्मिलन और खिड़कियों सेवा का उपयोग हटाने और सी # का पता लगाने जावास्क्रिप्ट में सेट इन्टरलेबल कॉल बंद करें स्टार ऑपरेटर का क्या मतलब है? पीडीएफ बनाने के दौरान चेक अक्षरों को नहीं मिल सकता है सूची और ArrayList के बीच अंतर क्या है? जावास्क्रिप्ट में वैश्विक चर से कैसे बचें? बूटस्ट्रैप 3 स्विच बॉक्स-साइजिंग करने के लिए क्यों गए: सीमा-बॉक्स?

फ़ाइल अपलोड करने से पहले फ़ाइल एक्सटेंशन की मान्यता

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

मैं क्लाइंट साइड में जावास्क्रिप्ट और jQuery का उपयोग कर रहा हूं।

अद्यतन: मैं आखिरकार सर्वर साइड सत्यापन के साथ समाप्त हो गया था, जो बाइट पढ़ता है और अपलोड को अस्वीकार करता है यदि यह कोई छवि नहीं है।

वेब के समाधान से एकत्रित समाधान "फ़ाइल अपलोड करने से पहले फ़ाइल एक्सटेंशन की मान्यता"

यह केवल फ़ाइल एक्सटेंशन को जांचना संभव है, लेकिन उपयोगकर्ता वायरस.जेपी के लिए वायरस.एक्सए का नाम बदल सकते हैं और सत्यापन "पास" कर सकते हैं।

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

 var _validFileExtensions = [".jpg", ".jpeg", ".bmp", ".gif", ".png"]; function Validate(oForm) { var arrInputs = oForm.getElementsByTagName("input"); for (var i = 0; i < arrInputs.length; i++) { var oInput = arrInputs[i]; if (oInput.type == "file") { var sFileName = oInput.value; if (sFileName.length > 0) { var blnValid = false; for (var j = 0; j < _validFileExtensions.length; j++) { var sCurExtension = _validFileExtensions[j]; if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) { blnValid = true; break; } } if (!blnValid) { alert("Sorry, " + sFileName + " is invalid, allowed extensions are: " + _validFileExtensions.join(", ")); return false; } } } } return true; } 
 <form onsubmit="return Validate(this);"> File: <input type="file" name="my file" /><br /> <input type="submit" value="Submit" /> </form> 

अनुरोध की सादगी के लिए मौजूदा उत्तरों में से कोई भी पर्याप्त रूप से पर्याप्त कॉम्पैक्ट नहीं था। जांचते हुए कि कोई दिए गए फ़ाइल इनपुट फ़ील्ड के पास एक सेट से एक एक्सटेंशन है जिसे निम्नानुसार पूरा किया जा सकता है:

 function hasExtension(inputID, exts) { var fileName = document.getElementById(inputID).value; return (new RegExp('(' + exts.join('|').replace(/\./g, '\\.') + ')$')).test(fileName); } 

इसलिए उदाहरण उपयोग हो सकता है (जहां upload फ़ाइल इनपुट का id है):

 if (!hasExtension('upload', ['.jpg', '.gif', '.png']) { // ... block upload } 

या एक jQuery प्लगइन के रूप में:

 $.fn.hasExtension = function(exts) { return (new RegExp('(' + exts.join('|').replace(/\./g, '\\.') + ')$')).test($(this).val()); } 

उदाहरण उपयोग:

 if (!$('#upload').hasExtension(['.jpg', '.png', '.gif'])) { // ... block upload } 

.replace(/\./g, '\\.') लिए डॉट से बचने के लिए है ताकि बुनियादी अक्षरों को किसी भी वर्ण से मेल खाने वाले डॉट्स के बिना पारित किया जा सके।

इन्हें कम रखने के लिए इन पर कोई त्रुटि जांच नहीं हुई है, संभवतः यदि आप उनका उपयोग करते हैं तो आप यह सुनिश्चित करेंगे कि इनपुट पहले से मौजूद है और एक्सटेंशन एरे वैध है!

 $(function () { $('input[type=file]').change(function () { var val = $(this).val().toLowerCase(), regex = new RegExp("(.*?)\.(docx|doc|pdf|xml|bmp|ppt|xls)$"); if (!(regex.test(val))) { $(this).val(''); alert('Please select correct file format'); } }); }); 

जांचें कि अगर फाइल का चयन किया गया है या नहीं

  if (document.myform.elements["filefield"].value == "") { alert("You forgot to attach file!"); document.myform.elements["filefield"].focus(); return false; } 

फ़ाइल एक्सटेंशन की जांच करें

  var res_field = document.myform.elements["filefield"].value; var extension = res_field.substr(res_field.lastIndexOf('.') + 1).toLowerCase(); var allowedExtensions = ['doc', 'docx', 'txt', 'pdf', 'rtf']; if (res_field.length > 0) { if (allowedExtensions.indexOf(extension) === -1) { alert('Invalid file Format. Only ' + allowedExtensions.join(', ') + ' are allowed.'); return false; } } 

मुझे यह उदाहरण पसंद है:

 <asp:FileUpload ID="fpImages" runat="server" title="maximum file size 1 MB or less" onChange="return validateFileExtension(this)" /> <script language="javascript" type="text/javascript"> function ValidateFileUpload(Source, args) { var fuData = document.getElementById('<%= fpImages.ClientID %>'); var FileUploadPath = fuData.value; if (FileUploadPath == '') { // There is no file selected args.IsValid = false; } else { var Extension = FileUploadPath.substring(FileUploadPath.lastIndexOf('.') + 1).toLowerCase(); if (Extension == "gif" || Extension == "png" || Extension == "bmp" || Extension == "jpeg") { args.IsValid = true; // Valid file type FileUploadPath == ''; } else { args.IsValid = false; // Not valid file type } } } </script> 

यदि आप किसी इनपुट फ़ील्ड में दूरस्थ यूआरएल का परीक्षण करने की आवश्यकता रखते हैं, तो आप उन प्रकारों के साथ सरल regex का परीक्षण करने की कोशिश कर सकते हैं जिनकी आप रुचि रखते हैं।

 $input_field = $('.js-input-field-class'); if ( !(/\.(gif|jpg|jpeg|tiff|png)$/i).test( $input_field.val() )) { $('.error-message').text('This URL is not a valid image type. Please use a url with the known image types gif, jpg, jpeg, tiff or png.'); return false; } 

यह .gif, .jpg, .jpeg, .tiff या .png में समाप्त होने वाला कुछ भी कैप्चर करेगा

मुझे यह ध्यान रखना चाहिए कि चहचहाना जैसी कुछ लोकप्रिय साइटें उनकी छवियों के अंत में एक आकार की विशेषता जोड़ती हैं उदाहरण के लिए, निम्नलिखित इस परीक्षण को विफल कर देंगे हालांकि यह मान्य छवि प्रकार है:

 http://img.hiwab.com/javascript/BrTuXT5CUAAtkZM.jpg:large 

उसके कारण, यह एक सही समाधान नहीं है लेकिन यह आपको लगभग 9 0% रास्ते तक ले जाएगा।

मैं यहाँ आया था क्योंकि मुझे यकीन था कि यहाँ पर कोई जवाब नहीं था … काव्य:

 function checkextension() { var file = document.querySelector("#fUpload"); if ( /\.(jpe?g|png|gif)$/i.test(file.files[0].name) === false ) { alert("not an image!"); } } 
 <input type="file" id="fUpload" onchange="checkextension()"/> 

कोशिश करो (मेरे लिए काम करता है)

 function validate(){ var file= form.file.value; var reg = /(.*?)\.(jpg|bmp|jpeg|png)$/; if(!file.match(reg)) { alert("Invalid File"); return false; } } 
 <form name="form"> <input type="file" name="file"/> <input type="submit" onClick="return validate();"/> </form> 

आप jQuery का उपयोग मानते हुए यहां एक अधिक पुन: उपयोग करने योग्य तरीका है

लाइब्रेरी फ़ंक्शन (jQuery की आवश्यकता नहीं है):

 function stringEndsWithValidExtension(stringToCheck, acceptableExtensionsArray, required) { if (required == false && stringToCheck.length == 0) { return true; } for (var i = 0; i < acceptableExtensionsArray.length; i++) { if (stringToCheck.toLowerCase().endsWith(acceptableExtensionsArray[i].toLowerCase())) { return true; } } return false; } String.prototype.startsWith = function (str) { return (this.match("^" + str) == str) } String.prototype.endsWith = function (str) { return (this.match(str + "$") == str) } 

पृष्ठ फ़ंक्शन (jQuery (बमुश्किल) की आवश्यकता है):

 $("[id*='btnSaveForm']").click(function () { if (!stringEndsWithValidExtension($("[id*='fileUploader']").val(), [".png", ".jpeg", ".jpg", ".bmp"], false)) { alert("Photo only allows file types of PNG, JPG and BMP."); return false; } return true; }); 
 <script type="text/javascript"> function file_upload() { var imgpath = document.getElementById("<%=FileUpload1.ClientID %>").value; if (imgpath == "") { alert("Upload your Photo..."); document.file.word.focus(); return false; } else { // code to get File Extension.. var arr1 = new Array; arr1 = imgpath.split("\\"); var len = arr1.length; var img1 = arr1[len - 1]; var filext = img1.substring(img1.lastIndexOf(".") + 1); // Checking Extension if (filext == "bmp" || filext == "gif" || filext == "png" || filext == "jpg" || filext == "jpeg" ) { alert("Successfully Uploaded...") return false; } else { alert("Upload Photo with Extension ' bmp , gif, png , jpg , jpeg '"); document.form.word.focus(); return false; } } } function Doc_upload() { var imgpath = document.getElementById("<%=FileUpload2.ClientID %>").value; if (imgpath == "") { alert("Upload Agreement..."); document.file.word.focus(); return false; } else { // code to get File Extension.. var arr1 = new Array; arr1 = imgpath.split("\\"); var len = arr1.length; var img1 = arr1[len - 1]; var filext = img1.substring(img1.lastIndexOf(".") + 1); // Checking Extension if (filext == "txt" || filext == "pdf" || filext == "doc") { alert("Successfully Uploaded...") return false; } else { alert("Upload File with Extension ' txt , pdf , doc '"); document.form.word.focus(); return false; } } } </script> 
 var _validFileExtensions = [".jpg", ".jpeg", ".bmp", ".gif", ".png"]; function ValidateSingleInput(oInput) { if (oInput.type == "file") { var sFileName = oInput.value; if (sFileName.length > 0) { var blnValid = false; for (var j = 0; j < _validFileExtensions.length; j++) { var sCurExtension = _validFileExtensions[j]; if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) { blnValid = true; break; } } if (!blnValid) { alert("Sorry, " + sFileName + " is invalid, allowed extensions are: " + _validFileExtensions.join(", ")); oInput.value = ""; return false; } } } return true; } 
 File 1: <input type="file" name="file1" onchange="ValidateSingleInput(this);" /><br /> File 2: <input type="file" name="file2" onchange="ValidateSingleInput(this);" /><br /> File 3: <input type="file" name="file3" onchange="ValidateSingleInput(this);" /><br /> 

आप एक सरणी बना सकते हैं जिसमें फ़ाइल प्रकार की आवश्यकता होती है और jQuery में $ .inArray () का उपयोग करके यह जांचने के लिए कि क्या filetype सरणी में मौजूद है।

 var imageType = ['jpeg', 'jpg', 'png', 'gif', 'bmp']; // Given that file is a file object and file.type is string // like "image/jpeg", "image/png", or "image/gif" and so on... if (-1 == $.inArray(file.type.split('/')[1], imageType)) { console.log('Not an image type'); } 

यह मेरी राय में सबसे अच्छा समाधान है, जो अन्य लोगों की तुलना में बहुत कम है:

 function OnSelect(e) { var acceptedFiles = [".jpg", ".jpeg", ".png", ".gif"]; var isAcceptedImageFormat = ($.inArray(e.files[0].extension, acceptedFiles)) != -1; if (!isAcceptedImageFormat) { $('#warningMessage').show(); } else { $('#warningMessage').hide(); } } 

इस स्थिति में, इस सेटिंग को केंडो अपलोड नियंत्रण से कहा जाता है:

.Events(e => e.Select("OnSelect"))

[टाइपप्रति]

 uploadFileAcceptFormats: string[] = ['image/jpeg', 'image/gif', 'image/png', 'image/svg+xml']; // if you find the element type in the allowed types array, then read the file isAccepted = this.uploadFileAcceptFormats.find(val => { return val === uploadedFileType; }); 

आप इनपुट फ़ाइल प्रकारों के लिए accept विशेषता का उपयोग कर सकते हैं। चेकआउट MDN दस्तावेज़