react.js - React + Node.js 怎么做第三方接口返回的中转页?

Question

具体是这样的:

1. 我在页面跳转到第三方接口(类似微博登录之类)

2. 第三方接口返回数据后调用回调地址

3. 回调地址判断返回错误数据

4. 保存错误信息输出到中转页提示, 3秒后自动跳转

node.js使用的是koa 2,具体的跳转是这样的:

[GET] /index -> [weibo] -> [POST] /oauth -> [GET] /cart

需求看起来其实简单,但是在实现的过程中总觉得不是很好实现(?)

因为我用的是React,所以我在服务器也做了服务器渲染,因此不能直接使用类似res.render()的方法

所以现在出现的问题是,当[weibo]跳转到/oauth,在/oauth返回了一些JSON的信息,类似这样:

{
    code: '10000',
    message: '数据异常'
}

然后重定向到/cart输出错误信息.
但是在这个过程中JSON数据要怎么保存?
因为会重定向所以无法用ctx.res.err这样的方式做传递
那么除了用session还有其他方式来实现这个效果吗?
感激!!

Answer 1

First of all, thank you for the invitation
I don’t know much about react, and I have never done server-side rendering in other spa frameworks. . .
But I can help you analyze it
Your case is similar to what I have done before using a github account for third-party login (here you are using Weibo's three-party login), and it should be similar to the oauth2 convention.
In the first step, the user shoots the url to the browser (or clicks to log in). This is called the www.yourdomain.com/login route.
The second step is that the server receives the /login route and it will add some appids. , code, return_url and other information are spliced ​​after the url, and redirected to a third-party address similar to https://weibo.com/auth?appid=...
The third step, the weibo server receives this get If there is no problem with the parameter verification of the request, the route of return_url will be called. It may be post or get. In short, it will give you some information in the url or request body to let your server know that it is coming from a third-party website you have authorized. Information, after two handshakes at this time, everyone knows each other and trusts each other (some third parties will give you access_token at this time and some will require you to call again to obtain the token).
Step 4: At this time, your server can actually obtain the third-party user account and other information.
Step 5: Your server has obtained the user's information stored in a third party, so what are you waiting for? You can directly redirect or render to return a response to the long-awaited browser.

At this time, you can actually put aside the burden of third-party login (the factors that confuse you and affect your judgment). What do you have?
Your server already has third-party user information, you can treat this information as information written in the local database, no matter you use react or other libraries on the front end, no matter what server you use or not Rendering, these have nothing to do with each other, you can just treat it as an operation of requesting the local database, redirect when it needs to be redirected, and render when it needs to be rendered.

Answer 2

Think about where user information is stored during normal login.

Either save session or redis. It's just that the former will automatically generate a token and then set the cookie, while the latter requires you to do it yourself.