2

Node/Express バックエンドで小さな Angular アプリケーションを実行しています。

Angular ファクトリの 1 つ (クライアント側) で、Github に $http リクエストを送信してユーザー情報を返します。ただし、これを行うには、Github で生成されたキー (秘密にするためのもの) が必要です。

クライアント側で process.env.XYZ を使用できないことはわかっています。どうすればこの API キーを秘密にできるのだろうか? 代わりにバックエンドでリクエストを行う必要がありますか? その場合、返された Github データをフロントエンドに転送するにはどうすればよいですか?

これが単純に見える場合は申し訳ありませんが、私は比較的初心者なので、コード例を含む明確な回答をいただければ幸いです。ありがとうございました

4

1 に答える 1

2

残念ながら、キーの秘密を保持するために、バックエンドでリクエストをプロキシする必要があります。( https://api.github.com/users/rsp?callback=fooのような認証されていないリクエストを介して利用できないユーザーデータが必要であると想定しています。そうしないと、そもそも API キーを使用する必要がないからです。 -しかし、あなたが何をする必要があるかを具体的に言わなかったので、それは私の推測です）。

できることは次のようなものです: バックエンドでは、情報を取得するためだけにフロントエンドに新しいルートを追加できます。秘密の API キーを使用するかどうか、要求を検証する、クライアントに戻る前に応答を処理するなど、必要なことは何でも実行できます。

例：

var app = require('express')();

app.get('/github-user/:user', function (req, res) {
    getUser(req.params.user, function (err, data) {
        if (err) res.json({error: "Some error"});
        else res.json(data);
    });
});

function getUser(user, callback) {
    // a stub function that should do something more
    if (!user) callback("Error");
    else callback(null, {user:user, name:"The user "+user});
}

app.listen(3000, function () {
  console.log('Listening on port 3000');
});

この例では、次の場所でユーザー情報を取得できます。

関数getUserは GitHub に実際のリクエストを行う必要があり、それを呼び出す前に、それが本当にリクエストを行っているフロントエンドであるかどうかを変更できます。たとえば、「Referer」ヘッダーなどをチェックしたり、入力を検証したりします。

ここで、公開情報のみが必要な場合は、次のような公開 JSON-P API を使用できる場合があります。jQuery を使用して物事を単純にする例:

var user = prompt("User name:");
var req = $.getJSON('https://api.github.com/users/'+user);
req.then(function (data) {
  console.log(data);
});

デモを見る

于 2016-06-11T10:03:53.440 に答える