使用iframe实现pdf文件预览功能

　　data () {

　　return {

　　url: '',

　　}

　　},

　　methods: {

　　downLoadFileImg (fileUrl, fileName) {// 后端文件地址和名称

　　// 可下载，名称也有效 -- 推荐

　　const x = new window.XMLHttpRequest()

　　x.open('GET', fileUrl, true)

　　x.responseType = 'blob' // 选择返回格式为blob --- 一般后端返回的是看不懂的文件流 故需要转成blob

　　x.onload = () => {

　　this.url = window.URL.createObjectURL(x.response) //将后端返回的blob文件读取出url

　　console.log('blob====',x.response) //Blob {size: 38617, type: 'application/pdf'}

　　console.log('url====',this.url) //blob:http://localhost:7197/cb047277-e5e6-4905-bf8c-dbecd86a0105

　　// url可以预览和下载------如果想要下载就把下方注释打开即可

　　// const a = document.createElement('a')

　　// a.href = this.url

　　// a.download = fileName

　　// a.click()

　　}

　　x.send()

　　// // 或者下方的方式

　　// axios({

　　// url: G_CGI_PHP.superOrder.upfile + "?id=" + this.rowData.id,

　　// method: 'get',

　　// timeout: 100000,

　　// responseType: 'blob',

　　// headers: {

　　// // "type": 'application/pdf'

　　// },

　　// }).then(res => {

　　// console.log('res.data', res.data)

　　// this.url = window.URL.createObjectURL(res.data) //将后端返回的blob文件读取出url

　　// console.log('通过读取blob文件得到url地址===', this.url)

　　// }).catch(error => {

　　// console.log(error)

　　// })

　　},

　　}