2010-07-28 15 views
11

नमस्ते,किसी भी सर्वर अनुरोध के बिना एक फ़ाइल डाउनलोड ट्रिगर

मैं एक जे एस आधारित अनुप्रयोग है कि कुछ जटिल काम करता है और एक <div> बारे में कुछ जानकारी (वास्तव में, लाइनों के सैकड़ों तक) लॉग पर काम कर रहा हूँ।

मेरा लक्ष्य "लॉग सहेजें" बटन होना है जो मेरे लॉगिंग <div> की सामग्री को सहेजने के लिए ब्राउज़र के डाउनलोड संवाद को ट्रिगर करता है।

  • अंतिम उपयोगकर्ता फ़ाइल पर पूरा नियंत्रण होना चाहिए:

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

  • एप्लिकेशन ऑफ़लाइन काम करने में सक्षम होना चाहिए (कम से कम कुछ परिस्थितियों में)। वह, और दक्षता, इसलिए मैंने सर्वर को डेटा को "सामग्री-स्वभाव" शीर्षलेख के साथ वापस लाने के विचार को त्याग दिया।
  • फ़ाइल को text/plain के रूप में ठीक से चिह्नित किया जाना चाहिए, इसलिए ब्राउज़र सामान्य फ़ाइल डाउनलोड की तरह डिफ़ॉल्ट क्रियाओं (जैसे "नोटपैड पर खोलें") का सुझाव दे सकता है। इसे पहली आवश्यकता के एक विशिष्ट पहलू के रूप में देखा जा सकता है।
  • उपयोगकर्ता को <div> की सामग्री को टेक्स्ट एडिटर में कॉपी-पेस्ट करने और उसे वहां से सहेजने के लिए निश्चित रूप से डरावना है, और यही कारण है कि मैं इससे बचने की कोशिश कर रहा हूं।

मैं इस साइट पर, WHATWG और W3C साइटों पर और वेब पर सामान्य रूप से बिना किसी सफलता के खोज कर रहा हूं। क्या यह बिल्कुल करने योग्य है?

मुझे सबसे नज़दीकी मिला है data: यूआरएल का उपयोग करके। मेरा पहला प्रयास, एक पोस्ट एक्शन करने के लिए, सामग्री प्रकार के माध्यम से नहीं मिल सका, इसलिए यह UA की ह्युरिस्टिक्स में गिर जाएगी। मुझे एक बटन की तरह देखने के लिए <a> लिंक स्टाइल करके इसे type विशेषता देकर थोड़ा बेहतर मिला, लेकिन फिर UA बहुत ही स्मार्ट खेलेंगे और सहेजने के बजाय सामग्री प्रस्तुत करेगा (और उपयोगकर्ता को ब्राउज़र से फ़ाइल को सहेजने के लिए कहेंगे यह चरण कॉपी-पेस्ट दृष्टिकोण लेने से भी बदतर हो जाता है, क्योंकि पृष्ठ की बचत ब्राउज़र के बीच जंगली रूप से भिन्न होती है)।

यदि data: यूआरएल को "सामग्री-स्वभाव" के साथ जोड़ने के लिए कुछ तरीका था-जैसे संकेत, चीजें वास्तव में चिकनी हो सकती हैं।

सादर, Herenvardo

+1

क्या फ्लैश जैसे प्लगइन का उपयोग करना है? मुझे नहीं पता कि मानक एचटीएमएल के साथ क्या करना संभव है, लेकिन फ्लैश एक विकल्प था, तो यह बहुत आसान होगा ... –

+0

मेरे पास एक समान सवाल था http://stackoverflow.com/questions/2832392/can-you- do-file-io-use-javascript-without-activex लेकिन केवल एक जवाब मिला। मुझे नहीं लगता कि यह संभव है हालांकि। –

+0

क्या "कोड के साथ क्लिपबोर्ड पर प्रतिलिपि बनाना और उपयोगकर्ता को नोटपैड (या पसंदीदा टेक्स्ट एडिटर) में पेस्ट करने के लिए कह रहा था" विचार आया? क्लिपबोर्ड मेगाबाइट्स को संभाल सकता है, हालांकि नोटपैड कुछ मेगाबाइट्स पर चकित हो सकता है। दूसरी ओर: http://stackoverflow.com/questions/17836273/export-javascript-data-to-csv-file-without-server-interaction – TWiStErRob

उत्तर

2

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

इसके अलावा 'डेटा' यूआरएल सभी ब्राउज़र/संस्करण संयोजनों में समर्थित नहीं है। मुझे यकीन नहीं है कि क्या आपके उपयोगकर्ता इस बात पर बाध्य हैं कि वे किस ब्राउज़र का उपयोग कर रहे हैं या नहीं, लेकिन इससे आप उस समाधान के साथ क्या कर सकते हैं सीमित कर सकते हैं।

+0

धन्यवाद! ऐसा लगता है कि प्लग-इन (या फ्लैश) - आधारित दृष्टिकोण ही एकमात्र तरीका है सभी आवश्यकताओं को पूरा किया जा सकता है। एक तरफ ध्यान दें, 'डेटा:' के लिए समर्थन एक मुद्दा नहीं है: संपूर्ण रूप से ऐप बहुत सी HTML5 सुविधाओं पर निर्भर करता है, इसलिए पहले से ही एक भारी ब्राउज़र आवश्यकता है, जिसके लिए 'डेटा:' जीता ' एक मुद्दा है कि ज्यादा नहीं है। –

