在proxy / chrome的dev工具中看不到AJAX調用

Question

同事使用以下代碼段從數據庫獲取URL，然后向該URL提交“虛擬”表單。

$.ajax({
                url: location.origin + location.pathname + "data/getURL.php",
                method: "POST",
                data: {
                    userName: user
                },
                success: function( data : any, textStatus : string, jqXHR : JQueryXHR){
                    console.log(data);
                    var url = (JSON.parse(data)).url;

                    if(url !== undefined && url !== null && url !== ""){
                        var sender : HTMLFormElement = document.createElement("form");
                        sender.setAttribute("action", `http://${url}/receive`);
                        sender.setAttribute("method", "POST");

                        var userSenderField = document.createElement("input");
                            userSenderField.setAttribute("type", "hidden");
                            userSenderField.setAttribute("name", "user");
                            userSenderField.setAttribute("value", user);
                        sender.appendChild(userSenderField);

                        var passSenderField = document.createElement("input");
                            passSenderField.setAttribute("type", "hidden");
                            passSenderField.setAttribute("name", "password");
                            passSenderField.setAttribute("value", password);
                        sender.appendChild(passSenderField);

                        document.body.appendChild(sender);
                        sender.submit();

使用Burp Suite或僅使用Chrome的開發工具，我可以看到對getURL.php的調用，但是隨后看不到對http://url/receive的調用。 為什么？

Answer 1

為了便於討論，假設您對data/getURL.php ajax調用成功，但是傳遞了錯誤或意外的數據。

然后，您最終遇到了ajax調用的成功處理程序。

成功處理程序立即創建一個新表單，用（錯誤的）數據填充該表單，然后提交表單。

這會導致發生回發。

Chrome的開發工具默認情況下會在回發時清除網絡面板，同時也會清除對"data/getURL.php"的調用，因此您從未真正看到該調用成功，並且在網絡面板中看不到它做了什么。 （因此，您不知道data/getURL.php向您提供了錯誤的數據。

如果在提交表單之前在ajax成功處理程序中放置一個斷點，則實際上可以看到發生了什么。