2008-09-25 8 views
18

मैं अपनी परियोजनाओं में से एक के लिए जीमेल जैसी फाइल अपलोड कार्यक्षमता जोड़ना चाहता हूं। क्या कोई मेरी इसके साथ मदद कर सकता है?मैं अपने वेब ऐप के लिए जीमेल जैसी फ़ाइल अपलोड कैसे प्राप्त कर सकता हूं?

मेरा आवेदन vb.net में बनाया गया है।

मैं किसी भी प्रकार की सहायता या मार्गदर्शन की सराहना करता हूं।

धन्यवाद

+0

जीमेल क्या उपयोग करता है? फ्लैश? IFrame? –

+0

उन्होंने लगभग 1-2 महीने पहले फ्लैश करने के लिए स्विच किया था। कम से कम जीमेल में। –

उत्तर

32

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

लिंक से: सभी घटनाओं पर एक बार में

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

Demos

----- आइफ्रेम अपलोड ---- -

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

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

एक बार जब नया फ़ाइल इनपुट फॉर्म में जोड़ा जाता है, तो उस इनपुट की धुंध घटना को जावास्क्रिप्ट फ़ंक्शन पर सेट करें जो फ़ॉर्म सबमिट करेगा और फिर इसे आउटपुट के लिए समय-समय पर जांचें। एक आईफ्रेम पढ़ना मुश्किल हो सकता है, लेकिन यह संभव है।

क्या आपकी फ़ाइल अपलोड स्क्रिप्ट आउटपुट "पूर्ण हो गई है।" या अपलोड पूरा होने पर एक फ़ाइल नाम या कुछ।

सामग्री होने तक हर दूसरे या तब तक जांचें। एक बार आपके पास सामग्री हो जाने के बाद, अपने टाइमर को मार दें और फ़ाइल इनपुट (या "फ़ाइल अपलोड किया गया") के साथ फ़ाइल इनपुट को प्रतिस्थापित करें।

सीएसएस के साथ अपना आईफ्रेम छुपाएं।

11

यूयूआई से! (याहू यूज़र इंटरफ़ेस), https://yuilibrary.com/yui/docs/uploader/

  1. एक भी "फ़ाइल खोलें" संवाद में एकाधिक फ़ाइल चयन।
  2. उपयोगकर्ता के चयन की सुविधा के लिए फ़ाइल एक्सटेंशन फ़िल्टर।
  3. फ़ाइल अपलोड के लिए प्रगति ट्रैकिंग।
  4. फ़ाइल मेटाडाटा की एक श्रृंखला: फ़ाइल नाम, आकार, दिनांक बनाया गया, दिनांक संशोधित, और लेखक।
  5. फ़ाइल अपलोड प्रक्रिया के विभिन्न पहलुओं पर भेजे गए ईवेंट का एक सेट: फ़ाइल चयन, प्रगति अपलोड करें, अपलोड पूरा करने आदि।
  6. फ़ाइल अपलोड में अतिरिक्त डेटा शामिल करने के लिए POST अनुरोध शामिल करें।
  7. संशोधित SEND बफर आकार के कारण ब्रॉडबैंड कनेक्शन पर तेज़ फ़ाइल अपलोड करें।
  8. फ़ाइल अपलोड के पूरा होने पर समान पृष्ठ सर्वर प्रतिक्रिया।

पूरी तरह से नि: शुल्क

+0

इसे काम करने के लिए फ्लैश की आवश्यकता है, लेकिन यह एक व्यवहार्य समाधान है। –

+1

मुझे समझ में नहीं आता कि यह एक डाउनवोट क्यों होगा। ओपी ने कभी निर्दिष्ट नहीं किया कि फ्लैश की अनुमति नहीं है। – enobrev

+2

मुझे नहीं पता कि आप इसके लिए किसी को क्यों कम कर देंगे। स्पष्ट रूप से डेवलपर जो फ्लैश की आवश्यकता वाले घटक का उपयोग करने का निर्णय लेता है, उसे पता होना चाहिए कि यह टूल उन कुछ उपयोगकर्ताओं को सीमित कर सकता है, जिन्होंने इसे इंस्टॉल नहीं किया है और उन्हें उन मामलों में एक विकल्प प्रदान करना चाहिए, लेकिन अन्यथा यह एक अच्छा जवाब है –

0

मैं "जीमेल की तरह" फ़ाइल अपलोड का एक छोटा और स्पष्टीकरण चाहें।

क्या आपका मतलब यह है कि अगर यह थोड़ा सा बैठता है, तो यह स्वचालित रूप से इसे ड्राफ्ट में जोड़ता है?

+0

मुझे लगता है कि यह एक अच्छा विचार होगा अगर ओपी ने जीमेल फ़ाइल अपलोड के बारे में क्या स्पष्ट किया, उसे पसंद किया और वह ढूंढ रहा है .... –

0

