javascript - http リクエストが含まれている js ファイルを見つける方法

Question

私は今 Web ページを見ています。送信ボタンをクリックすると、投稿リクエストが確実にトリガーされます。この投稿リクエストの js ステートメントがどの js ファイルに含まれているかを知りたいです。見て学ぶ。しかし、Web ページのソース ファイルが多すぎます。このコードはどうやって見つければよいでしょうか?

Answer 1

Chrome、開発者ツール、ネットワークを例に挙げます

開いた後、前のレコードをクリアし、フィルターで xhr を選択し、操作をトリガーすると、決定したレコードを見つけて、マウスをイニシエーターの位置に移動します。クリックして移動します。直接クリックして入力します。これは通常、直接トリガーされますが、ソースコードを見つけることはほとんど役に立ちません。

上に移動すると、以下に示すようにコールスタックが表示されます:

以下に示すように、呼び出しスタックの一番下がトリガー ソースです。もう一度クリックします。

---

補足

質問 1: 複数の js ファイルが相互に呼び出しています。

たとえば、シナリオは次のとおりです:

1. jq を使用して ajax リクエストの送信を完了します$.ajax，文件jquery.js
2、但是ajax的默认配置和我需要使用的差距较大，我自己对jq的ajax又进行了一次封装Util.ajax。文件util.js。
3、某个页面的js文件（index.js），在使用是我调用的是我封装过的Util.ajax。

それでは実際の表示はこんな感じです

リーリー

これは、index.js 内のどこかからの呼び出しです Util.ajax ，而 Util.ajax 又调用了$.ajax それらは別のファイルにあります。

どれを選択するかについては、実装プロセスを理解する必要があります。最後の匿名は実際のトリガー ソース、つまりリクエストが開始されたときのコール スタックの初期位置、つまり最下位です。 Ajax には独自のカプセル化があり、送信は jq で実装されます。

この質問については、さらに基本的な知識を知る必要があります。

質問2 フロントエンドのものには基本的に機密性はありません。 JS 自体はインタープリタ型言語であり、コンパイル プロセスを必要とせず、表示および読み取り可能です。 ただし、JavaScript には依然として難読化や圧縮などの特定の保護手段があり、変数は abcd に変換されるため、読みにくくなります。

以下に示すように、send の実装を示します。理解できますか?

ブラウザで整形しても変数に意味がないので理解しにくい

Answer 2

これにより、コードがトリガーされる場所を特定できます

Answer 3

クリックしたので、このボタンのクリック イベントを探します。ページ上で見つからない場合は、デバッグ パネルの要素で対応するボタンを選択し、右側のイベント リスナーを確認します。見つからない場合は、クラスまたは ID に基づいて js で検索してください。ほとんどが似ているためです。