要件は次のとおりです。ネイティブのajaxを記述するにはあまりにも多くの問題であり、ajaxを送信するには、次の書き込み方法を使用したい、それを行うには？一見！
/** * リクエストを取得送信する * パラメータは、オブジェクトである * urlのオブジェクトは、リクエストパスは、項目を渡す必要がある * メソッド内のオブジェクトは、リクエストメソッドのgetとpostは、デフォルトのgetを渡すことができないことである * データ内のオブジェクトが渡されなければならないデータを運ぶための要求であり、オブジェクトでなければならない * ヘッダ内のオブジェクトは、リクエストフォームのformdataまたはjsonポストリクエストは、デフォルトのformdataを渡さないかもしれない **/ sealAjax({ url: '/login', methed: 'post', data: {username: 'xxx', password: 111111}, headers: 'json', }).then(data => { console.log('成功', data) }).catch(err => { console.log(" , err) })
とても簡単で、約束に基づいて包むだけです。
function sealAjax(obj){ // まず第一に、受信データを引き継ぐためにデータを聞かせて = obj.data let url = obj.url let methed = obj.methed || 'get' // デフォルトの送信getリクエストletヘッダを渡さない = obj.headers || 'formdata' // 送信するデフォルトのフォーム // クエリ文字列を格納するためにクエリ変数を定義し、主にgetリクエストに使用される let query = '' if (data) { for (var i in data) { query += i + '=' + data[i] + '&' } query = query.slice(0, -1) // query結果ユーザー名=xxx&password=111111 } // ここでメタ生のAjaxはxhrを聞かせて書くことである = null; // もし（ウィンドウ.XMLHttpRequest) { xhr = new XMLHttpRequest() } else if (window.ActiveXObject) { xhr = new ActiveXObject('Microsoft.XMLHttp') } else { throw new Error('お使いのブラウザは、ajaxをサポートしていない、アップグレードしてください ') } // 最後に Promiseオブジェクトを返す return new Promise ((resolve)), reject) => { // methedは、urlを持つポストリクエストであれば、三項式で、オープンを呼び出す、そうでない場合は、urlとクエリ文字列スプライシングxhrを使用する.open(methed, methed === 'post' ? url : url + '?' + query, true) // イベントxhrを聞く.onreadystatechange = function() { // xhrのステータスコードを決定する場合（xhr.readyState === 4 ) { if (xhr.status === 200) { // 成功時に戻り値のコンテンツを受け取る resolve(xhr.responseText) } else { // 失敗時にリターンreject(xhr)を受け取る.responseText) } } } // フォームデータの応答ヘッダシミュレーションを設定し、着信jsonの場合、リクエストヘッダのタイプがjsonに設定され、json文字列を送信する // 着信formdataの場合、リクエストヘッダのタイプがformdataに設定され、クエリ文字列を送信する場合（ヘッダ）.toLowerCase() === 'json') { xhr.setRequestHeader('content-type', 'application/json;charset=utf-8') xhr.send(JSON.stringify(data)) } else if (headers.toLowerCase() === 'formdata') { xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=utf-8') xhr.send(query) } })}
パッケージ上でこのAjaxが完了するには、最初のコードを使用して呼び出すことができます。あなたが明確でない場合は、メッセージを残すことができます！
