Nodejsリクエストのカプセル化の言い訳-フロントエンドQ&A-php.cn

フロントエンドとバックエンドの分離が普及するにつれ、フロントエンドエンジニアは通信のためにバックエンドとのインターフェースを必要とすることがますます増えています。このプロセス中に、多くのエンジニアは、ネイティブ XMLHttpRequest またはフェッチを直接使用してネットワークリクエストを行う場合に多くの問題があることに気付きました。したがって、多くのフロントエンドチームは現在、サードパーティのリクエストライブラリを使用してインターフェイスリクエストを行っています。中でもNode.jsで開発されたリクエストリクエストライブラリも人気が高いです。

この記事では、Node.js のリクエストリクエストライブラリを使用してインターフェイスリクエストをカプセル化し、フロントエンドエンジニアがインターフェイスと通信するのをより便利かつ高速にする方法を紹介します。

リクエストライブラリのインストール

リクエストライブラリを使用する前に、最初にリクエストライブラリをインストールする必要があります。これは、コマンドラインで npm コマンドを使用してインストールできます。

npm install request --save

ログイン後にコピー

GET リクエストの送信

次に、リクエストライブラリを使用して、いくつかの一般的なリクエストを送信します。まず、request.get() メソッドを使用して GET リクエストを送信する必要があります。

const request = require('request');

request.get('https://api.github.com/', function(error, response, body) {
    if (!error && response.statusCode == 200) {
        console.log(body);
    }
});

ログイン後にコピー

このコードでは、GitHub の API にアクセスして、ホームページのコンテンツを取得します。まず、request.get() メソッドを使用して GET リクエストを送信し、GitHub API アドレスをパラメーターとして渡します。リクエストをサーバーに送信し、サーバーの応答を待ちます。

サーバーが応答すると、リクエストライブラリは応答情報をコールバック関数に渡します。パラメータ error はリクエスト処理中にエラーがあったかどうかを示し、response はサーバの応答ヘッダ情報を示し、body はサーバの応答の具体的な内容を示します。

このコードでは、まず if (!error && response.statusCode == 200) を使用してエラーが発生したかどうかを判定し、エラーがなければ応答内容を出力します。

POST リクエストの送信

次に、POST リクエストを送信します。

const request = require('request');

request.post({
    url: 'https://httpbin.org/post',
    form: {
        name: '张三',
        age: 18
    }
}, function(error, response, body) {
    if(!error) {
        console.log(body);
    }
});

ログイン後にコピー

このコードでは、request.post() メソッドを通じて POST リクエストを送信し、リクエストアドレスとリクエストパラメータをオブジェクトの形式で渡します。 form パラメータは POST リクエストのフォームデータを表し、ここでは名前と年齢のフィールドを渡します。

同様に、サーバーが応答すると、Request ライブラリは応答情報をコールバック関数に渡しますが、error と response.statusCode を判断することでリクエストが成功したかどうかを判断し、応答内容を出力することもできます。

JSON データの送信

今日のフロントエンドとバックエンドの分離開発では、非常に一般的なリクエスト方法は JSON データを送信することです。以下は、JSON データを送信するためのサンプルコードです。

const request = require('request');

const data = {
    name: '李四',
    age: 20
};

const options = {
    method: 'POST',
    url: 'https://httpbin.org/post',
    json: true,
    body: data
};

request(options, function(error, response, body) {
    if(!error) {
        console.log(body);
    }
});

ログイン後にコピー

このコードでは、まず、送信される JSON データを表すデータオブジェクトを定義します。次に、オプションパラメーターを使用してリクエストのいくつかのパラメーターを構成しました。

method はリクエストメソッドを表し、ここでは POST に設定します。
url はリクエストアドレスを表し、これも https://httpbin.org/post です。
json は、送信するデータが JSON 形式であることを意味します。
body は、送信したい特定のデータです。

request() メソッドでは、options パラメータを渡します。前のサンプルコードと同様、サーバーが応答すると、Request ライブラリは応答情報をコールバック関数に渡します。

リクエスト送信時のエラー処理

インターフェイスリクエストを行う過程で、ネットワーク接続タイムアウト、リクエストアドレスが存在しないなど、多くのエラーが発生することは避けられません。以下は、エラー処理のサンプルコードです。

const request = require('request');

const data = {
    name: '李四',
    age: 20
};

const options = {
    method: 'POST',
    url: 'https://httpbin.org/post',
    json: true,
    body: data,
    timeout: 5000 // 设置请求超时时间
};

request(options, function(error, response, body) {
    if(error) {
        console.log('请求发生错误：', error);
    } else {
        if(response.statusCode == 200) {
            console.log('响应内容：', body);
        } else {
            console.log('请求失败，状态码：', response.statusCode);
        }
    }
});

ログイン後にコピー

このコードでは、最初に、リクエストのタイムアウトを示すために options.timeout パラメータを設定し、リクエストが長すぎてページがスタックすることを回避します。応答。エラーが発生した場合は、コールバック関数で console.log() を使用してエラーメッセージを出力します。エラーがなければ応答ステータスコードを判定し、ステータスコードが200の場合は応答内容を出力します。それ以外の場合は、リクエスト失敗のステータスコードを出力します。

リクエストインターフェイス関数のカプセル化

リクエストライブラリを使用してインターフェイスリクエストを作成する場合、共通のリクエストメソッドをカプセル化してコードの過剰な繰り返しを避けることができます。以下は、リクエストインターフェイス関数をカプセル化するサンプルコードです。

const request = require('request');

function requestApi(url, method, data) {
    const options = {
        method: method,
        url: url,
        json: true,
        timeout: 5000
    };

    if(method == 'GET') {
        options.method = 'GET';
    } else if(method == 'POST') {
        options.method = 'POST';
        options.body = data;
    } else if(method == 'PUT') {
        options.method = 'PUT';
        options.body = data;
    } else if(method == 'DELETE') {
        options.method = 'DELETE';
        options.body = data;
    }

    return new Promise(function(resolve, reject) {
        request(options, function(error, response, body) {
            if(error) {
                reject(error);
            } else {
                if(response.statusCode == 200) {
                    resolve(body);
                } else {
                    reject(response.statusCode);
                }
            }
        });
    });
}

ログイン後にコピー

このコードでは、最初に requestApi() 関数を定義します。これには 3 つのパラメータが含まれます。

url は要求されたアドレスを表します。
method は、要求されたメソッドを表します。
data は、要求されたデータを表します。

関数では、リクエストのいくつかの構成パラメータを保存するためのオプションオブジェクトを定義します。さまざまなリクエストメソッドに応じて、options.method の値と options.body の値を設定します。

次に、非同期処理には Promise を使用します。 request() メソッドのコールバック関数では、resolve() を使用して応答コンテンツを渡し、reject() を使用してエラーメッセージとステータスコードを渡します。 Promise オブジェクトの then() メソッドと catch() メソッドを使用すると、データをリクエストした後に対応する処理を実行できます。

概要

Node.js の Request ライブラリを使用してインターフェイスリクエストを行うのは、非常に便利で迅速な方法です。これにより、ネイティブ XMLHttpRequest の使用または直接フェッチによって発生するいくつかの問題を回避でき、いくつかの一般的なエラーも処理できます。実際のニーズに応じて一般的なリクエストを関数にカプセル化し、プロジェクト内で呼び出すことで、コードをより簡潔で理解しやすくすることができます。

以上がNodejsリクエストのカプセル化の言い訳の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。