1

我有一个axios运行在 NodeJS 后端之上的 ReactJS 应用程序。我还有一个本地 Keycloak 服务器来启用单点登录 (sso) 和身份验证。

在 NodeJS 后端，我将 Keycloak 适配器配置为：

(...other imports...)
const session = require('express-session');
const Keycloak = require('keycloak-connect');

const CONFIG = {
    apiRoot: 'http://localhost:8033',
    serverPort: '3000'
}

const loadSpringConfig = async () => { (... do something unrelated...) }

Promise.all([loadSpringConfig()]).then(() => {
    const server = express()

    const memoryStore = new session.MemoryStore();

    // Using json config downloaded from keycloak client
    let keycloak = new Keycloak({
        store: memoryStore
    });

    // In memory session
    server.use(session({
        secret: 'extremely-secret',
        resave: false,
        saveUninitialized: false,
        store: memoryStore
    }));

    server.use(keycloak.middleware({}));
    server.use(compression())
    server.use(cookieParser())
    server.use(bodyParser.json({ limit: '50mb' }))
    server.use(bodyParser.urlencoded({ limit: '50mb', extended: true }))

    server.get('/health', (req, res) => {
        res.send("{ healthy: true }")
    })

    server.get('/secure', keycloak.protect('user'), function (req: any, res: any) {
        let keycloakToken = JSON.parse(req.session['keycloak-token']);
        let accessToken = keycloakToken.access_token;
        
        res.send(accessToken);
    });

    server.get('/config', (req, res) => {
        res.json(CONFIG)
    })

    server.use(express.static(path.join(__dirname, 'build')))

    server.get('/', (req, res) => {
        res.sendFile(path.join(__dirname, 'build', 'index.html'))
    })

    server.listen(CONFIG.serverPort, (err: Error) => {
        if (err) {
            throw err
        }
        console.log(`> Ready on http://localhost:${CONFIG.serverPort}, using api at: ${CONFIG.apiRoot}`)
    })
})

这按预期工作，当浏览器转到localhost:3000/secure它时，它被重定向到我的 keycloak 登录页面。成功登录后，浏览器将/secure使用响应正文中的用户访问令牌重定向回我的端点。这一切都在 NodeJS 中。

我现在的问题是应该以某种方式通知 ReactJS 有来自 keycloak 的有效令牌，并在Axioshttp 客户端上使用它来将经过身份验证的请求发送到在云服务器上运行的不同后端服务。

我是前端开发的新手。将令牌从 NodeJS 后端传递到在用户浏览器上运行的 ReactJS 前端应用程序以便可以通过Axios（将所有 http 请求发送到外部 api）来检索它的最佳方法是什么？

4

0 回答 0