WeChatミニプログラム公式顔認証の詳しい説明

WeChatミニプログラム公式顔認証の詳しい説明

ミニプログラムはユーザーの個人情報を収集してアップロードしましたが、拒否されました。

こんにちは、ミニプログラムページの機能には、ユーザーの生体認証(顔写真やビデオ)やその他の機密情報の収集、身元認識や識別などが含まれます。

ユーザーの機密性の高いプライバシー ID 情報を保護するために、プラットフォームは現在この機能をサポートしていません。関連する機能を削除して再度送信してください。

その後、百度で検索して、申請する必要があることを知りました

wx.start顔認識検証({})

https://api.weixin.qq.com/cgi-bin/token?appid=appid&secret=secret&grant_type=client_credential

https://api.weixin.qq.com/cityservice/face/identify/getinfo?access_token=access_token

https://api.weixin.qq.com/cityservice/face/identify/getimage?access_token=access_token

まず、申請したインターフェースに名前とID番号の2つのパラメータを送信する必要があります。

写真.js

データ: {
    オープンID: ''、
    custName: '名前',
    custIdCard: 'IDカード番号',
    検証画像: ''
  },
  /**
   * ライフサイクル機能 - ページの読み込みをリッスンする*/
  onLoad: 関数 (オプション) {
    this.setData({
      custName: オプション.custName、
      custIdCard: オプション.custIdCard
    });
    var _this = これ;
    wx.checkIsSupportFacialRecognition({
      チェックアライブタイプ: 2,
      成功: 関数 (res) {
        res.errCode === 0 || res.errMsg === "checkIsSupportFacialRecognition:ok") の場合 {
          //顔認識を呼び出す_this.startface(_this.data.custName.replace(/(^\s*)|(\s*)$/g, ""), _this.data.custIdCard); //ID カード名、ID カード番号が返されます。
        }
        wx.showToast('WeChatのバージョンが低すぎるため、この機能は一時的に使用できません。WeChatの最新バージョンにアップグレードしてください')
      },
      失敗: 関数(res){
        wx.showToast('WeChatのバージョンが低すぎるため、この機能は一時的に使用できません。WeChatの最新バージョンにアップグレードしてください')
      }

    })
  },
  スタートフェイス(名前、IDカード) {
    console.log('参加します!!!');
    var _this = これ;
    wx.start顔認識検証({
      name: _this.data.custName, //ID カード名 idCardNumber: _this.data.custIdCard, //ID カード番号 success: function (res) {
        var verifyResult = res.verifyResult; //認証結果 //インターフェースwx.request({を呼び出す
          URL: 'https://api.weixin.qq.com/cgi-bin/token?appid=wx2cafec51ec4c2153&secret=8d3e68a5a2c702673340d72d1c7db4cc&grant_type=client_credential',
          データ: {

          },
          メソッド: 'POST'、
          ヘッダー: {
            'コンテンツタイプ': 'application/json;charset=utf-8'
          },
          成功: 関数 (res) {
            コンソールにログ出力します。
            コンソールログ(res.data.access_token)
            var トークン = res.data.access_token;
            wx.リクエスト({
              url: 'https://api.weixin.qq.com/cityservice/face/identify/getinfo?access_token=' + res.data.access_token,
              データ: {
                verify_result: 検証結果
              },
              メソッド: 'POST'、
              ヘッダー: {
                'コンテンツタイプ': 'application/json;charset=utf-8'
              },
              成功: 関数 (res) {
                コンソールログ(res.data)
                console.log('やっと成功しました...')
                wx.リクエスト({
                  url: 'https://api.weixin.qq.com/cityservice/face/identify/getimage?access_token=' + トークン、
                  データ: {
                    verify_result: 検証結果
                  },
                  メソッド: 'POST'、
                  レスポンスタイプ: '配列バッファ',
                  ヘッダー: {
                    'コンテンツタイプ': 'application/json;charset=utf-8',
                  },
                  成功: (res) => {
                    // console.log('data:image/png;base64,'+wx.arrayBufferToBases64(res))

                    コンソールにログ出力します。
                    var base64 = wx.arrayBufferToBase64(res.data);
                    _this.setData({ verifyImg:'data:image/png;base64,'+base64})
                    wx.navigateTo({
                      url: '../msg/msg?msg=おめでとうございます。情報の確認が成功しました。&verifyImg=' + _this.data.verifyImg
                    });
                  },
                  失敗: 関数 (res) {
                    console.log('失敗', res.data)
                  }
                })

              },
              失敗: 関数 (res) {

              }
            })
          },
          失敗: 関数 (res) {

          }
        })



        コンソールログ(検証結果)
        // wx.navigateTo({
        // url: '../msg/msg?msg=顔認証に成功しました'
        // });
      },
      checkAliveType: 2, //画面が点滅します (顔認証のインタラクション モード、デフォルト 0、数字の読み取り)
      失敗: エラー => {
        wx.showToast('十分な明るさ​​を保ち、携帯電話を正面に向け、障害物がないようにしてください')
        wx.navigateTo({
          url: '../msg/msg?msg=十分な明るさ​​を保ち、携帯電話を正面から見て、障害物がないようにしてください。終了してもう一度お試しください。'
        });
      }
    })
  }

