ホームページ > WeChat アプレット > ミニプログラム開発 > ミニプログラムでbase64画像をアルバムに保存する方法の紹介

ミニプログラムでbase64画像をアルバムに保存する方法の紹介

不言
リリース: 2018-12-14 10:30:28
転載
5617 人が閲覧しました

この記事では、ミニ プログラムで Base64 画像をアルバムに保存する方法を紹介します。必要な方は参考にしていただければ幸いです。

1. 認可の取得

1. 関連する api
wx.getSetting
wx.authorize

2. 認可の取得プロセスは次のとおりです。 # # 権限があるかどうか—> 権限がない場合—> 同意する—> wx.opensetting を使用して、ユーザーを認証設定ページに誘導します)

3. コードの実装

static async weAuthCheck(type = 'address') {
    let resGetting = await new Promise((resolve, reject) => {
        wepy.getSetting({
            success: res => {
                // console.log(res, 'getsetting')
                if (res.authSetting.hasOwnProperty(`scope.${type}`) && res.authSetting[`scope.${type}`]) {
                    resolve({
                        succeeded: true
                    })
                } else {
                    wepy.authorize({
                        scope: `scope.${type}`,
                        success: () => {
                            resolve({
                                succeeded: true
                            })
                        },
                        fail: err => {
                            // console.log(err, 'errrrr')
                            resolve({
                                succeeded: false,
                                err: err
                            })
                        }
                    })
                }
            },
            fail: err => {
                resolve({
                    succeeded: false,
                    err: err
                })
            }
        })
    })
    console.log('getSetting res: \n', resGetting)
    return resGetting
}
ログイン後にコピー

2. 一時ファイルの書き込み

1.関連 API

ファイル システム

writeFile

2. パラメータ エンコーディングは、書き込まれるパラメータ データの形式を記述するために使用されます。これは、データがエンコーディング形式で書き込まれることを意味しません。ここでは、エンコードをbase64

3、コード実装

// 先获得一个实例  this.fileManager = wx.getFileSystemManager()
this.fileManager.writeFile({
    filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,
    data: data,
    encoding: 'base64',
    success: res => {
        console.log('res: \n:', res)
    },
    fail: res => {
        console.log(res)
    }
})
ログイン後にコピー

3として指定する必要があります。形式文字列

1、base64文字列の形式: "データ: image/png;base64,....."、カンマの前の段落は形式の説明で、後続のコンテンツ形式が Base64 形式で、画像形式が png であることを示すために使用されます。

2. 文字列全体を直接渡すと、保存はできますが、画像ファイル形式エラーが発生します。そこで、別の切断操作を実行します

let startIdx = this.qrcode.indexOf('base64,') + 7
ログイン後にコピー

4. 実装を完了します

async onTapSaveQrcode() {
    let startIdx = this.qrcode.indexOf('base64,') + 7
    let resCheck = await this.$weAuthCheck('writePhotosAlbum')
    let timestamp = new Date().getTime()
    let self = this
    if (resCheck.succeeded) {
        wepy.showLoading()
        this.fileManager.writeFile({
            filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,
            data: this.qrcode.slice(startIdx),
            encoding: 'base64',
            success: res => {
                console.log('res: \n:', res)
                wx.saveImageToPhotosAlbum({
                    filePath: `${wx.env.USER_DATA_PATH}/qrcode_${timestamp}.png`,
                    success: res => {
                        self.$emit('save-qrcode-success')
                        wepy.showToast({
                            title: '保存成功'
                        })
                    },
                    fail: err => {
                        console.log(err)
                        if (!err.errMsg.includes('cancel')) {
                            wepy.showToast({
                                title: err.errMsg,
                                icon: 'none'
                            })
                        }
                    },
                    complete: () => {
                        wepy.hideLoading()
                    }
                })
            },
            fail: res => {
                wepy.hideLoading()
                console.log(res)
            }
        })
    }
}
ログイン後にコピー

以上がミニプログラムでbase64画像をアルバムに保存する方法の紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート