jsonp跨域的src回調函數爲什麼要隨機

其實不是要隨機，而是要唯一性。因爲 JSONP 的回調實際上是創建了一個臨時的函數供加載的 js 調用。如果不唯一的話，同時發出多個 JSONP 請求，前面的函數就會被覆蓋掉，後面的方法就沒法執行了。
如果你能確保頁面中不會同時出現多個請求， 也沒Jsonp請求的響應體通常爲 callback(dataObject)，callback即回調函數名。爲保證Jsonp正常運作，在發出請求之前需要在window對象上放置回調函數。假設回調函數不是隨機的，那在連續JSONP請求時，後發出的請求放置的回調函數會覆蓋掉之前的，回調數據會出問題所謂。

<script>
    //調用百度jsonp 模擬百度搜索
    // https://www.baidu.com/sugrec?prod=pc&wd=H5&cb=callback
    // wd=H5    關鍵詞
    // cb       回調函數名

    var searchCon = document.getElementsByClassName("searchCon")[0];
    var list = document.getElementsByClassName("list")[0];
    // function callback(result) {
    //     console.log(result);
    // }
    searchCon.oninput = function () {
        var search = this.value;
        var callbackName = "JSONP_" + Math.random().toString().replace(".", "");
        var script = document.createElement("script");
        script.src = `https://www.baidu.com/sugrec?prod=pc&wd=${search}&cb=${callbackName}`;
        //給全局的window上定義一個function
        window[callbackName] = function(result){
            // if(datalist.)
            var datalist = result.g;
            // console.log(result);
            if(datalist)
            {
                var html = "";
                datalist.forEach(item => {
                    var data = item.q;
                    html += ` <li><a href="">${data}</a></li>`;
                });
                list.style.display = "block";
                list.innerHTML = html;
            }else{
                list.style.display = "none";
            }
            script.remove();
        }
        document.body.appendChild(script);
    }

</script>