2016-09-25 4 views
5

में POST अनुरोध से एक फ़ाइल डाउनलोड करें मैं कोआ में POST अनुरोध हैंडलर से koa-router के साथ एक डाउनलोड ट्रिगर करने का प्रयास कर रहा हूं। अनिवार्य रूप से, मैं इस तरह कुछ करने के लिए कोशिश कर रहा हूँ:कोआ

app.js

const Koa = require('koa') 
const router = require('./router') 

const app = new Koa() 

app.use(router.routes()) 
app.use(router.allowedMethods()) 

app.listen(3000) 

router.js

const fs = require('fs') 
const Router = require('koa-router') 

const router = new Router() 

router.post('/generate', function *() { 
    const path = `${__dirname}/test.txt` 
    this.body = fs.createReadStream(path) 
    this.set('Content-disposition', 'attachment; filename= test.txt') 
}) 

module.exports = router 

client.js

const { fetch } = window; 

const request = { 
    method: 'POST', 
    body: JSON.stringify({ fake: 'data' }) 
} 

// Make the POST request 
fetch('/generate', request) 

हालांकि, जब POST अनुरोध भेजा जाता है, तो कुछ भी नहीं होता है। मुझे सर्वर कंसोल या ब्राउज़र कंसोल में कोई त्रुटि नहीं है। किसी भी सहायता की सराहना की जाएगी!

+0

मुझे लगता है कि तुम्हारी समस्या सर्वर-साइड कोड लेकिन क्लाइंट-साइड पर नहीं है। क्या आप दिखा सकते हैं कि आप प्राप्त डेटा के साथ क्या कर रहे हैं? फ़ेच एक फॉर्म सबमिशन के रूप में काम नहीं करेगा, आपको प्रतिक्रिया को संभालना होगा और यदि आप इसे डाउनलोड करना चाहते हैं तो वेड्रान ने अपने क्लाइंट-साइड कोड पर क्या किया। –

उत्तर

4

आप https://github.com/koajs/send

router.post('/generate', function * (next) { 
    yield send(this, 'file.txt'); 
}); 

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

fetch('/generate', request) 
    .then(res => { return res.text() }) 
    .then(content => { 

    uriContent = "data:application/octet-stream," + encodeURIComponent(content); 

    newWindow = window.open(uriContent, 'somefile'); 

    }); 
+0

यह कोड मेरे लिए काम नहीं करता प्रतीत होता है। क्या आपके पास एक साधारण उदाहरण के किसी भी मौके से काम करने वाला 'गिस्ट' है? – saadq

+0

मैंने सार्वजनिक जिथब रेपो बनाया है https://github.com/vedranjukic/downloadkoademo बस क्लोन और एनपीएम इंस्टॉल करें। ऐप को node app.js के साथ चलाएं और क्रोम लोकलहोस्ट खोलें: 3000 और परीक्षण के लिए डाउनलोड बटन पर क्लिक करें। मैंने इसे यथासंभव सरल बनाने की कोशिश की है। अगर यह आप के लिए काम करता है तो मुझे बतलाएगा। –

+0

वाह, मैंने अभी यह पता लगाया कि समस्या क्या थी। मैंने अपने पॉपअप अवरोधक के रूप में 'यूब्लॉक उत्पत्ति' स्थापित किया था, और ऐसा लगता है कि यह डाउनलोड को रोक रहा था। मूर्ख मुद्दे के बारे में खेद है, और प्रतिक्रिया के लिए धन्यवाद! – saadq

4

आपको शरीर में फ़ाइल स्ट्रीम सेट करनी चाहिए और उस फ़ाइल नाम के साथ अनुलग्नक में सामग्री-स्वभाव भेजना चाहिए। नीचे दिए गए कोड का प्रयोग करें

const Router = require('koa-router'); 
const router = new Router(); 

router.post('/generate', function *() { 
    const path = `${__dirname}/file.txt`; 
    this.body = fs.createReadStream(path); 
    this.set('Content-disposition', 'attachment; filename= file.txt'); 
}); 

module.exports = router; 

अद्यतन: पूरा काम कर कोड:

var app = require('koa')(); 
var router = require('koa-router')(); 
const fs = require('fs'); 
router.post('/generate', function() { 
    const path = `${__dirname}/file.txt`; 
    this.body = fs.createReadStream(path); 
    this.set('Content-disposition', 'attachment; filename= file.txt'); 
}); 

app 
    .use(router.routes()) 
    .use(router.allowedMethods()); 

    app.listen(3000); 

ग्राहक:

<button id="btnDownload">Download</button> 

<script type="text/javascript"> 
    const request = { 
     method: 'POST', 
     body: JSON.stringify({ 
      fake: 'data' 
     }) 
    } 

    document.getElementById('download').onclick =() => { 
     fetch('/generate', request) 
      .then(res => { 
       return res.text() 
      }) 
      .then(content => {}); 
    } 
</script> 
+0

यह मूल रूप से मैं जो करने की कोशिश कर रहा हूं, लेकिन ऐसा लगता है कि यह काम नहीं कर रहा है। मैंने अपना पूरा कोड शामिल करने के लिए अपनी पोस्ट अपडेट की है, अगर आपको पता है कि समस्या क्या है तो कृपया मुझे बताएं। – saadq

+0

मूल रूप से, जब POST अनुरोध भेजा जाता है, तो मेरे ब्राउज़र में कुछ भी नहीं होता है। मैंने सोचा कि फ़ाइल डाउनलोड होगी? – saadq

+0

@meh_programmer इसकी वजह से आप वर्तनी का उपयोग कर रहे हैं .this.set ('सामग्री-स्वभाव', 'अटैचमेंट; filename = test.txt')। "अटैचमेंट" को "अटैचमेंट" में बदलें; :) – Sachin

0

ही कार्यक्षमता एक टैग download.I इस पसंद का प्रयोग कर प्राप्त किया जा सकता है। यह जेएस के बिना काम करता है लेकिन सफारी में नहीं।

<!DOCTYPE html> 
<html> 
<body> 

<p>Click on the w3schools logo to download the image:<p> 

<a href="http://www.w3schools.com/images/myw3schoolsimage.jpg" download> 
    <img border="0" src="http://www.w3schools.com/images/myw3schoolsimage.jpg" alt="W3Schools" width="104" height="142"> 
</a> 

<p><b>Note:</b> The download attribute is not supported in Edge version 12, IE, Safari or Opera version 12 (and earlier).</p> 

</body> 
</html> 

refernce: http://www.w3schools.com/tags/att_a_download.asp

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