この記事では、WeChat JSSDKの使用をまとめて、参照のためにあなたと共有します。特定のコンテンツは次のとおりです
1.ドメイン名をバインドします
2. jsファイルを導入します
JSインターフェイス(サポートhttps)を呼び出す必要があるページに次のJSファイルを紹介します:http://res.wx.qq.com/open/js/jweixin-1.0.0.js
ページにHTTPSが有効になっている場合は、必ずhttps://res.wx.qc.c.com/open/js/jweixin-1.0.0.jsを紹介してください。そうしないと、iOS9.0以降のシステムでJSSDKを正常に使用することはできません。
3.構成インターフェイスを介して構成を確認します
このステップは、現在のURLを使用してバックグラウンドにリクエストを送信して、一連のパラメーターを取得することです。つまり、背景は私のURLを使用してWeChatで確認します。ここで注意すべきことは、現在のURLライティング方法を検証するために使用されます。
let url = location.href.split( '#')[0];
上記の状況を必ず書いてください。それ以外の場合、構成時間無効な署名が実行されます。
URLがページの完全なURLであることを確認します(現在のページアラート(location.href.split( '#')[0])で確認してください)。 'その後のパラメーターパーツを取得しますが、「#」ハッシュ後の部品は含まれません。
署名に慣れているURLが動的に取得されていることを確認してください。動的ページのサンプルコードで、PHPの実装方法を参照できます。 HTMLの静的ページがフロントエンドのAJAXを介してURLの署名にバックエンドに渡された場合、フロントエンドはJSを使用して現在のページを取得し、「#」ハッシュパーツへのリンクを削除する必要があります(href.split( '#')[0]、およびエンコーデリックコンポーネントが必要です)。 リンク。現在のリンクが動的に取得されていない場合、共有後のページ署名は失敗します。
ここでダイナミクスに注意を払い、自分でそれをスプライスせず、同時に尿コンポーネントをエンコードしてください。
$ .ajax({type: 'get'、url:url、datatype: 'jsonp'}) PC側: ''、//公式アカウントのタイムスタンプの一意の識別子:、//署名のノンセストで生成されるタイムスタンプ: ''、 ''、//必須、署名、署名、付録1 jsapilist:[]4。準備が整ったインターフェイス処理を通じて正常に検証されました
構成情報が検証された後、Readyメソッドが実行されます。 Configインターフェイスが結果を取得した後、すべてのインターフェイス呼び出しを取得する必要があります。構成は、クライアントの非同期操作です。したがって、ページがロードされたときに関連するインターフェイスを呼び出す必要がある場合は、正しい実行を確実にするために、関連するインターフェイスを対応機能に配置する必要があります。ユーザーがトリガーされたときにのみ呼び出されるインターフェイスの場合、それらはすぐにそれらを配置せずに直接呼び出すことができます。
wx.ready(()=> {// alert( 'ready'); //$('#onmenushareappmessage ').on('click'、()=> {// wx.onmenushareappmessage({title: ''、desc: ''、link: '' ''、shareurr: '、'、shareurr: '、shareurr:'、shareurr: '、shareurr:'、shareurr: '、shareurr:'、shareurr: '、alerturr:'、shareurr: '、link:友達に送る}、function(shared ')} {a arert(' canceled '); //瞬間に共有wx.onmenusharetimeline({title: ''、// share title link:shareurl、// share link imgurl: ''、// share icon success:function(){alert( 'shared'); // alert($( '。no-num')。html();ユーザーキャンセル共有// alert( 'canceled')}); });5。エラーインターフェイスを介した検証に失敗しました
設定情報が失敗した場合、エラー関数が実行されます。署名の有効期限が切れた場合、検証は失敗します。特定のエラーメッセージの場合、設定のデバッグモードを開くか、返されたRESパラメーターで表示できます。
wx.error((res)=> {alert(res.errmsg);})6。基本インターフェイス
•モーメントインターフェイスに共有します
wx.onmenusharetimeline({title: ''、// title link: ''、// share link imgurl: ''、// share icon success:function(){//ユーザーが共有を確認した後に実行されたコールバック関数}、cancel:function(){// carncels});•友人と共有するインターフェイス
wx.onmenushareappmessage({title: ''、// share title desc: '': ''、//共有説明リンク: ''、 ''、共有リンクimgurl: ''、//共有アイコンタイプ: ''、//共有タイプ、音楽、ビデオ、またはリンク、デフォルトのリンクdataurl: '' '' '' '' '' '' fult in excend in excend excond excend in excend excend date dataurl:ユーザーが共有を確認した後に実行されるコールバック関数}、cancel:function(){//ユーザーが共有をキャンセルした後に実行されたコールバック関数}});ここで共有コンテンツにAJAXの非同期要求で取得したコンテンツを追加する必要がある場合、AJAX要求が返された後、共有インターフェイスを成功した関数で再度呼び出す必要がありますが、共有インターフェイスはWX.Ready関数に配置する必要があり、個別に呼び出されません。クライアント共有操作は同期操作であるため、AJAXを使用したデータはまだ返されていません。
7.これらの手順は単純に見えますが、JSSDKインターフェイスにはまだ多くの制限があるため、デバッグ中に必然的に多くの問題があります。私は誤ってピットに足を踏み入れました。
8。最後に、このインターフェイスをカプセル化しました。
「Strict」; let wxdefaultoptions = {debug:true、appid: ''、timestamp:0、noncestr: ''、signature: ''、jsapilist:['checkjsapi'、 'onmenusharetimeline'、 'onmenushareapmessage'、 'onmenareqq'、 「hidemenuitems」、「showmenuitems」、「hideallnonbasemenuitems」、「showallnonbasemenuitems」、「showallnonbasemenuitems」、「showallnonbasemenuitems」、「翻訳」、「startrecorded」、 'soprecord'、 'strecord' '' '' 'flocorded'、 「Pausevoice」、「stopvoice」、「uploadvoice」、「uploadvoice」、 'choodimage'、 'previewimage'、 'uploadimage'、 'downloadimage'、 'getnetworktype'、 'openlocation'、 'getlocation'、 'hideoptionmenu'、 'shoptionmenu' '' '' '' '' '' '' '' shoptionmenu '、' gettionmenu '、' gettionmenu '、' gettionmenu '、 'choodwxpay'、 'openproductspecificview'、 'addcard'、 'choosecard'、 'opencard'] url = encodeuricomponent(url); Promise = new Promise((Resolve、Reject)=> {$ .Ajax({type: 'get'、url: 'http:// xxx/xxx?param ='+url、datacype: 'jsonp'})。 wxeb5c3b880f0 '。 Alert(res.errmsg); Promise;} // MOMENTS LET SHARESOCIAL =(PARAM)=> {wx.Onmenusharetimeline({title:param.title、//共有タイトルリンク:param.link、// share link imgurl:param.imgurl、// share icon success:function() {// callback function param.failcalback()ユーザーが共有をキャンセルした後に実行されます。 }、function(res){param.sucallback(); wx.ready(()=> {// moments shareSocial(param); sharetofriends(param);})} function callwx(param、wxoptions){getwxparam(param.url、wxoptions)。タイトル: ''、desc: ''、link: ''、imgurl: ''、sucallback:func、failcalback:func} module.exports = {wxdefaultoptions、//構成Callwx、//デフォルト構成、構成の後にWeChat共有コンテンツをカスタマイズします、}この記事は「JavaScript Wechat Development Skillsの要約」にまとめられており、誰もが学習して読むことを歓迎します。
「WeChat Mini Program Development Tutorial」が皆の編集者によって慎重に編集されているWechat Miniプログラムに関するチュートリアルをお勧めします。
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。