Commit c5de44dd2267ae3f62916d18134cdc9f4b05d399
1 parent
eaac5ac1
传参
Showing
1 changed file
with
27 additions
and
28 deletions
src/pages/test.vue
| ... | ... | @@ -3,10 +3,10 @@ |
| 3 | 3 | <div class="index"> |
| 4 | 4 | <div class="canvas" ref="canvas"> |
| 5 | 5 | <div class="avatar"> |
| 6 | - <img src="https://wjjtest.ys2.cnliveimg.com/shop/img/2019/12/31/5e0b06db22be5.jpg" alt=""> | |
| 6 | + <img :src="imgUrl" alt=""> | |
| 7 | 7 | </div> |
| 8 | 8 | <div> |
| 9 | - 杜致阳签名 | |
| 9 | + {{textInfo}} | |
| 10 | 10 | </div> |
| 11 | 11 | </div> |
| 12 | 12 | <div class="save_btn" @click="savecanvas"> |
| ... | ... | @@ -19,48 +19,47 @@ |
| 19 | 19 | export default { |
| 20 | 20 | data () { |
| 21 | 21 | return { |
| 22 | - imgUrlbase64:null | |
| 22 | + imgUrl:"https://wjjtest.ys2.cnliveimg.com/shop/img/2019/12/31/5e0b06db22be5.jpg", | |
| 23 | + textInfo:'哈哈哈' | |
| 23 | 24 | }; |
| 24 | 25 | }, |
| 25 | 26 | mounted(){ |
| 26 | 27 | }, |
| 27 | - // 直接获取图片url传给原生 | |
| 28 | - getimgUrl(imgData){ | |
| 29 | - // 调用原生方法 | |
| 30 | - // 调用分享（新方法） | |
| 31 | - if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler) { | |
| 32 | - // 获取URL图片 | |
| 33 | - window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler.postMessage({body: {imgData: imgData}}); | |
| 34 | - } else if (window.obj && window.obj.CNDSCheckAllowVisitPhotoAlbumHandler) { | |
| 35 | - // 获取URL图片 | |
| 36 | - window.obj.CNDSCheckAllowVisitPhotoAlbumHandler(imgData); | |
| 37 | - } | |
| 38 | - }, | |
| 39 | 28 | methods: { |
| 29 | + // 直接获取图片url传给原生 | |
| 30 | + getimgUrl(imgData){ | |
| 31 | + // 调用原生方法 | |
| 32 | + // 调用分享（新方法） | |
| 33 | + if (window.webkit && window.webkit.messageHandlers && window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler) { | |
| 34 | + // 获取URL图片 | |
| 35 | + window.webkit.messageHandlers.CNDSCheckAllowVisitPhotoAlbumHandler.postMessage({body: {"imgUrl": this.imgUrl,"textInfo": this.textInfo}}); | |
| 36 | + } else if (window.obj && window.obj.CNDSCheckAllowVisitPhotoAlbumHandler) { | |
| 37 | + // 获取URL图片 | |
| 38 | + window.obj.CNDSCheckAllowVisitPhotoAlbumHandler(JSON.stringify({"imgUrl": this.imgUrl,"textInfo": this.textInfo})); | |
| 39 | + } | |
| 40 | + }, | |
| 40 | 41 | savecanvas(){ |
| 42 | + if(this.isCNLive.value){ | |
| 43 | + this.getimgUrl() | |
| 44 | + return | |
| 45 | + } | |
| 41 | 46 | let canvas = document.querySelector('.canvas'); |
| 42 | 47 | let that = this; |
| 43 | 48 | html2canvas(canvas,{scale:2,logging:false,useCORS:true}).then(function(canvas) { |
| 44 | 49 | let type = 'png'; |
| 45 | 50 | let imgData = canvas.toDataURL(type); |
| 46 | 51 | // 照片格式处理 |
| 47 | - let _fixType = function(type) { | |
| 48 | - type = type.toLowerCase().replace(/jpg/i, 'jpeg'); | |
| 49 | - let r = type.match(/png|jpeg|bmp|gif/)[0]; | |
| 50 | - return 'image/' + r; | |
| 51 | - }; | |
| 52 | - imgData = imgData.replace(_fixType(type),''); | |
| 52 | +// let _fixType = function(type) { | |
| 53 | +// type = type.toLowerCase().replace(/jpg/i, 'jpeg'); | |
| 54 | +// let r = type.match(/png|jpeg|bmp|gif/)[0]; | |
| 55 | +// return 'image/' + r; | |
| 56 | +// }; | |
| 57 | +// imgData = imgData.replace(_fixType(type),''); | |
| 53 | 58 | let filename = "证书" + '.' + type; |
| 54 | - if(that.isCNLive){ | |
| 55 | - that.getimgUrl(imgData) | |
| 56 | - }else { | |
| 57 | - that.saveFile(imgData,filename); | |
| 58 | - } | |
| 59 | - | |
| 59 | + that.saveFile(imgData,filename); | |
| 60 | 60 | }); |
| 61 | 61 | }, |
| 62 | 62 | saveFile(data, filename){ |
| 63 | - debugger | |
| 64 | 63 | let save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a'); |
| 65 | 64 | save_link.href = data; |
| 66 | 65 | save_link.download = filename; | ... | ... |