$ .get請求與不同的URL循環嗎？

Question

我要檢查一個文本文件（如果其中包含該文本），然后移至下一個get請求並檢查另一個文本文件，以查看第二個文本文件是否包含某些文本。

我嘗試將其放入while循環中，如下所示：

    function testMessage()
    {
        const filePaths =
        [
            "http://example.com/trigger.txt",
            "http://example.com/userexceptions.txt",
            "http://example.com/message.txt"
        ];

        const trigger = "true";
        var currentStage = 0;
        const finalStage = 2;
        var breakLoop = false;

        while (currentStage < finalStage)
        {
            $.get(filePaths[currentStage], function(data)
            {
                if (currentStage == 0)
                {
                    const compareText = data.localeCompare(trigger, "en", {sensitivity: "base"});
                    if (compareText == 0) //if the first text file contains the trigger "true", continue
                    {
                        someGlobalVariable = true;
                        currentStage++;
                    } else {
                        breakLoop = true;
                    }
                } else if  (currentStage == 1) //if the second text file contains the username of the current user, break the loop
                {
                    const rawUsers = data;
                    const userExceptions = rawUsers.split(';');

                    if (userExceptions.indexOf(currentUser) > -1)
                    {
                        console.log("User exception is: " + userExceptions[userExceptions.indexOf(currentUser)]);
                        breakLoop = true;
                    } else {
                        currentStage++;
                    }
                } else if (currentStage == 2)
                {
                    globalNotification = data;
                    notification.global(globalNotification);
                    console.log("Global notification displayed.");              
                } else {
                    console.log("We're here now.");
                }
            }, 'text')
            .fail(function()
            {
                console.log("Global notifications failed at stage: " + currentStage);
            });

            if (breakLoop)
                break;
        }
    }

我還嘗試使用switch語句而不是多個if-else語句，並且導致頁面中斷，因此我認為它沒有正確地退出switch和循環。

當我運行它時，似乎循環永遠不會結束，所以會中斷頁面​​？

Answer 1

我將以非常不同的方式實現這一點。 我認為您應該閱讀有關fetch和promises （ https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch ）。 那將很容易解決這種問題！

無論如何...我試圖在您的代碼上做出最小的改動以使其正常工作。 有以下方法：

• 刪除控制變量，因為您可以使用數組長度和測試結果。
• 使用數組長度，您可以簡單地將更多項目添加到數組中，這樣就可以了。
• 由於每個文件都需要不同的測試，因此我將字符串URL的數組更改為對象的數組，在這里可以為每個對象添加一種test方法。
• 將breakLoop var替換為test方法return。
• 將breakLoop測試替換為遞歸測試。
• while循環已由異步遞歸getFiles方法代替。 這也使testMessage異步，因此我對它做了一個callback參數。
• 在對索引0進行聲明之后，將調用getFiles **它使用jQuery的ajax，並在結果上運行當前階段測試。 **當返回true而不是最后一項時，它將為下一階段調用getFiles 。 **所以...這意味着它不是並行的。 （我認為）您需要按順序進行。

    function testMessage(callback)
    {
        const trigger = "true";
        const files =
        [
            {
                url: "http://example.com/trigger.txt",
                test(data) {
                    const compareText = data.localeCompare(trigger, "en", {sensitivity: "base"});
                    if (compareText == 0) //if the first text file contains the trigger "true", continue
                    {
                        someGlobalVariable = true;
                        return true;
                    }
                    else return false;
                }
            },
            {
                url: "http://example.com/userexceptions.txt",
                test(data) {
                    const rawUsers = data;
                    const userExceptions = rawUsers.split(';');

                    if (userExceptions.indexOf(currentUser) > -1)
                    {
                        console.log("User exception is: " + userExceptions[userExceptions.indexOf(currentUser)]);
                        return false;
                    }
                    return true;
                }
            },
            {
                url: "http://example.com/message.txt",
                test(data) {
                    globalNotification = data;
                    notification.global(globalNotification);
                    console.log("Global notification displayed.");
                    return true;
                }
            }
        ];

        (function getFiles(currentStage)
        {
            $.get(files[currentStage].url, function(data)
            {
                if (files[currentStage].test(data))
                {
                    if (files.length > currentStage+1) getFiles(currentStage+1)
                    else callback(null, "Success!")
                }
                else callback(Error(`Stage${currentStage}'s test fail.`, null))
            }, 'text')
            .fail(function()
            {
                console.log("Global notifications failed at stage: " + currentStage);
            });
        })(0);
    }
    testMessage(console.log)