Unable to download a file from S3 by the URL in a browser
I have such code snippet that used to be work with the previous versions of Google Chrome, but now it does not work. When I run this script I redirected to the page with the content of the file(it's a text) and with AWS URL(the same as in setAttribute).
var element = document.createElement('a');
element.setAttribute('href', 'https://s3-us-east-1.amazonaws.com/XXX/XXX/XXX?Signature=XXX&Expires=XXX&AWSAccessKeyId=XXX');
element.setAttribute('download', 'filename.txt');
document.body.appendChild(element);
element.click();
How to download this file?
javascript amazon-web-services google-chrome
|
show 3 more comments
I have such code snippet that used to be work with the previous versions of Google Chrome, but now it does not work. When I run this script I redirected to the page with the content of the file(it's a text) and with AWS URL(the same as in setAttribute).
var element = document.createElement('a');
element.setAttribute('href', 'https://s3-us-east-1.amazonaws.com/XXX/XXX/XXX?Signature=XXX&Expires=XXX&AWSAccessKeyId=XXX');
element.setAttribute('download', 'filename.txt');
document.body.appendChild(element);
element.click();
How to download this file?
javascript amazon-web-services google-chrome
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41
|
show 3 more comments
I have such code snippet that used to be work with the previous versions of Google Chrome, but now it does not work. When I run this script I redirected to the page with the content of the file(it's a text) and with AWS URL(the same as in setAttribute).
var element = document.createElement('a');
element.setAttribute('href', 'https://s3-us-east-1.amazonaws.com/XXX/XXX/XXX?Signature=XXX&Expires=XXX&AWSAccessKeyId=XXX');
element.setAttribute('download', 'filename.txt');
document.body.appendChild(element);
element.click();
How to download this file?
javascript amazon-web-services google-chrome
I have such code snippet that used to be work with the previous versions of Google Chrome, but now it does not work. When I run this script I redirected to the page with the content of the file(it's a text) and with AWS URL(the same as in setAttribute).
var element = document.createElement('a');
element.setAttribute('href', 'https://s3-us-east-1.amazonaws.com/XXX/XXX/XXX?Signature=XXX&Expires=XXX&AWSAccessKeyId=XXX');
element.setAttribute('download', 'filename.txt');
document.body.appendChild(element);
element.click();
How to download this file?
javascript amazon-web-services google-chrome
javascript amazon-web-services google-chrome
asked May 3 '18 at 9:06
Tony V.Tony V.
15910
15910
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41
|
show 3 more comments
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41
|
show 3 more comments
2 Answers
2
active
oldest
votes
I made an error in the comments.
Chrome still favours download attribute, but it completely ignores it if the anchor element has cross origin attributes ( meaning, if the file is hosted on a different domain).
To be able to download it, file needs to be served with header: Content-Disposition: attachment;
Check this tutorial to see how to set Content-Disposition in s3 management console: http://iwantmyreal.name/s3-download-only-presigned-upload
add a comment |
Here is my solution:
let downloadImage = url =>
let urlArray = url.split("/")
let bucket = urlArray[3]
let key = `$urlArray[4]/$urlArray[5]`
let s3 = new AWS.S3( params: Bucket: bucket )
let params = Bucket: bucket, Key: key
s3.getObject(params, (err, data) =>
let blob=new Blob([data.Body], type: data.ContentType);
let link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download=url;
link.click();
)
The url parameter refers to the full url of the image.
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f50151062%2funable-to-download-a-file-from-s3-by-the-url-in-a-browser%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
I made an error in the comments.
Chrome still favours download attribute, but it completely ignores it if the anchor element has cross origin attributes ( meaning, if the file is hosted on a different domain).
To be able to download it, file needs to be served with header: Content-Disposition: attachment;
Check this tutorial to see how to set Content-Disposition in s3 management console: http://iwantmyreal.name/s3-download-only-presigned-upload
add a comment |
I made an error in the comments.
Chrome still favours download attribute, but it completely ignores it if the anchor element has cross origin attributes ( meaning, if the file is hosted on a different domain).
To be able to download it, file needs to be served with header: Content-Disposition: attachment;
Check this tutorial to see how to set Content-Disposition in s3 management console: http://iwantmyreal.name/s3-download-only-presigned-upload
add a comment |
I made an error in the comments.
Chrome still favours download attribute, but it completely ignores it if the anchor element has cross origin attributes ( meaning, if the file is hosted on a different domain).
To be able to download it, file needs to be served with header: Content-Disposition: attachment;
Check this tutorial to see how to set Content-Disposition in s3 management console: http://iwantmyreal.name/s3-download-only-presigned-upload
I made an error in the comments.
Chrome still favours download attribute, but it completely ignores it if the anchor element has cross origin attributes ( meaning, if the file is hosted on a different domain).
To be able to download it, file needs to be served with header: Content-Disposition: attachment;
Check this tutorial to see how to set Content-Disposition in s3 management console: http://iwantmyreal.name/s3-download-only-presigned-upload
answered May 3 '18 at 10:06
BorisSBorisS
3,0031912
3,0031912
add a comment |
add a comment |
Here is my solution:
let downloadImage = url =>
let urlArray = url.split("/")
let bucket = urlArray[3]
let key = `$urlArray[4]/$urlArray[5]`
let s3 = new AWS.S3( params: Bucket: bucket )
let params = Bucket: bucket, Key: key
s3.getObject(params, (err, data) =>
let blob=new Blob([data.Body], type: data.ContentType);
let link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download=url;
link.click();
)
The url parameter refers to the full url of the image.
add a comment |
Here is my solution:
let downloadImage = url =>
let urlArray = url.split("/")
let bucket = urlArray[3]
let key = `$urlArray[4]/$urlArray[5]`
let s3 = new AWS.S3( params: Bucket: bucket )
let params = Bucket: bucket, Key: key
s3.getObject(params, (err, data) =>
let blob=new Blob([data.Body], type: data.ContentType);
let link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download=url;
link.click();
)
The url parameter refers to the full url of the image.
add a comment |
Here is my solution:
let downloadImage = url =>
let urlArray = url.split("/")
let bucket = urlArray[3]
let key = `$urlArray[4]/$urlArray[5]`
let s3 = new AWS.S3( params: Bucket: bucket )
let params = Bucket: bucket, Key: key
s3.getObject(params, (err, data) =>
let blob=new Blob([data.Body], type: data.ContentType);
let link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download=url;
link.click();
)
The url parameter refers to the full url of the image.
Here is my solution:
let downloadImage = url =>
let urlArray = url.split("/")
let bucket = urlArray[3]
let key = `$urlArray[4]/$urlArray[5]`
let s3 = new AWS.S3( params: Bucket: bucket )
let params = Bucket: bucket, Key: key
s3.getObject(params, (err, data) =>
let blob=new Blob([data.Body], type: data.ContentType);
let link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download=url;
link.click();
)
The url parameter refers to the full url of the image.
answered Nov 12 '18 at 20:53
Jordan DanielsJordan Daniels
52739
52739
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f50151062%2funable-to-download-a-file-from-s3-by-the-url-in-a-browser%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Maybe it's to do with settings on the browser how to behave when a download link it clicked? Chrome "opens" a lot of file extensions by default in a previewer rather than downloading the files.
– Nope
May 3 '18 at 9:09
@Nope I'm not able to change settings on the user's browsers.
– Tony V.
May 3 '18 at 9:11
check if HTTP header Content-Disposition is present in the response headers and if it's set to "filename.txt".
– BorisS
May 3 '18 at 9:31
@BorisS Yes, it's present: Content-Disposition: inline;filename=filename.txt;filename*=UTF-8''filename.txt
– Tony V.
May 3 '18 at 9:36
Here your problem lies: Content-Disposition: inline, it should be Content-Disposition: attachment. Browsers ( and latest verstions of Chrome) favour Content-Disposition header over download attribute
– BorisS
May 3 '18 at 9:41