【JS端实现图片、视频时直接下载而不是打开预览】的更多相关文章

纯前端下载pdf链接文件,而不是打开预览的解决方案

纯前端下载pdf链接文件,而不是打开预览的解决方案 一,介绍与需求 1.1,介绍 XMLHttpRequest 用于在后台与服务器交换数据.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 问题:Chrome 会自动调用内置的 pdf 阅读器打开 1.2,需求 在谷歌(Chrome)浏览器中,使用a标签属性download下载pdf链接文件,如果是相同域时,可以直接下载;但是如果域不同,则不是下载,而是直接打开页面预览文件.但是需求是直接点击下载文件,而不是打开预览:以及下载后…

vue / js使用video获取视频时长

项目中遇到上传视频功能,需要有预览和获取视频时长功能,因之前使用upload(有需要的话可以参考下我之前的文章),这里就不赘述,直接用来上传视频,不过在上传之前和上传成功后的钩子里,获取不到时长: 没有时长怎么办呢,只能用原生JS来获取: 上传成功以后,将成功的路径绑定给video 使用js获取duration并赋给时间参数 这时你会发现,你得到的值是NaN 视频还未加载下来,无法同步获取到,使用定时器即可解决 OK了,现在可以获取到了 希望本文对你有所帮助!…

图片上传，支持同步/异步、预览（MVC、uploadify异步提交、js预览、ajaxSubmit异步提交）兼容大部分浏览器，含代码

图片上传代码,支持同步/异步和图片的预览 主要用了两种方式,可兼容大部分浏览器. 第一种使用uploadify异步上传,上传后返回图片路径显示到页面. 每二种使用ajaxSubmit异步上传,为兼容IE8 dataType使用text类型,json类型IE8会当作文件提示下载,不走回调函数.使用JS预览. 废话不多说,直接上代码了. testupload…

axios 下载文件流或者预览在线pdf

问题: 后端返回文件流,前端使用axios下载或者在线预览 下载文件流 import axios from 'axios' // 设置响应类型为blob axios.get('/api/app/xxx/downloadExcel', { responseType: 'blob' }).then(resp => { let temp = document.createElement('a') // 创建a标签 temp.download = 'excel.xls'// 设置下载名称 // 创建bl…

js实现图片选中马上显示功能，选择后可以预览，即选即显

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="file" onchange="show(this)"/> <img id="img" src=""&…

window.open在打开pdf时直接下载而不是查看

一般这是url请求的原因导致的, 可以考虑这种写法 window.open(link+'?response-content-type=application/pdf') 加上后面这段可以转为查看…

JS面向对象方法（二） 面向对象方法实现橱窗式图面预览以及放大功能

 效果图: HTML结构如下: <div id="preview"> <div id="mediumDiv"> <img id="mImg" src="images/products/product-s1-m.jpg"/> <div id="mask"></div> <div id="superMask"></…

有关谷歌下载PDF文件而不是直接打开预览的问题

找了很多帖子,都不行, 解决方法把链接处理成blob文件再调用下载. 但是仍然不行,最终原因找到: 缺少了这一部创建,需要把二进制数据重新用 Blob对象申明下 let data = new Blob([blob], { type: "application/pdf;charset=UTF-8", }); 下面是方法: // 下载 downloadFile(file) { let url = this.handleImg(file); this.getBlob(url).then((b…

利用vue-cropper做的关于图片裁剪、压缩、上传、预览等做的一个公共组件

公共组件: <template> <div> <div class="upload-box"> <div class="image-box" v-if="imageUrl" :style="{'background-image': 'url('+ imageUrl +')', 'height': imageHeight}"></div> <div class=&…

如何使 pdf 文件在浏览器里面直接下载而不是打开

前言 在做需求过程中我们大概率会遇到在浏览器中下载文件的需求,如果仅仅是这个要求的话很简单,有如下两种解决方式. 第一种是通过 window 对象的 open 方法进行操作,将文件 url 直接在浏览器中打开即可下载. window.open('url') 第二种是通过 a 标签,设置 href 为 url 值,点击 a 标签即可完成下载. <a href='url' download='文件名'></a> 但是上面两种文件下载方式都会存在一个问题,就是 pdf 文件会直接在浏览器…