[toc] ### 1.原生http ajax請求 ```js /** * 1.創建 XMLHttpRequest 對象 * 2.xhr open(method, url) * 3.xhr.send() 發送請求 * 4.設置onreadystatechange 方法，內部監聽請求的變化 * 5.當status===200，readyState===4時，相應就緒 */ let xhr = new XMLHttpRequest() let url = 'http://localhost:3001/' // 創建一個新的`HTTP`請求,并指定該`HTTP`請求的方法、`URL`及驗證信息. xhr.open('get', url) xhr.send() // 設置響應`HTTP`請求狀態變化的函數. xhr.onreadystatechange = function() { console.log('xhr狀態發生了變化', xhr); if(xhr.status === 200 && xhr.readyState === 4) { console.log(xhr.responseText); } } ``` ### 2.手寫jsonp請求 ```js export function jsonp(url) { if (!url) { console.error("Axios.JSONP 至少需要一個url參數!") return } return new Promise((resolve, reject) => { window.jsonCallBackJsonp = (result) => { resolve(result) } var JSONP = document.createElement("script") JSONP.type = "text/javascript" JSONP.src = `${url}&callback=jsonCallBackJsonp` document.getElementsByTagName("head")[0].appendChild(JSONP) setTimeout(() => { // document.getElementsByTagName("head")[0].removeChild(JSONP) }, 500) }) } ```