0

I am using Firebase hosting and Firebase storage for my website.

I am serving a special image for 5 min and allowing user to download it.

This is how i am generating the url:

function getSignedUrl(file) {
    console.time('URLGenerated ');
    let options = { action: 'read', expires: Date.now() + 5 * 60 * 1000, ResponseContentType: 'binary/octet-stream' }; // 5min Expiration Time
    let bucketFileName = path.basename(file);
    return bucket.upload(file, { destination: `public/${bucketFileName}` })
        .then(() => {
            return bucket.file(`public/${bucketFileName}`).getSignedUrl(options)
                .then((urls) => {
                    fs.unlinkSync(file);
                    console.timeEnd('URLGenerated ');
                    return urls[0];
                })
                .catch((e) => {
                    console.log('Link Generation Error' + e);
                });
        }).catch((e) => console.log(e));
} 

the URL is generated and i put that in a anchor tag like this:

<a class="submitBtn" download="" href="https://firebasestorage.googleapis.com/v0/b/ecutter-web.appspot.com/o/15737172127732.jpg?alt=media&token=4bdf0705-9621-4117-8e65-fdd05ea7920d">Download</a> 

Now the image is not starting to download it is navigating to the URL.

How can i download the image with the filename it provides ?

andastew
  • 1
  • 4
  • This likely is due to the content-disposition response header on the requested resource, as well as the resource being served from a different origin. See this answer for details: https://stackoverflow.com/a/59031245/5282725 – Zacx Oct 24 '20 at 18:10
  • @Zacx hi buddy, the thing is i can't use blob as firebase storage won't be able to serve image to fetch as cross origin is not enabled. and other method of base64 is maybe a go for but seems like boilerplate – andastew Oct 24 '20 at 18:21

0 Answers0