• 微信公众号:美女很有趣。 工作之余,放松一下,关注即送10G+美女照片!

JS实现html页面点击下载文件

开发技术 开发技术 2小时前 2次浏览
  <a href="http://localhost:5001/b.html" download="123.html">点击下载</a>

这样当用户打开浏览器点击链接的时候就会直接下载文件。

直接点击可以下载,需要注意的是download属性,当不加download属性时,如果文件格式为txt、pdf、jpg等浏览器支持直接打开的文件格式,那么不会下载,而是浏览器直接打开;添加download属性之后,就会下载,并且下载文件默认命名为你download属性的值。

其中download后面的属性是下载后文件的文件名字

如果url指向同源资源,是正常的。

如果url指向第三方资源,download会失效,表现和不使用download时一致——浏览器能打开的文件,浏览器会直接打开,不能打开的文件,会直接下载。浏览器打开的文件,可以手动下载。

解决方案一:将文件打包为.zip/.rar等浏览器不能打开的文件下载。

解决方案二:通过后端转发,后端请求第三方资源,返回给前端,前端使用file-saver等工具保存文件。

服务器代码

const express = require('express');
const app = express();
// const http = require("http");
//设置跨域访问
// app.all('*', function(req, res, next) {
//     res.header("Access-Control-Allow-Origin", "*");
//     res.header("Access-Control-Allow-Headers", "X-Requested-With");
//     res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
//     res.header("X-Powered-By",' 3.2.1')
//     res.header("Content-Type", "application/json;charset=utf-8");
//     next();
// });

app.use('/',express.static('./static/'));

app.listen(5001,(port) => {
    console.log(`server listen 5002`);
});

  


程序员灯塔
转载请注明原文链接:JS实现html页面点击下载文件
喜欢 (0)