window.URL.createObjectURL(blob) 生成的BLOB URL 如何自定义名称
时间: 2023-11-11 21:57:45 浏览: 75
您可以使用HTML5的download属性来指定BLOB URL的自定义名称。在创建BLOB URL后,您可以将其分配给链接的href属性,并设置download属性为所需的文件名。
例如,假设您有一个保存为BLOB的文件,并且希望将其命名为"myFile.txt",您可以使用以下代码:
```javascript
const blob = new Blob(["Hello, World!"], { type: "text/plain" });
const url = window.URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = "myFile.txt";
link.click();
```
这将创建一个名为"myFile.txt"的文件,并将其保存在用户的设备上。
相关问题
window.URL.createObjectURL(blob) 无法浏览
当使用window.URL.createObjectURL(blob)无法浏览时,这可能是因为在IE10和IE11中会报错"Error: 拒绝访问的"。这个问题可以通过以下解决方式来解决:
1. 首先,你可以使用以下代码来判断浏览器是否为IE,并在IE中使用其他方法来处理:
```javascript
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
// IE浏览器处理方式
window.navigator.msSaveOrOpenBlob(blob, file_name);
} else {
// 其他浏览器处理方式
var a = document.createElement('a');
document.body.appendChild(a);
a.style = 'display: none';
var url = window.URL.createObjectURL(blob);
a.href = url;
a.download = file_name;
a.click();
a.remove();
window.URL.revokeObjectURL(url);
}
```
2. 另外,需要注意的是,在使用window.URL.createObjectURL创建Blob链接时,IE和其他浏览器之间还存在区别。在IE中生成的blob链接是不带域名的,而在其他浏览器中是带域名的。 这可能导致在某些情况下无法浏览。因此,在处理这个问题时,需要考虑到不同浏览器的差异。
综上所述,当使用window.URL.createObjectURL(blob)无法浏览时,你可以根据浏览器类型来选择不同的处理方式,同时注意IE和其他浏览器之间的区别。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [ie浏览器 window.URL.createObjectURL Blob URL报错不兼容.](https://blog.csdn.net/sunxinshu/article/details/114990520)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *3* [window.URL.createObjectURL下载Blob文件及IE/Edge兼容](https://blog.csdn.net/kiscon/article/details/107136947)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
let url = window.URL.createObjectURL(blob)
引用\[2\]中提到,window.URL.createObjectURL()可以直接生成blob:开头的链接,该链接产生于浏览器端,不会占用服务器资源。而在引用\[3\]中的代码中,使用了window.URL.createObjectURL()来生成一个blob链接,并将该链接赋值给变量url。所以,问题中的代码"let url = window.URL.createObjectURL(blob)"的作用是生成一个blob链接,并将其赋值给变量url。
#### 引用[.reference_title]
- *1* [【post请求下载文件流】如何使用post请求下载文件流 blob](https://blog.csdn.net/jmszl1991/article/details/108771559)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* *3* [window.URL.createObjectURL Blob URL无法在Microsoft IE和Edge中打开](https://blog.csdn.net/u013131203/article/details/80894440)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]