主な落とし穴は、インターフェースを複数回申請する必要があり、最終的なビジネスには依然としてユニオンIDが必要なので、WeChatオープンプラットフォームで認証を申請する必要があることです。

次に、検証結果の画像を取得するには、上記のhttps://api.weixin.qq.com/cityservice/face/identify/getimage?access_token=access_tokenが必要です。

返されたデータは、base64 コードに変換してから、イメージ タグに表示する必要があります。これをバックエンドに直接渡します。

以下は私のmsg jsコードです

メッセージ

const app = getApp();
ページ({

  /**
   * ページの初期データ */
  データ: {
    メッセージ:''、
    検証画像:''、
    url:app.globalData.PostData
  },

  /**
   * ライフサイクル機能 - ページの読み込みをリッスンする*/
  onLoad: 関数 (オプション) {
    var タイムスタンプ = Date.parse(new Date());
    タイムスタンプ = タイムスタンプ/1000
    console.log(オプション)
    var that = this;
    that.setData({
      メッセージ:オプション.msg​​、
      検証画像:オプション.検証画像
    });
    console.log(そのデータURL)
    console.log(that.data.verifyImg)
    
      wx.リクエスト({
        url: that.data.url+'fileUpload!upBase64.do', // 単なる例であり、実際のインターフェースではありません addressdata: {
          ファイル:that.data.verifyImg、
          ファイル名:タイムスタンプ、
          ファイルデータ:that.data.verifyImg
        },
        メソッド: 'POST'、
        ヘッダー: {
          'コンテンツタイプ': 'application/x-www-form-urlencoded;charset=utf-8'
        },
        成功:関数 (res){
          定数データ = res.data
          console.log('成功',データ);
          //何かをする
        },
       失敗:関数(res){
         console.log('失敗',res)
       }
        
      })
  }

バックグラウンドアップロードのbase64変換コード

パブリックボイドupBase64() {
         System.out.println("======写真のアップロードを開始します====");
         System.out.println(ファイル);
        Json j = 新しい Json();
        文字列 FilePath = ServletActionContext.getServletContext().getRealPath(Constants.IMGPATH+"/"+Constants.PHOTOPATH);  
        ファイルパスFile = new File(FilePath);
        試す {
            // IE の場合は text/html に設定する必要があります。そうでない場合は、ダウンロードのためにポップアップ ウィンドウが表示されます // response.setContentType("text/html;charset=UTF-8");
            レスポンス.setContentType("application/json;charset=UTF-8");

            文字列 FileName = request.getParameter("filename");
            文字列 FileData = request.getParameter("filedata");
            System.out.println(ファイル名+"***************"+ファイルデータ);
            if (null == FileData || FileData.length() < 50) {
                j.setMsg("アップロードに失敗しました。データが短すぎるか、存在しません");
                j.setSuccess(false);
            } それ以外 {
                // 先頭の不合理なデータを削除します FileData = FileData.substring(30);
                FileData = URLDecoder.decode(FileData, "UTF-8");
                System.out.println("FileData="+FileData);
                byte[]データ = FileUtil.decode(FileData);
                /* (null == FileName || FileName.length() < 1) の場合 {
                    ファイル名 = System.currentTimeMillis() + ".jpg";
                }*/
                // ファイルに書き込みます FileOutputStream outputStream = new FileOutputStream(new File(PathFile,FileName)); 
                出力ストリームにデータを書き込みます。 
                出力ストリームをフラッシュします。 
                出力ストリームを閉じます。 
                System.out.println(ファイル名+"***************"+ファイルデータ);
                j.setMsg("アップロードに成功しました");
                j.setSuccess(true);
            }
        } catch (例外エラー) {
            j.setMsg("アップロードに失敗しました");
            j.setSuccess(false);
            err.printStackTrace();
        }
        書き込みJson(j);
    }

以上がWeChatミニプログラムの公式顔認証の詳細な説明です。WeChatミニプログラムの公式顔認証の詳細については、123WORDPRESS.COMの他の関連記事に注目してください。

以下もご興味があるかもしれません:
  • WeChat アプレットの顔認識機能のコード例
  • WeChatアプレットが顔認識ログインのサンプルコードを実装
  • 顔認識機能を実装するミニプログラム(Baidu AI)
  • WeChatアプレットが顔検出機能を実装
  • WeChatアプレットが顔認識を実装
  • PHP が WeChat アプレットの顔認識ログイン機能を実装

<<:  MySQL パーティションテーブルの正しい使用方法

>>:  ファイアウォールの iptables 戦略を使用して Linux サーバー上のポートを転送する方法

推薦する

JSで画面録画機能を作成する

OBS studioかっこいいですが、 JavaScriptもっとかっこいいです。では、 JavaS...

Docker実践: Pythonアプリケーションのコンテナ化

1. はじめにコンテナはサンドボックス メカニズムを使用して相互に分離します。コンテナ内にデプロイさ...

mini-vueレンダリングのシンプルな実装

目次序文ターゲット最初のステップ:ステップ2:ステップ3:ステップ4:要約する序文現在主流のフレーム...

VMware は Centos7 システムの PXE+kickstart 無人インストールの詳細なプロセスを実装します

目次PXEはサーバーの無人バッチ展開を実装します1. PXEの概要1.1 PXEとは何か1.2 キッ...

Centos6.6 で php7 + nginx 環境をインストールする方法

この記事では、centos6.6 で php7 + nginx 環境をインストールする方法について説...

2時間のDocker入門チュートリアル

目次1.0 はじめに2.0 Dockerのインストール3.0基本的なDockerコマンド4.0 Do...

Dockerでホストファイルをカスタマイズする方法について簡単に説明します

目次1. コマンド2. docker-compose.yml 3. Dockerファイル4. 直接変...

Ubuntu 18.04 での Pycharm インストール チュートリアルの実装

方法1: Pycharmをダウンロードしてインストールするダウンロードアドレス: https://w...

HTML+CSS で div タグの右上隅に削除アイコンを追加するサンプルコード

1. 要件の説明Divタグの右上隅に削除アイコンを表示します2. 実装html、CSS 3. 参照コ...

TomcatをダウンロードしてLinuxにインストールする詳細な手順

Linux に触れたばかりの方には、この内容が役に立つかもしれません。Linux にしばらく触れてい...

CSS ポインターイベント属性の使用に関する詳細な説明

フロントエンド開発では、ユーザーと直接やり取りするため、ユーザーが操作がスムーズで快適だと感じ、ネイ...

JD.com フラッシュセール効果を実現する JavaScript

この記事では、JD.comのフラッシュセール効果を実現するためのJavaScriptの具体的なコード...

Vue3のいくつかの利点についての簡単な説明

目次1. ソースコード1.1 モノレポ1.2 タイプスクリプト2. パフォーマンス2.1 ソースコー...

共通要素のデフォルトのマージンとパディング値に関する議論

今日は、さまざまなブラウザでのデフォルト要素のマージン値が何であるかという問題について説明しました。...

Linux システムで jmeter を実行し、ローカル メモリを最適化する方法の詳細な説明

1. Linuxシステムにクロスシステムファイル転送ツールをインストールするルートユーザーのルートデ...