html5 download & js <a href="https://www.w3schools.com/TAGS/at

download image & rename <a href="https://www.w3schools.com/TAG

download pdf & rename xgqfrms & download &amp

auto download images <a href="https://www.w3schools.com/TAGS/att_a

html5 download all in one <a href="https://www.cnblogs.com/xgqfrms

test <a href="https://www.lanqiao.cn/path

HTML5 download 执行条件同一个域名下的资源

HTML5 download Attribute <a href="https://davidwalsh.name/download

html5 download about html5 HOT 20 OPEN

xgqfrms commented on June 28, 2024

html5 download

from html5.

Comments (20)

xgqfrms commented on June 28, 2024

download image & rename

https://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml5_a_download

<!DOCTYPE html>
<html>
<body>

<p>Click on the w3schools logo to download the image:<p>

<a href="/images/myw3schoolsimage.jpg" download="xgqfrms">
  <img src="/images/myw3schoolsimage.jpg" alt="W3Schools" width="104" height="142">
</a>

<p><b>Note:</b> The download attribute is not supported in Edge version 12, IE, Safari 10 (and earlier), or Opera version 12 (and earlier).</p>

</body>
</html>

from html5.

xgqfrms commented on June 28, 2024

download pdf & rename

xgqfrms & download & pdf & rename

https://codepen.io/xgqfrms/full/GyEGzG/

https://stackoverflow.com/questions/3102226/how-to-set-name-of-file-downloaded-from-browser

from html5.

xgqfrms commented on June 28, 2024

https://www.cnblogs.com/xgqfrms/p/9920588.html

from html5.

xgqfrms commented on June 28, 2024

auto download images

https://www.w3schools.com/TAGS/att_a_download.asp

<p>Click on the image to download it:<p>

<a href="/images/myw3schoolsimage.jpg" download>
  img
</a>

from html5.

xgqfrms commented on June 28, 2024

auto download icons

from html5.

xgqfrms commented on June 28, 2024

auto download logos

from html5.

xgqfrms commented on June 28, 2024

html5 download all in one

https://www.cnblogs.com/xgqfrms/p/10082870.html

from html5.

xgqfrms commented on June 28, 2024

test

https://www.lanqiao.cn/paths/

from html5.

xgqfrms commented on June 28, 2024

HTML5 download 执行条件

同一个域名下的资源
http only
绝对路径/相对路径都可以

demo

https://cdn.xgqfrms.xyz/

https://cdn.xgqfrms.xyz/HTML5/auto-dwonload-images/index.html

跨域的第三方资源，会直接跳转到第三方资源连接
file:///Users/xgqfrms-mbp/Documents/GitHub/cdn/html5/download/image-auto-downloader.html 不好使，会直接打开连接

same origin

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download

https://caniuse.com/?search=download

https://stackoverflow.com/questions/49760160/a-download-attribute-not-working-anymore

from html5.

xgqfrms commented on June 28, 2024

HTML5 download Attribute

https://davidwalsh.name/download-attribute

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5

https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement/download

html5 download attribute not working

https://stackoverflow.com/questions/23872902/chrome-download-attribute-not-working/35290284

https://stackoverflow.com/questions/49760160/a-download-attribute-not-working-anymore

from html5.

xgqfrms commented on June 28, 2024

https://cdn.xgqfrms.xyz/HTML5/Blob/fetch/index.html
https://cdn.xgqfrms.xyz/HTML5/Blob/xhr/index.html
https://cdn.xgqfrms.xyz/HTML5/Blob/index.html

服务端控制是否可以下载 ???

https://cdn.xgqfrms.xyz/HTML5/auto-dwonload-images/index.html

https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

??? Node.js server return download file without extension filename

from html5.

xgqfrms commented on June 28, 2024

https://javascript.xgqfrms.xyz/

preivew url

https://cdn.xgqfrms.xyz/offical-docs/ECMA/ECMA-262%206th%20edition%20June%202015.pdf
https://cdn.xgqfrms.xyz/offical-docs/ECMA/ECMA-262%207th%20edition%20June%202016.pdf

download raw

https://raw.githubusercontent.com/xgqfrms/cdn/gh-pages/offical-docs/ECMA/ECMA-262%206th%20edition%20June%202015.pdf

from html5.

xgqfrms commented on June 28, 2024

Linux bash script 批量下载文件 All In One

preview

https://cs193p.sites.stanford.edu/sites/g/files/sbiybj16636/files/media/file/l1.pdf

??? download === write file stream

#!/bin/bash

# 下载目录
downdir="/Users/xgqfrms-mbp/Documents/swift-ui/Memorize/000-xyz/pdfs/"

