この記事では、参照用のJS WeChatインターフェイスの詳細なバージョンを共有しました。特定のコンテンツは次のとおりです
基本的な指示
使用する手順
1. JSファイルを紹介します
JSインターフェイス(サポートhttps)を呼び出す必要があるページに次のJSファイルを紹介します:http://res.wx.qq.com/open/js/jweixin-1.0.0.js
注:AMD/CMD標準モジュールの読み込み方法を使用したロードをサポートします
2。configインターフェイスを挿入して構成します
JSSDKを使用する必要があるすべてのページは、最初に構成情報を挿入する必要があります。そうしないと、呼び出されません(同じURLを1回だけ呼び出す必要があり、URLを変更するSPAのWebアプリは、URLが変更されるたびに呼び出すことができます)。
wx.config({debug:true、//デバッグモードをオンにすると、呼び出されたすべてのAPIの返品値がクライアントにアラートされます。渡されたパラメーターを表示するには、パラメーター情報がログを介して印刷され、PC側にのみ印刷されます。 noncestr: ''、//必要な署名署名のために生成されたランダム文字列: ''、// signatureは付録1 jsapilist:[] //必要なJSインターフェイスのリスト、およびすべてのJSインターフェイスを付録2にリストします);3.準備が整ったインターフェイスを確認します
wx.ready(function(){//設定情報が検証された後、準備ができたメソッドが実行されます。すべてのインターフェイスコールは結果を取得した後に取得する必要があります。構成はクライアントの非同期操作です。したがって、関連するインターフェイスを呼び出す必要がある場合、関連するインターフェイスは、正しい機能を確保するために、適切な機能を確保する必要があります。直接、そして準備が整った機能に配置する必要はありません。4.検証失敗したエラーインターフェイス
wx.error(function(res){//設定情報が検証に失敗した場合、エラー関数が実行されます。署名が失効すると、特定のエラーメッセージのデバッグモードを開くか、返されたresパラメーターで表示できます。インターフェイスコール命令
すべてのインターフェイスは、WXオブジェクトを介して呼び出されます(JWeixinオブジェクトでも使用できます)。パラメーターはオブジェクトです。各インターフェイス自体が渡す必要があるパラメーターに加えて、次の一般的なパラメーターもあります。
1。成功:インターフェイスが正常に呼び出されたときに実行されるコールバック関数。
2。失敗:インターフェイスコールが失敗したときに実行されるコールバック関数。
3.完了:インターフェイスコールが完了したときに実行されるコールバック関数は、成功や失敗に関係なく実行されます。
4。キャンセル:ユーザーがクリックしてキャンセルすると、コールバック関数がキャンセルされたAPIのみがキャンセルされます。操作が使用されます。
5。トリガー:メニューでボタンをクリックしたときにトリガーを聴くメソッド。このメソッドは、メニューの関連インターフェイスのみをサポートします。
上記の関数にはすべて、各インターフェイス自体によって返されるデータに加えて、パラメーター、タイプオブジェクトがありますが、その値形式は次のとおりです。
1.コールが成功したとき: "xxx:ok"、xxxは呼び出しのインターフェイス名です
2。ユーザーがキャンセルするとき: "xxx:cancel"、xxxは呼び出されたインターフェイス名です
3。呼び出しが失敗した場合:その値は特定のエラーメッセージです
基本的なインターフェイス
現在のクライアントバージョンが指定されたJSインターフェイスをサポートするかどうかを判断します
wx.Checkjsapi({jsapilist:['choodimage'] //検出する必要があるjsインターフェイスのリスト、すべてのJSインターフェイスは付録2にリストされています。 {"checkResult":{"choodimage":true}、 "errmsg": "checkjsapi:ok"}});インターフェイスの共有
[モーメントへの共有]ボタンのクリックステータスを取得し、共有コンテンツインターフェイスをカスタマイズします
wx.onmenusharetimeline({title: ''、// title link: ''、// share link imgurl: ''、// share icon success:function(){//ユーザーが共有を確認した後に実行されるコールバック関数}、cancel:cancel:{// callback function exected exedueded reagned「友達への共有」ボタンのクリックステータスを取得し、共有コンテンツインターフェイスをカスタマイズします
wx.onmenushareappmessage({title: ''、// share title desc: '': ''、//共有説明リンク: ''、 ''、 ''、//共有アイコンタイプ: ''、//共有タイプ、音楽、ビデオ、またはリンク、デフォルトのリンクダトアウルズ: '' '' '' '' 'sublation in exting on exect in exed ed exed ed ext in ext in exed ex a subles //ユーザーが共有を確認した後に実行されるコールバック関数}、cancel:function(){//ユーザーが共有をキャンセルした後に実行されたコールバック関数}});「qqへの共有」ボタンのクリックステータスを取得し、共有コンテンツインターフェイスをカスタマイズします
wx.onmenushareqq({title: ''、// share title desc: ''、//共有説明リンク: ''、//リンクimgurl: '' // ICON成功:function(){//ユーザーが共有を確認した後}、cancel:function(){// callback recarine cancels the cancels the cancels the cancels cancels cancel「tencent weiboへの共有」ボタンのクリックステータスを取得し、共有コンテンツインターフェイスをカスタマイズします
wx.onmenushareweibo({title: ''、// share title desc: ''、//共有説明リンク: ''、//リンクimgurl: '' // share icon success:function(){//ユーザーが共有を確認した後}、cancel:function(){// cally()画像インターフェイス
写真を撮るか、携帯電話アルバムインターフェイスから写真を選択してください
wx.chooseimage({success:function(res){var localids = res.localids; //選択した写真のローカルIDリストを返します。ローカリッドは、imgタグのsrc属性として写真を表示できます}});プレビュー画像インターフェイス
wx.previewimage({current: ''、//現在表示されている画像リンクurls:[] //プレビューする必要がある画像リンクのリスト});画像インターフェイスをアップロードします
wx.uploadimage({locialid: ''、//アップロードする画像のローカルIDは、shoceimageインターフェイスから取得されます。isshowprogsresstips:1 //デフォルトは1、および進行状況プロンプトは成功(res){var serverid = res.serverid;注:マルチメディアファイルインターフェイスを使用して、WeChatによってアップロードされた画像をダウンロードできます。ここで取得したServerIDはmedia_idです。参照文書../ 12/58BFCFABBD501C7CD77C19BD9CFA8354.HTML
画像インターフェイスをダウンロードします
wx.downloadImage({serverId: ''、// uploadimageインターフェイスから取得される画像のサーバー側IDは、IsshowProgsresstips:1 //デフォルトが成功し、function(res){var localid = res.localid;オーディオインターフェイス
インターフェイスの記録を開始します
wx.startrecord();
インターフェイスの記録を停止します
wx.StopRecord({success:function(res){var locialid = res.localid;}});録音を監視するための自動停止インターフェイス
wx.onvoicerecordend({//記録時間が1分を超えて停止しないときに完全なコールバックが実行されます。完全:function(res){var locialid = res.localid;}});音声インターフェイスを再生します
wx.playvoice({localid: '' //再生されるオーディオのローカルID、stoprecordインターフェイスで取得});再生インターフェイスを一時停止します
wx.pausevoice({locialid: '' //停止する必要があるオーディオのローカルID、stoprecordインターフェイスによって取得});再生インターフェイスを停止します
wx.stopvoice({locialid: '' //停止する必要があるオーディオのローカルID、stoprecordインターフェイスで取得});音声再生インターフェイスの監視
wx.onvoiceplayend({serverId: ''、//ダウンロードする必要があるオーディオのサーバー側ID、成功を取得:function(res){var locialid = res.localid; //オーディオのローカルIDを返す}});音声インターフェイスをアップロードします
wx.uploadvoice({locialid: ''、//アップロードする必要があるオーディオのローカルID、stoprecordインターフェイスから取得されたisshowprogresstips:1 //デフォルトは1です。注:WeChatのマルチメディアファイルインターフェイスによってアップロードされた音声をダウンロードできます。ここで取得したServerIDはmedia_idです。参照文書../ 12/58BFCFABBD501C7CD77C19BD9CFA8354.HTML
音声インターフェイスをダウンロードします
wx.downloadvoice({serverId: ''、// uploadvoiceインターフェイスから取得したダウンロードする必要があるオーディオのサーバー側ID:1 //デフォルトは1であり、function(res){res){var locialid = res.localid; //インテリジェントインターフェイス
オーディオを特定し、認識結果インターフェイスに戻ります
wx.translatevoice({locialid: ''、//認識する必要があるオーディオのローカルID、isshowprogresstips:1、//デフォルトは1であり、進行状況プロンプトの成功:function(res){alert(res.translateresult); //音声認識の結果}});機器情報
ネットワークステータスインターフェイスを取得します
wx.getnetworkType({success:function(res){var networkType = res.NetWorkType; //ネットワークタイプ2G、3G、4G、WiFi}});地理的位置
WeChatの組み込みマップを使用して、ロケーションインターフェイスを表示します
wx.openlocation({latitude:0、// latitude、floating point number、範囲は90〜 -90経度:0、経度、浮動小数点数、範囲は180〜 -180。表示位置インターフェイスの下部で、クリックしてジャンプすることができます});ジオロケーションインターフェイスを取得します
wx.getLocation({ティムスタンプ:0、//位置署名タイムスタンプ、提供されていないリンダム文字列は、バージョン6.0.2、addrsign: ''、//位置署名、バージョン6.0.2と互換性がある場合にのみ提供される場合にのみ署名ランダム文字列を位置付けます。 〜90 var latitude。インターフェイス操作
メニューインターフェイスwx.hideoptionmenu()を右上隅に非表示にします。
右上隅にメニューインターフェイスwx.showoptionmenu()を表示します。
現在のWebウィンドウインターフェイスwx.CloseWindow()を閉じます。
バッチ非表示関数ボタンインターフェイス
wx.hidemenuitems({menulist:[] //メニュー項目を非表示にするには、付録3を参照}を参照);バッチ表示関数ボタンインターフェイス
wx.showmenuitems({menulist:[] //表示するすべてのメニュー項目は、付録3に示されています});すべての非ベースボタンインターフェイスwx.hideallnonbasemenuitem()を非表示にします。
すべての機能ボタンインターフェイスwx.showallnonbasemenuitem()を表示します。
WeChatをスキャンします
WeChatスキャンインターフェイスをクリックします
wx.scanqrcode({desc: 'scanqrcode desc'、needresult:0、//デフォルトは0、スキャン結果はwechatによって処理され、1はスキャン結果を直接返します。 Res.ResultStr;収穫住所
配信アドレスインターフェイスを編集します
wx.editaddress(タイムスタンプ:0、//ロケーション署名タイムスタンプ、バージョン6.0.2、非cestr: ''、//ロケーション署名ランダムな文字列、バージョン6.0.2と互換性がある場合のみ、addrsign: '' '、// signature see bisteb.2、suckens easing 4、sucess easing seics seing。 username resname name var telnumber第3レベルのアドレスvarアドレス= Res.Address;
最寄りの配信アドレスインターフェイスを取得します
wx.getlateStaddress({Timestamp:0、//場所の署名タイムスタンプ、バージョン6.0.2、非cestr: ''、// signatureランダム文字var username標準配信アドレスVARアドレス= Res.Address;wechatストア
WeChat製品ページインターフェイスにジャンプします
wx.openproductspecificview({productid: ''、// crowt idviewtype: '' // 0。デフォルト値、通常の製品の詳細ページ1。製品の詳細をスキャンするページ2。WeChatカードクーポン
ストアのカードクーポンのリストをリリースし、ユーザー選択リストを取得します
wx.choosecard({shopid: ''、// store id cardtype: ''、//カードタイプCardid: ''、//カードIDタイムスタンプ:0、//カードIDタイムスタンプ: ''、//カードバウチャー署名ランダムな文字列カードユーザーが選択したカードバウチャーリスト情報}});バッチにカードクーポンインターフェイスを追加します
wx.addcard({cardlist:[{cardid: ''、cardext: ''}]、//追加する必要があるカードクーポンリスト:function(res){var cardlist = res.cardlist; //カードクーポンリスト情報}});WeChatカードパッケージのカードクーポンインターフェイスを確認してください
wx.opencard({cardlist:[{cardid: ''、code: ''}] //開かれるカードクーポンのリスト});Wechatの支払い
WeChatの支払いリクエストを開始します
wx.choosewxpay({timestamp:0、//支払い署名タイムスタンプ非cestr: ''、//支払い署名ランダム文字列パッケージ: ''、//注文詳細は拡張文字列、付録5、給与: ''、//支払い署名は詳細、付録5}を参照してください。付録1 -JSSDK許可署名アルゴリズム
jsapi_ticket
署名を生成する前に、最初にJSAPI_Ticketを理解する必要があります。 JSAPI_Ticketは、WeChat JSインターフェイスを呼び出すために公式アカウントで使用される一時的なチケットです。通常の状況では、JSAPI_Ticketの有効期間は7200秒で、Access_Tokenから取得されます。 JSAPI_TICKETを取得するためのAPI呼び出しの数は非常に限られているため、JSAPI_TICKETの頻繁な更新により、API呼び出しが制限され、自分のビジネスに影響を与えます。開発者は、サービスでJSAPI_Ticketをグローバルにキャッシュする必要があります。
1. Access_Tokenを取得するには、次のドキュメントを参照してください(7200秒間有効です。開発者はサービスでグローバルにアクセスをキャッシュする必要があります):../12/4B08382E912176877730A2DFC71E9218C.HTML
2。最初のステップで取得したAccess_Tokenを使用してJSAPI_TICKET(7200秒間有効で、開発者は彼のサービスでjsapi_ticketをグローバルにキャッシュする必要があります):https://api.weixin.q.com/cgi-bin/ticket/getticketet
次のJSONを正常に返します。
{"errcode":0、 "errmsg": "ok"、 "ticket": "bxldikrxvbtpdhsm05e5u5suoxnkd8-41zo3mhkoyn5ofkwitdggnr2fwj0m9e8nyzwkvzvzvdvdvtaugwvsdshfka" "" "": "JSAPI_Ticketを取得した後、JSSDK許可確認の署名を生成できます。
署名アルゴリズム
署名の生成ルールは次のとおりです。署名に参加するフィールドには、非cestr(ランダム文字列)、有効なJSAPI_TICKET、タイムスタンプ(タイムスタンプ)、URL(現在のWebページのURL、#とその後のパーツを含まない)が含まれます。フィールド名のASCIIコードに従って、すべてのパラメーターを小から大部分から大部分(辞書順序)に並べ替えた後、URLキー値ペアの形式(つまり、key1 = value1&key2 = value2…)を使用して文字列弦1にスプライスします。ここでは、すべてのパラメーター名が小文字であることに注意する必要があります。 String1は暗号化され、フィールド名とフィールド値は元の値であり、URLエスケープは実行されません。
つまり、signature = sha1(string1)です。例:
•noncestr = wm3wzytpz0wzccnw
•JSAPI_TICKET = SM4AOVDWFPE4DXKXGES8VMCPGGVI4C3VM0P37WVUCFVKVAY_90U5H9NBSLYY3-SL-HHTDFL2FZFY1AOCHKP7QG
•タイムスタンプ= 1414587457
•url = http://mp.weixin.qq.com
ステップ1。フィールド名のASCIIコードに従って小から大部分に署名するすべてのパラメーターを並べ替えた後、URL key-valueペアの形式(つまり、key1 = value1&key2 = value2…)の形式を使用してstring1にstring1にスプライスします。
JSAPI_TICKET = SM4AOVDWFPE4DXKXGES8VMCPGGVI4C3VM0P37WVUCFVKVAY_90U5H9NBSLYY3-SL-HHTDFL 2FZFY1AOCHKP7QG&NONCESTR = WM3WZYTPZ0WZCCNW×TAMP = 1414587457&url = http://mp.weixin.qq.com
ステップ2。SHA1でString1に署名し、署名を取得します。
F4D90DAF4B3BCA3078AB155816175BA34C443A7B
注意すべきこと
1.署名に使用される非網とタイムスタンプは、WX.Configの非cestrとタイムスタンプと同じでなければなりません。
2。署名に使用されるURLは、JSインターフェイスを呼び出すページの完全なURLでなければなりません。
3。セキュリティ上の理由から、開発者はサーバー側に署名ロジックを実装する必要があります。
付録2-すべてのJSインターフェイスのリスト
•onMenusharetimeline
•onmenushareappmessage
•onmenushareqq
•onMenushareweibo
•Startrecord
•stoprecord
•onvoicerecordend
•PlayVoice
•Pasevoice
•停止
•onvoiceplayend
•uploadvoice
•downloadvoice
•imageを選択します
•プレビューイメージ
•uploadImage
•downloadimage
•TranslateVoice
•getNetWorkType
•openlocation
•getLocation
•Hideoptionmenu
•showoptionmenu
•hidemenuitems
•showmenuitems
•Hideallnonbasemenuitem
•showallnonbasemenuitem
•CloseWindow
•scanqrcode
•chookwxpay
•getLateStAddress
•EditAddress
•OpenProductSpecificView
•CARDを追加します
•ChooseCard
•OpenCard
付録3-すべてのボタンのリスト
基本的なカテゴリ
•レポート:「Menuitem:ExposeArticle」
•フォントを調整する:「menuitem:setfont」
•昼間のモード:「Menuitem:DayMode」
•ナイトモード:「Menuitem:Nightmode」
•リフレッシュ:「Menuitem:リフレッシュ」
•公式アカウントを表示(追加):「Menuitem:プロファイル」
•公式アカウントを表示(追加されていない):「Menuitem:AddContact」
通信カテゴリ
•友人に送る:「menuitem:share:appmessage」
•瞬間に共有:「Menuitem:Share:Timeline」
•QQに共有:「Menuitem:Share:QQ」
•weiboに共有:「menuitem:share:weiboapp」
•コレクション:「Menuitem:お気に入り」
•FBに共有:「Menuitem:Share:Facebook」
保護クラス
•デバッグ:「Menuitem:JSDebug」
•タグの編集:「Menuitem:Edittag」
•削除: "menuitem:delete"
•リンクのコピー:「Menuitem:copyurl」
•オリジナルのWebページ:「Menuitem:OriginPage」
•読みモード:「Menuitem:ReadMode」
•QQブラウザで開く:「menuitem:openwithqqbrowser」
•Safariで開く:「Menuitem:OpenWithSafari」
•電子メール:「Menuitem:共有:電子メール」
•いくつかの特別な公開アカウント:「Menuitem:Share:Brand」
付録4-場所と住所の署名生成アルゴリズム
AddRSignの生成ルールは、JSSDK許可検証のルールと同じです(付録1を参照)が、参加署名パラメーターは異なります。 AddRSignに参加する署名パラメーターは、Appid、URL(現在のWeb URL)、タイムスタンプ、非cestr、Accesseoken(ユーザー認証資格情報)です。
付録5-支払い拡張フィールドと署名生成アルゴリズム
注文詳細(パッケージ)拡張文字列の定義
マーチャントがJS APIをリダイレクトする場合、商人はこの時点で注文の詳細を決定し、注文の詳細を特定の方法でパッケージに組み合わせる必要があります。 JS APIが呼び出された後、WeChatはパッケージのコンテンツを通じて前払い注文を生成します。以下は、パッケージに必要なフィールドリストと署名方法を定義します。インターフェイスに注意する必要があります:すべての着信パラメーターは文字列タイプです!
この記事は「JavaScript Wechat Development Skillsの要約」にまとめられており、誰もが学習して読むことを歓迎します。
「WeChat Mini Program Development Tutorial」が皆の編集者によって慎重に編集されているWechat Miniプログラムに関するチュートリアルをお勧めします。
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。