+1

इसके अलावा, सिल्वरलाइट यहां एक व्यवहार्य विकल्प हो सकता है। इस तरह के एक दिलचस्प दृष्टिकोण के लिए –

2

यह समाधान थोड़ा ही मजबूत है लेकिन आपकी आवश्यकताओं के लिए काम करेगा, शायद यह एक विकल्प है।

एक कस्टम वेब सर्वर बनाएं जो किसी भी जीईटी या पोस्ट की सामग्री को पाठ/सादे के रूप में वापस लौटाता है।

वेब सर्वर के समान बॉक्स पर वेब सर्वर होस्ट करें लेकिन एक अलग पोर्ट पर चल रहा है। जब आप सहेजें लॉग बटन पर क्लिक करते हैं, तो अनुरोध कस्टम सर्वर पर भेजा जाता है और टेक्स्ट फ़ाइल लौटा दी जाती है।

यहाँ जावा में अवधारणा सर्वर का एक सबूत सिर्फ इतना है कि क्या करेंगे कि है:

// After running this program, access with your browser at 127.0.0.1:8080 

import java.net.*; 
import java.io.*; 

public class ReturnTextFile 
{ 

    public static void main(String[] args) 
    { 

    try 
    { 
     ServerSocket server = new ServerSocket(8080); 
     Socket connection = null; 

     while (true) 
     { 

     try 
     { 
      connection = server.accept(); 

      BufferedReader in = new BufferedReader(new InputStreamReader(connection.getInputStream())); 

      String input = in.readLine(); 

      // TODO: Clean up input 

      Writer out = new OutputStreamWriter(connection.getOutputStream()); 

      String output = "HTTP/1.1 200 OK\n" + 
        "Connection: close\n" + 
        "Content-Disposition: attachment; filename=log.txt\n" + 
        "Content-Type: text/plain; charset=utf-8\n" + 
        "\n"; 

      output += input; 

      out.write(output); 

      out.flush(); 

      connection.close(); 
     } 
     catch (IOException ex) 
     { 
      ex.printStackTrace(); 
     } 
     finally 
     { 
      if (connection != null) 
      { 
      connection.close(); 
      } 
     } 

     } 

    } 
    catch (IOException ex) 
    { 
     ex.printStackTrace(); 
    } 

    } 
} 
+0

+1। भविष्य में परियोजनाओं के लिए मैं निश्चित रूप से स्थानीय सर्वर के विचार को ध्यान में रखूंगा, लेकिन माइक का जवाब इस मुद्दे को और अधिक आसानी से हल करने लगता है। –

2

आपको कुछ इस तरह data: URL में सामग्री प्रकार सेट कर सकते हैं,:

data:text/plain,this is some text 

हालांकि, कि अभी भी ब्राउज़र की समस्या को पाठ के रूप में स्वचालित रूप से प्रस्तुत करने की समस्या है। आपके पास वास्तव में दो विकल्प हैं जिन्हें मैं देख सकता हूं। एक यह है कि आप इस प्रकार को किसी प्रकार के द्विआधारी प्रकार पर सेट करते हैं ताकि ब्राउजर इसे आज़माकर प्रस्तुत न करे, या आपके पास टेक्स्ट/सादा के रूप में टाइप हो और उपयोगकर्ता को राइट-क्लिक और सेव करने के लिए प्राप्त करें। शायद कुछ here मदद कर सकते हैं?

1

मैं इस सड़क से नीचे गया हूं, और मैं इसे क्लाइंट-साइड पर पूरी तरह से करना चाहता था। लेकिन यह असंभव है। बिना किसी झगड़े के सहेजने वाले संवाद को ट्रिगर करने का एकमात्र तरीका HTTP पोस्ट अनुरोध कर रहा है, और सर्वर को content-disposition शीर्षलेख के साथ प्रतिसाद देना है।

मेरे पास my dusty old blog पर कोड स्निपेट में आपकी वांछित कार्यक्षमता है। मेरे पास एक छिपे हुए फ़ील्ड के साथ एक कस्टम HTTP हैंडलर की ओर इशारा किया गया है। जावास्क्रिप्ट कोड ब्लॉक के आंतरिक पाठ को पकड़ता है, इसे छिपे हुए क्षेत्र में रखता है, और फॉर्म सबमिट करता है। सर्वर आवश्यक हेडर के साथ अनुरोध के पूरे शरीर के साथ प्रतिक्रिया करता है। कोई रीफ्रेश नहीं है, आप इसे क्लिक करते हैं और आपको एक सेव डायलॉग मिलता है। बहुत अच्छा काम करता है!

+0

'डेटा' के साथ जंक्शन में 'http-equiv' शीर्षलेख का उपयोग करने के बारे में क्या है:' यूआरआई हेडर अनुकरण करने के लिए? क्या इससे काम हो जायेगा? – haxxerz

संबंधित मुद्दे