जीमेल के कोड के आसपास अपना रास्ता खोजने के लिए मुश्किल है, लेकिन अगर मुझे लगता है कि करने के लिए किया था, यह है कि यह कैसे काम करता है:

  • जब आप "एक और फ़ाइल संलग्न" पर क्लिक करें, यह एक नियमित रूप से इनपुट प्रकार फ़ाइल नियंत्रण सम्मिलित करता है । आईई पर, यह "ब्राउज़" बटन पर प्रोग्राम ईवेंट को प्रोग्रामेटिक रूप से ट्रिगर भी कर सकता है, इसलिए फ़ाइल संवाद तुरंत खुलता है (यह फ़ायरफ़ॉक्स पर ऐसा नहीं करता है, और मेरे पास आईई आसान नहीं है, लेकिन मेरा मानना ​​है कि आईई इसके लिए अनुमति देता है)
  • फ़ाइल चुनने के बाद, यह इनपुट नियंत्रण की परिवर्तन घटना का पता लगाता है, और टाइमर शुरू करता है।
  • जब टाइमर ट्रिगर होता है, तो यह फ़ॉर्म से इनपुट तत्व को अलग करता है, और इसे एक छिपे हुए आईफ्रेम में एक अलग रूप में जोड़ता है, जिसमें मुख्य (दृश्यमान) रूप में एक साधारण लिंक लगाया जाता है। तब छुपा आईफ्रेम फ़ाइल अपलोड करने के लिए सबमिट किया जाता है। (यह भी इनपुट तत्व क्लोन सकता है, लेकिन मैं प्रयास नहीं किया है कि क्या यह काम करता है।)
1

के लिए iFrames उपयोग कर सकते हैं एक गैर फ़्लैश समाधान के लिए, आप NeatUpload उपयोग कर सकते हैं। मैंने पिछले साल एक व्यापक परियोजना पर एक फ्लैश आवश्यकता के साथ इसका इस्तेमाल किया था। मौजूदा समाधानों में एकीकृत करना बहुत आसान है। मैंने सोचा कि यह काम करने के लिए एक हवा था। ASP.NET में SWFUpload के साथ काम करने से, मेरे सीमित अनुभव में आसान। शायद क्योंकि NeatUpload केवल ASP.NET के लिए बनाया गया है।

1

क्या आप एक पूर्ण पृष्ठ पोस्टबैक के बिना अपलोड के बारे में बात कर रहे हैं? http://www.phpletter.com/Demo/AjaxFileUpload-Demo/ पर एक नज़र डालें, जो एक छिपी हुई आईफ्रेम बनाता है, इनपुट नियंत्रण की प्रतिलिपि बनाता है, और सर्वर पर फ़ाइल प्राप्त करने के लिए पोस्ट करने के लिए iframe का उपयोग करता है।

यदि आप उस व्यवहार की तलाश में हैं जहां उपयोगकर्ता "संलग्न फ़ाइल" पर क्लिक करता है और फ़ाइल ब्राउज़िंग संवाद स्वचालित रूप से पॉप अप हो जाता है, जो जावास्क्रिप्ट के माध्यम से किया जा सकता है लेकिन फ़ायरफ़ॉक्स में काम नहीं करता है, जिसमें सुरक्षा सावधानी बरतनी है उपयोगकर्ता को सीधे "ब्राउज़ करें" बटन का आह्वान करने की आवश्यकता है (स्क्रिप्ट के माध्यम से प्रोग्रामेटिक रूप से)।

"स्वचालित" अपलोड के लिए, 'इनपुट' नियंत्रण की "मान" संपत्ति के लिए "परिवर्तन" ईवेंट से संलग्न करने के लिए जावास्क्रिप्ट का उपयोग करें ताकि फ़ाइल का चयन होने पर प्रदर्शन किया जा सके।

4

यहां gmail uploader clone है। यह कुछ अतिरिक्त सुविधाओं के साथ जीमेल अपलोडर का सटीक क्लोन है। अपलोड करने के बाद आप छवियों के थंबनेल देख सकते हैं, ऑर्डर बदलने और किसी भी थंबनेल को बदलने के लिए थंबनेल खींचें। यह jQuery का उपयोग करके किया जाता है। आप डेमो here देख सकते हैं। स्रोत कोड download in a single zip file पर निःशुल्क है।

मुझे आशा है कि आप आसानी से कुछ कोड निकाल सकते हैं और वांछित चीज़ प्राप्त कर सकते हैं। यदि आपको और सहायता की आवश्यकता है तो आप एबीसीओडर ब्लॉग पर टिप्पणियां छोड़ सकते हैं।

1

आप इसके बजाय Flickr Uploader क्लोन का उपयोग कर सकते हैं।

1

अब यह 2 साल हो गया है, मैंने अपनी विरासत प्रणाली में अपलोडिफ़ाई का उपयोग किया और यह अच्छा काम करता है। लेकिन आपको कुछ हैक कोड लिखना होगा (जैसे सत्र धारण करना)।

मुझे सलाह है कि आप jquery upload का उपयोग करें, जो शुद्ध HTML है, कोई swf, कोई सत्र समस्या नहीं है और वास्तव में बहुत अच्छा है! 2013 को

==, मैं क्या लिखा है:

मैं, जो चयन करने के लिए विचार कर रहा हूँ SWFUpload या uploadify

लेकिन SWFUpload की आधिकारिक वेबसाइट पर, यह कहते है कि वह सक्रिय नहीं विकास के तहत किया गया है और लेखक किसी दिन उम्मीद कर रहा है SWFUpload को पुनर्जीवित कर सकता है ...

तो ... मैं "uploadify" की कोशिश करने का फैसला किया है, जो लगता है कि कई विकल्पों का समर्थन करता है, बहुत सारे डेमो के साथ कॉलबैक। (इसके स्रोत कोड की जांच करने के बाद, मुझे लगता है कि लेखक "SWFupload v1" और "SWFupload v2" को अपने "अपलोडिफ़ v3" में लपेटता है ...)

और this kind of uploaders की पूरी सूची है।