Javascript display filename instead of blob name in the PDF URL

Question

I am able to get the pdf in the new window with URL as

htts://mydomainname/410-8d9c-4883-86c5-d76c50a24a1d

I want to remove the auto generated blob name (410-8d9c-4883-86c5-d76c50a24a1d) in the generated URL and place my custom name link below

htts://mydomainname/filename

What modifications i need to do for below code

var file = new Blob([response], {type: 'application/pdf'});                     
var fileURL = URL.createObjectURL(file);                                                                                                    
$window.open(fileURL);

I'm guessing the file name would be in the `data` (JSON) that you are passing to `newFile()`. Maybe if you include a sample of `data` we would be able to help more. — Tigger, Jun 05 '17 at 10:12
https://stackoverflow.com/questions/19327749/javascript-blob-filename-without-link — Anmol Mittal, Jun 05 '17 at 10:13
Possible duplicate of [JavaScript blob filename without link](https://stackoverflow.com/questions/19327749/javascript-blob-filename-without-link) — Anmol Mittal, Jun 05 '17 at 10:15
No, That approach is to download a file with some name, But here if you observe my question i am asking to replace the generated blob URL in the new tab with my custom name — Avinash Gupta, Jun 05 '17 at 10:19
I am receiving filename in header and data is the form of byteArray formart @Tigger — Avinash Gupta, Jun 05 '17 at 10:24
Short answer: **You can't.** See here why: https://stackoverflow.com/questions/41947735/custom-name-for-blob-url — Matteo Gaggiano, Jun 05 '17 at 10:45
Do you want to modify only the url in the address bar or something else ? E.g if you want to change the title of the opened page, you can always access it after you've opened it. If you want to control default browser's pdf-plugin's document's name when e.g using their download link, it gets a bit trickier. You can [do something for FF, but not really for chrome](https://stackoverflow.com/questions/44061354/set-the-default-save-as-name-for-a-an-embed-or-iframe-that-uses-a-blob/44061918#44061918), o you can use an custom pdf reader. — Kaiido, Jun 05 '17 at 12:48
And for the address bar, you could always return an page from your server that will only show an iframe set to the blobURI (might be a lot of work for not much though) — Kaiido, Jun 05 '17 at 12:48

score 2 · Answer 1 · answered Apr 12 '18 at 02:03

Not sure exactly where this code lives for you, but here is a solution using XmlHttpRequest "onload".

oReq.onload = function(e) {
if (this.status === 200) {
  const blob = new Blob([oReq.response], { type: "image/pdf"})
  let a = document.createElement("a");
  a.style = "display: none";
  document.body.appendChild(a);
  let url = window.URL.createObjectURL(blob);
  a.href = url;
  a.download = 'myFile.pdf'; // gives it a name via an a tag
  a.click();
  window.URL.revokeObjectURL(url);
} else {
  // handler error eee
}

}

Basically rather than $window.open(fileURL); you need to programmatically create a anchor tag, setting its href with the window.URL.createObjectURL as youve done above.

Hope this helps,

Matt

its downloading for me. I want pdf to open in new tab or window. Using chrome Version 102.0.5005.61 (Official Build) (arm64). — Ash, Jun 01 '22 at 12:58

Javascript display filename instead of blob name in the PDF URL

1 Answers1