2013-02-04 34 views
43

हमारे आवेदन में हम परिदृश्य निम्नलिखित लागू करने की आवश्यकता:AJAX अनुरोध का उपयोग कर फ़ाइल डाउनलोड करने का कोई तरीका क्यों नहीं है?

  1. एक अनुरोध ग्राहक से भेज
  2. सर्वर अनुरोध हैंडल और
  3. सर्वर रिटर्न जवाब में दायर फ़ाइल उत्पन्न है
  4. ग्राहक ब्राउज़र को प्रदर्शित करता है फ़ाइल डाउनलोड पॉपअप संवाद और उपयोगकर्ता को फ़ाइल डाउनलोड करने की अनुमति देता है

हमारा आवेदन AJAX आधारित एप्लिकेशन है, इसलिए यह बहुत आसान और संयोजक होगा हमारे लिए AJAX अनुरोध भेजने के लिए ent (जैसे jquery.ajax() फ़ंक्शन का उपयोग करना)।

लेकिन गूगिलिंग के बाद, यह पता चला कि गैर-AJAX POST अनुरोध (जैसे this popular SO thread में वर्णित) का उपयोग करते समय फ़ाइल डाउनलोड करना संभव है। इसलिए हमें uglier और अधिक जटिल समाधान को लागू करने की आवश्यकता थी जिसके लिए नेस्टेड छिपे हुए फ़ील्ड के साथ form की HTML संरचना का निर्माण करना आवश्यक था।

क्या कोई साधारण शब्दों में समझा सकता है कि AJAX अनुरोधों को फ़ाइल डाउनलोड करने के लिए क्यों उपयोग नहीं किया जा सकता है? उसके पीछे यांत्रिकी क्या है?

+3

यह तथ्य इस तथ्य के कारण है कि AJAX के माध्यम से पुनर्प्राप्त सब कुछ जावास्क्रिप्ट "स्मृति" में जाता है। और आप जावास्क्रिप्ट मेमोरी में फ़ाइल नहीं चाहते हैं, इसलिए आपकी सबसे अच्छी शर्त http://stackoverflow.com/questions/3502267/download-a-file-using-ajax (बलुससी का उत्तर) – Najzero

+1

[विकिपीडिया] (http: // en.wikipedia.org/wiki/Ajax_(programming)): '... मौजूदा पृष्ठ के प्रदर्शन और व्यवहार में हस्तक्षेप किए बिना सर्वर को डेटा को पुनर्प्राप्त करें।' इसलिए यह पृष्ठ और डेटा में हस्तक्षेप नहीं करेगा केवल जावास्क्रिप्ट मेमोरी स्पेस में संग्रहीत किया जाएगा। –

+0

[एजेक्स पोस्ट से हैंडल फ़ाइल डाउनलोड] के संभावित डुप्लिकेट [http://stackoverflow.com/a/23797348/148271) – IsmailS

उत्तर

58

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

+7

यह सही प्रतीत नहीं होता है, क्योंकि आप फ़ाइल को सहेजने के लिए ब्लॉब का उपयोग कर सकते हैं, जैसे उदा। यहां: http://stackoverflow.com/questions/19327749/javascript-blob-filename-without-link, और यह एक सुरक्षा समस्या की तरह प्रतीत नहीं होता है क्योंकि यह प्रत्यक्ष बातचीत नहीं है बल्कि केवल ब्राउज़र को स्मृति से फ़ाइल डाउनलोड करने के बजाय कह रहा है सर्वर। –

+0

यह 'window.location = urlWhereFileCanBeDownloaded' से अलग कैसे है, जो किसी भी फाइल को किसी भी तरह से सेवा देता है, जिससे जेएस को यह सब रोकने की अनुमति मिलती है? – Alexandru

1

यही वही सवाल है जिसे मैंने दो दिन पहले पूछा था। एक्स्टजेस का उपयोग करके लिखे गए क्लाइंट के साथ एक प्रोजेक्ट था और सर्वर साइड प्राप्ति ASP.Net पर थी। मुझे सर्वर पर सर्वर की तरफ अनुवाद करना है। एक XML फ़ाइल डाउनलोड करने के लिए एक फ़ंक्शन था, वह सर्वर क्लाइंट से अजाक्स अनुरोध के बाद उत्पन्न करता है। हम सभी जानते हैं कि अजाक्स अनुरोध के बाद फ़ाइल को डाउनलोड करना असंभव है, बस इसे स्मृति में संग्रहीत करने के लिए। लेकिन ... मूल एप्लिकेशन ब्राउज़र में विकल्पों को खोलने, सहेजने और रद्द करने के साथ सामान्य संवाद दिखाता है। एएसपी.Net ने किसी भी तरह से मानक व्यवहार बदल दिया ... मुझे फिर से साबित करने के लिए दो दिन लगते हैं - सामान्य तरीके से अनुरोध करके फ़ाइल डाउनलोड करने का कोई तरीका नहीं है ... केवल अपवाद एएसपी.Net है ... यहां ASP.Net है कोड

public static void WriteFileToResponse(byte[] fileData, string fileName) 
    { 
     var response = HttpContext.Current.Response; 

     var returnFilename = Path.GetFileName(fileName); 
     var headerValue = String.Format("attachment; filename={0}", 
      HttpUtility.UrlPathEncode(
       String.IsNullOrEmpty(returnFilename) 
        ? "attachment" : returnFilename)); 
     response.AddHeader("content-disposition", headerValue); 
     response.ContentType = "application/octet-stream"; 
     response.AddHeader("Pragma", "public"); 

     var utf8 = Encoding.UTF8; 
     response.Charset = utf8.HeaderName; 
     response.ContentEncoding = utf8; 
     response.Flush(); 
     response.BinaryWrite(fileData); 
     response.Flush(); 
     response.Close(); 
    } 

इस विधि WebMethod से बुलाया गया था, कि, बारी में, ExtJS.Ajax.request से बुलाया गया था। वह जादू है। क्या मेरे लिए है, मैं सर्वलेट और छिपे हुए आइफ्रेम साथ समाप्त हो गया है ...

-3

आप अपने डाउनलोड पृष्ठ में छिपा iframe का उपयोग करके ऐसा कर सकते हैं

सिर्फ अपने ajax सफलता प्रतिक्रिया में छिपा ifame के स्रोत की स्थापना की और अपने कार्य किया जाता है ...

$.ajax({ 
     type: 'GET', 
     url: './page.php', 
     data: $("#myform").serialize(), 
     success: function (data) { 
      $("#middle").attr('src','url'); 
     }, 

}); 
2

इस ब्लॉब बुलाया नए एचटीएमएल 5 सुविधा का उपयोग कर किया जा सकता है। एक पुस्तकालय FileSaver.js है जिसे उस सुविधा के शीर्ष पर एक रैपर के रूप में उपयोग किया जा सकता है।