如何将github OAuth数据发送到客户端？

Question

我需要实现一个github授权，然后将接收到的数据(JSON)发送到客户端。

我找到了这篇教程http://shiya.io/how-to-do-3-legged-oauth-with-github-a-general-guide-by-example-with-node-js/

在该教程中，开发人员向我们展示了如下内容:“/”->“/login”->“/redirect”->“/user”（此处为数据）

但我需要:“/”->“/登录”->“/重定向”->“/”（此处为数据）

因为客户端应该使用简单的SPA（react）。

我现在拥有的：

    require('dotenv').config();
    const express = require('express');
    const app = express();
    const session = require('express-session');
    const request = require('request');
    const qs = require('querystring');
    const url = require('url');
    const randomString = require('randomstring');
    const csrfString = randomString.generate();

    const port = process.env.PORT || 8080;
    const redirect_uri = process.env.HOST + '/redirect';

    app.use(express.static('views'));

    app.use(
      session({
        secret: randomString.generate(),
        cookie: { maxAge: 60000 },
        resave: false,
        saveUninitialized: false
      })
    );

    app.get('/', (req, res, next) => {
      res.sendFile(__dirname + '/index.html');
      if (req.session.access_token) {
        request.get(
          {
            url: 'https://api.github.com/user',
            headers: {
              Authorization: 'token ' + req.session.access_token,
              'User-Agent': 'Login-App'
            }
          },
          (error, response, body) => {
            res.send(body);
          }
        );
      }
    });

    app.listen(port, () => {
      console.log('Server listening at port ' + port);
    });

    app.get('/login', (req, res, next) => {
    req.session.csrf_string = randomString.generate();
    const githubAuthUrl =
      'https://github.com/login/oauth/authorize?' +
      qs.stringify({
        client_id: process.env.CLIENT_ID,
        redirect_uri: redirect_uri,
        state: req.session.csrf_string,
        scope: 'user:email'
      });
    res.redirect(githubAuthUrl);
    });

    app.all('/redirect', (req, res) => {
      console.log('Request sent by GitHub: ');
      console.log(req.query);

      const code = req.query.code;
      const returnedState = req.query.state;

      if (req.session.csrf_string === returnedState) {
        request.post(
          {
            url:
              'https://github.com/login/oauth/access_token?' +
              qs.stringify({
                client_id: process.env.CLIENT_ID,
                client_secret: process.env.CLIENT_SECRET,
                code: code,
                redirect_uri: redirect_uri,
                state: req.session.csrf_string
              })
          },
          (error, response, body) => {
            console.log('Your Access Token: ');
            console.log(qs.parse(body));
            req.session.access_token = qs.parse(body).access_token;

            res.redirect('/');
          }
        );
      } else {
        res.redirect('/');
      }
      console.log(redirect_uri);
    });

在这一时刻res.send（身体）；抛出错误

    app.get('/', (req, res, next) => {
      res.sendFile(__dirname + '/index.html');
      if (req.session.access_token) {
        request.get(
          {
            url: 'https://api.github.com/user',
            headers: {
              Authorization: 'token ' + req.session.access_token,
              'User-Agent': 'Login-App'
            }
          },
          (error, response, body) => {
            res.send(body);
          }
        );
      }
    });

错误：

    throw new ERR_HTTP_HEADERS_SENT('set');
    ^

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

它的发生是因为我试图为一次又一次的渲染设置数据。

所以，我的问题是：

如何将数据发送到客户端以及如何在客户端获取数据？

Answer 1

HTTP使用的循环要求每个请求有一个响应。当客户端发送请求时，服务器应该只向客户端发送一个响应。

您正在为一个请求发送两个响应res.sendFile()和res.send(),因此需要对代码进行如下更改,

app.get('/', (req, res, next) => {
    if (req.session.access_token) {
        request.get({
            url: 'https://api.github.com/user',
            headers: { Authorization: 'token ' + req.session.access_token, 'User-Agent': 'Login-App' }
        }, (error, response, body) => { res.send(body); }
        );
    } else {
        res.sendFile(__dirname + '/index.html');
    }
});