# 读取文件
cat $1 | while read line
do
  echo "$line"
  cd $downdir
  str=$line
  # 按行分割，每行一个
  array=(${str//;/ })
  echo "$array"
  url=${array[0]}
  filename=$(echo ${array[1]} | tr -d '\r')
  # filename=$(echo "l" + ${index} + ".pdf" | tr -d '\r')
  # filename=$(echo "l${index}.pdf" | tr -d '\r')
  # 执行下载
  curl $url -o $filename
done

# chomd +x ./auto-download-pdfs.sh
# mkdir pdfs
# bash ./auto-download-pdfs.sh cs193p.txt

https://www.cnblogs.com/xgqfrms/p/16073509.html

作者：xgqfrms
链接：https://www.cnblogs.com/xgqfrms/p/16086580.html
来源：https://www.cnblogs.com
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
©xgqfrms 2012-2022
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

from html5.

xgqfrms commented on June 28, 2024

Node.js download remote cdn URL file

https://www.npmjs.com/package/request

fetch api ???

const fs = require("fs");
var path = require("path");
const { exit } = require("process");
const log = console.log;
const request = require("request");
// const request = require("request-promise-native");

var folder = path.resolve(__dirname, '../pdf');

// log('folder', folder);

if (!fs.existsSync(folder)) {
  fs.mkdirSync(folder);
}


async function downloadPDF(url, filename) {
  log('🚧 pdf downloading ...');
  const pdfBuffer = await request.get({
    uri: url,
    encoding: null,
    // encoding: 'utf-8',
  });

   // write 下载文件 ✅ ??? Node.js 控制浏览器，下载文件还是打开预览文件 ??? 
  fs.writeFileSync(filename, pdfBuffer);
  log('✅ pdf finished!');
  // exit 0;
}

const url = 'https://cs193p.sites.stanford.edu/sites/g/files/sbiybj16636/files/media/file/l1.pdf';
const filename = folder + '/cs193p-2021-l1.pdf';


// log('filename =', filename);

downloadPDF(url, filename);

fs.writeFileSync(filename, pdfBuffer); write 下载文件 ✅ ??? Node.js 控制浏览器，下载文件还是打开预览文件 ???

from html5.

xgqfrms commented on June 28, 2024

attachment

var express=require("express")
var app=express();
var fs = require('fs');
var path=require("path");
app.get("/upload",function(req,res){
    var filePath = path.join(__dirname, './');
    console.log(filePath)
    fs.readFile(filePath+"images/2010191.png", function(err, data){
        res.set({
            'Content-Type': 'application/octet-stream', 
             //告诉浏览器这是一个二进制文件
            'Content-Disposition': 'attachment; filename=upload.png' ,
             //告诉浏览器这是一个附件要下载是png图片
        });
        res.end(data);
    });
})

app.listen(3000, function(){
    console.log("server is running", 3000);
});

from html5.

xgqfrms commented on June 28, 2024

Content-Disposition 内容处置

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Content-Disposition

在常规的 HTTP 应答中，Content-Disposition 响应头指示回复的内容该以何种形式展示，是以内联的形式（即网页或者页面的一部分），还是以附件的形式下载并保存到本地。

from html5.

xgqfrms commented on June 28, 2024

Node.js 服务器控制浏览器下载文件还是预览文件 All In One

作者：xgqfrms
链接：https://www.cnblogs.com/xgqfrms/p/16155131.html
来源：https://www.cnblogs.com
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
©xgqfrms 2012-2022
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

from html5.

xgqfrms commented on June 28, 2024

HTTP response status code & 206 Partial Content All In One

作者：xgqfrms
链接：https://www.cnblogs.com/xgqfrms/p/16155289.html
来源：https://www.cnblogs.com
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
©xgqfrms 2012-2022
www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

from html5.

xgqfrms commented on June 28, 2024

HTML5 download 执行条件

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download

download normal file

https://stackoverflow.com/questions/3102226/how-to-set-name-of-file-downloaded-from-browser/48064008#48064008

download blob file

https://stackoverflow.com/questions/71686536/how-to-set-the-download-file-extension-for-blob-data/71895888#71895888

#11

from html5.

xgqfrms commented on June 28, 2024

just need to use HTML5 `a` tag `download` attribute

`codepen` live demo

https://codepen.io/xgqfrms/full/GyEGzG/

my screen shortcut.

update answer

whether a file is downloadable depends on the server's response config, such as Content-Type, Content-Disposition;
download file's extensions are optional, depending on the server's config, too.

'Content-Type': 'application/octet-stream',
// it means unknown binary file,
// browsers usually don't execute it, or even ask if it should be executed.

'Content-Disposition': `attachment; filename=server_filename.filetype`,
// if the header specifies a filename,
// it takes priority over a filename specified in the download attribute.

download `blob` url file

    function generatorBlobVideo(url, type, dom, link) {
      var xhr = new XMLHttpRequest();
      xhr.open('GET', url);
      xhr.responseType = 'arraybuffer';
      xhr.onload = function(res) {
        // console.log('res =', res);
        var blob = new Blob(
          [xhr.response],
          {'type' : type},
        );
        // create blob url
        var urlBlob = URL.createObjectURL(blob);
        dom.src = urlBlob;
        // download file using `a` tag
        link.href = urlBlob;
      };
      xhr.send();
    }

    (function() {
      var type = 'image/png';
      var url = 'https://cdn.xgqfrms.xyz/logo/icon.png';
      var dom = document.querySelector('#img');
      var link = document.querySelector('#img-link');
      generatorBlobVideo(url, type, dom, link);
    })();

https://cdn.xgqfrms.xyz/HTML5/Blob/index.html

refs

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#download

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types#important_mime_types_for_web_developers

from html5.

Comments (20)

download image & rename

download pdf & rename

auto download images

auto download icons

auto download logos

html5 download all in one

HTML5 download 执行条件

demo

same origin

HTML5 download Attribute

Linux bash script 批量下载文件 All In One

Node.js download remote cdn URL file

attachment

Node.js 服务器控制浏览器下载文件还是预览文件 All In One

HTTP response status code & 206 Partial Content All In One

HTML5 download 执行条件

just need to use HTML5 a tag download attribute

codepen live demo

update answer

download blob url file

refs

Related Issues (17)

Recommend Projects

Recommend Topics

Recommend Org

Jobs

just need to use HTML5 `a` tag `download` attribute

`codepen` live demo

download `blob` url file