uni-app(Android 、Ios、微信小程序)上傳圖片轉base64


 1       upload_zheng(type){
 2            uni.chooseImage({ 
 3                     count: 1,
 4                     success: res => {
 5                         console.log(res);
 6                         uni.showLoading({
 7                             title: '上傳中,請稍后。。。'
 8                         })
 9                         // this.tempFilePaths = res.tempFilePaths[0];
10                         // #ifdef MP-WEIXIN
11                         wx.getFileSystemManager().readFile({
12                             filePath: res.tempFilePaths[0], //選擇圖片返回的相對路徑
13                             encoding: "base64",//這個是很重要的
14                             success: res => { //成功的回調
15                                 //返回base64格式
16                                 console.log('data:image/png;base64,' + res.data)
17                                 if(type == 1){
18                                     this.form.idFrontImg ='data:image/jpeg;base64,' + res.data; //不加上這串字符,在頁面無法顯示
19                                 }else{
20                                     this.form.idBackImg ='data:image/jpeg;base64,' + res.data; //不加上這串字符,在頁面無法顯示
21                                 }
22                                 uni.hideLoading();
23                             }
24                         })
25                         // #endif
26                         // #ifdef APP-PLUS || H5
27                             this.os = plus.os.name;
28                             if(this.os == 'Android'){
29                                 this.urlTobase64(res.tempFilePaths[0], type);
30                             }else{
31                                 plus.io.resolveLocalFileSystemURL(res.tempFilePaths[0], (entry) => { 
32                                     entry.file((file) => { 
33                                         var reader = new plus.io.FileReader();
34                                         reader.readAsDataURL(file);//reader圖像預覽
35                                         reader.onloadend = (e) => { 
36                                             console.log(e.target.result)//能輸出base64即可復制請求了
37                                             if(type == 1){
38                                                 this.form.idFrontImg = e.target.result; //ios用的原生方法,不需要加
39                                             }else{
40                                                 this.form.idBackImg = e.target.result; //ios用的原生方法,不需要加
41                                             }
42                                             uni.hideLoading();
43                                         };
44                                     },
45                                     (e) =>  { 
46                                         console.log('error---', e)
47                                     });
48                                 });
49                             }
50                         // #endif
51                     }, fail(err) {
52                         console.log(err);
53                     }
54                 });
55             },
56             // 轉base64碼
57             urlTobase64(url, type) {
58                 uni.request({
59                     url: url,
60                     method: 'GET',
61                     responseType: 'arraybuffer',
62                     success: res => {
63                         let base64 = wx.arrayBufferToBase64(res.data); //把arraybuffer轉成base64
64                         if(type == 1){
65                             this.form.idFrontImg ='data:image/jpeg;base64,' + base64; //不加上這串字符,在頁面無法顯示
66                         }else{
67                             this.form.idBackImg ='data:image/jpeg;base64,' + base64; //不加上這串字符,在頁面無法顯示
68                         }
69                         // base64 = 'data:image/jpeg;base64,' + base64; //不加上這串字符,在頁面無法顯示
70                         uni.hideLoading();
71                         console.log(base64);
72                     }, fail(err) {
73                         console.log(err);
74                     }
75                 });
76             },

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM