Question

逻辑流程：

1：客户端oauth身份验证

2：浏览器重定向回客户端'代码

的预定义网址

3：服务器处理get方法中的代码并获取客户端的数据

我想要实现的目标：

获取oauth数据后，服务器将数据发送回客户端，然后客户端的浏览器可以处理数据并相应地进行一些更改。

app.get('/callback', function (req, res, next) {

          client.getUser(openid, function (err, result) {
             var userInfo = result; //this is client's userInfo
           //now how can I send back the userInfo object back to the client? 
           //If I use res.send() the client's page will be nothing but just the data
           //I cannot use socket.io here
           //I am not sure If I can use ajax here because usually client does not send a request in the first place
           })

   })

有没有办法在不更改客户端页面的情况下发送数据？这似乎是一个非常容易解决的问题但是我一直在摸不着头脑而没有提出任何问题！

Answer 1

如果Ajax不是您想要的，您可以将userInfo作为响应参数，并将其作为JavaScript值在页面的html代码中呈现。在浏览器中打开页面时，解析此JavaScript值并将其存储到全局变量（window）。

将userInfo作为回复参数：

app.get('/callback', function (req, res, next) {
      client.getUser(openid, function (err, result) {
         var userInfo = result; //this is client's userInfo, assume it is JSON.
         res.locals.userInfoString = JSON.stringify(userInfo);
       })
})

在页面的html代码中渲染，并在加载页面时解析（假设使用nunjucks模板，但任何其他模板技术都支持相同的功能）：

<html>
  <head>
  ...
  <script type="text/javascript">
    var userInfoString = '{{userInfoString}}';
    window.userInfo = JSON.parse(userInfoString);
  </script>
  </head>
  ...
</html>

通过这种方式，您可以在JavaScript代码中访问window.userInfo以获取userInfo对象。

对于Ajax解决方案，您可以在加载页面后发送Ajax请求，从服务器获取userInfo数据。检索userInfo数据时，使用jQuery或本机JavaScript更改相关DOM。

加载页面后发送Ajax请求，获取数据并更改DOM：

<html>
  <head>
  ...
  <script type="text/javascript" src="./js/jQuery.js"></script>
  <script type="text/javascript">
    $(function() {
      $.get('/userInfo', function(data) {
        // change DOM with data.
      });
    });
  </script>
  </head>
  ...
</html>

访问/callback时，获取userInfo并将其保存在数据库中，然后返回页面：

app.get('/callback', function (req, res, next) {
  client.getUser(openid, function (err, result) {
     var userInfo = result;
     // save userInfo into Database.
     res.render('callback_page');
   })
});

访问/userInfo时，从数据库中获取openid并读取userInfo数据：

app.get('/userInfo', function (req, res, next) {
  // get openid from req
  // get userInfo from database by openid
  res.json(userInfo);
});

获取oauth的信息后，如何将数据发送回客户端

1 个答案: