ホームページ > 記事 > ウェブフロントエンド > iframeのpages_javascriptスキルでWeChat jssdkが失敗する問題の解決策
プロジェクト要件
WeChat にロットを追加するためのページには、写真のアップロード機能があります。アップロードすると、ページは Canvas を使用して、WeChat jssdk の画像選択インターフェイスを使用して選択された画像を読み込みます (ここでは、WeChat はローカル ID を返します)。 weixin://xxxx の形状、プレビュー用に img のソースに直接配置できます)、ズームイン、移動、回転などの操作ができ、[OK] ボタンをクリックして編集した画像をサーバーに送信し、ファイルとして保存します。写真
問題が発生しました
サブページ機能の開発完了後、メインページのiframe経由でサブページを開いた場合、WeChat jssdkインターフェースの画像選択インターフェースを呼び出すことができず、他のjssdkのインターフェースも呼び出せなくなります。正常に動作できません。ただし、サブページを個別に開くことは正常に動作し、メイン ページでの WeChat 共有も正常に動作します。
ソリューションのアイデア
まず、jssdkの署名情報がメインページとサブページに同時に注入されますが、競合する可能性はありますか?テストの結果、この可能性は排除されました。インターネット検索を通じて、一部のネチズンがこの投稿で私と同様の問題を説明しましたが、解決策はありません http://www.weixin.com/thread-8022-1-1.html
テスト後、メインページでは署名検証が可能となり、サブページにはjssdkの署名情報が追加されません。画像選択インターフェースなど、jssdkインターフェースを呼び出す必要がある場合は、jssdk関数の前にparentを追加します。つまり、親ページのこの関数を呼び出します。テスト後、関数を正常に呼び出すことができます。
parent.wx.chooseImage({ success: function (res) { //upload_success(res.localIds); }
WeChat jssdk は強力であるように見えますが、多くのバグがあり、実際にプロジェクトで使用する場合の精査に耐えられないことは言及する価値があります。この問題は解決されましたが、Canvas でエクスポートされた画像がドメインを越えることができないという新たな問題が発生しました。 。 。結局、WeChat のインターフェースはニーズを実現するために使用されませんでした。
上記は編集者が紹介した iframe ページの WeChat jssdk 障害の問題の解決策です。皆様のお役に立てれば幸いです。