zoukankan      html  css  js  c++  java
  • JS 下载指定网址URL资源(文件,图片)

    /**
     * 获取 blob
     * @param  {String} url 目标文件地址
     * @return {Promise} 
     */
    function getBlob(url) {
        return new Promise(resolve => {
            const xhr = new XMLHttpRequest();
    
            xhr.open('GET', url, true);
            xhr.setRequestHeader('Access-Control-Allow-Origin','*');
            xhr.responseType = 'blob';
            xhr.onload = () => {
                if (xhr.status === 200) {
                    resolve(xhr.response);
                }
            };
    
            xhr.send();
        });
    }
    
    /**
     * 保存
     * @param  {Blob} blob     
     * @param  {String} filename 想要保存的文件名称
     */
    function saveAs(blob, filename) {
        if (window.navigator.msSaveOrOpenBlob) {
            navigator.msSaveBlob(blob, filename);
        } else {
            const link = document.createElement('a');
            const body = document.querySelector('body');
    
            link.href = window.URL.createObjectURL(blob);
            link.download = filename;
    
            // fix Firefox
            link.style.display = 'none';
            body.appendChild(link);
            
            link.click();
            body.removeChild(link);
    
            window.URL.revokeObjectURL(link.href);
        }
    }
    
    /**
     * 下载
     * @param  {String} url 目标文件地址
     * @param  {String} filename 想要保存的文件名称
     */
    function download(url, filename) {
        getBlob(url).then(blob => {
            saveAs(blob, filename);
        });
    }
    download('http://11.0.1.178:8020/EIP/AssetsOA/css/images/oa_sign_icon.png', 'jjdl.png');

    被下载的资源,服务器需要允许跨跨域请求。

  • 相关阅读:
    1.8新特性
    线程池
    微服务简介
    缓存三大问题
    Redis分布式锁的正确实现方式
    【java-10&11&12】java语言(Hello World相关)
    【postman】postman 安装失败
    【java-04-09集】JDK的下载和安装&配置环境变量(临时和永久)&命令行方式
    【ISTQB】TM&TA&TTA区别
    【git】学习地址
  • 原文地址:https://www.cnblogs.com/johnjackson/p/14280631.html
Copyright © 2011-2022 走看看