跨域访问中关于 cookie, ssesion 的问题

发布于 2022-09-02 11:47:06 字数 2543 浏览 21 评论 0

// client.js
import React, { Component } from "react"
import fetch from "isomorphic-fetch"

class App extends Component {

    constructor(props) {
        super(props)
        this.handleLogin = this.handleLogin.bind(this)
        this.handleLogout = this.handleLogout.bind(this)
    }

    handleLogin() {

        fetch(`http:\/\/localhost:8888/user/login`, {
            method: "POST",
            body: { "username": "username", "password": "123456" },
            mode: "no-cors"
        })
        .then( response => response.json() )
        .then( json => console.log(json) )
        .catch( err => console.log(err) )
    }

    handleLogout() {

        fetch(`http:\/\/localhost:8888/user/logout`, {
            method: "POST",
            mode: "no-cors"
        })
        .then( response => response.json() )
        .then( json => console.log(json) )
        .catch( err => console.log(err) )

    }

    render() {

        return <div>
            
            <button onClick={this.handleLogin}>Login</button>

            <button onClick={this.handleLogout}>Logout</button>

        </div>
    }
}

export default App

//server.js
var express = require("express")
var session = require("express-session")
var redisStore = require("connect-redis")(session)

var app = express()

var user = require("./routers/user")

// app.use(cookieParser())

app.use(session({
    secret: "tdx",
    name: "app",
    store: new redisStore({
        host: "127.0.0.1",
        port: "6379"
    })
    // cookie: { maxAge: 80000 }
}))

app.use("/user", user)

app.listen("8888", function() {
    console.log("server start at: localhost:8888")
})

// routers/user.js
var express = require("express")
var router = express.Router()

router.use(function timeLog(req, res, next) {
    console.log("Time: ", Date.now())
    next()
})

// router.use("/", function(req,res) {
//     res.send("user home page")
// })

router.use("/login", function(req, res) {
    res.send("user login page")
})

router.use("/logout", function(req, res) {
    res.send("user logout page")
})

module.exports = router

在这里,当我们把 client.js 的逻辑放在本地的html页面中,访问服务端,每次都会返回不同的 session, 网上查询的反馈是在跨域的时候, session 和 cookie 丢失了,所以服务器端检查到没有session,会重新生成一个.

而我的目的是,如果我的应用分为本地和web端,通过session来存放用户信息,就不行了.现在有没有解决方法.
Q:

  1. 这种本地和web公用服务器端处理逻辑,想法有没有问题

  2. isomorphic-fetch 中的 fetch 方法使用跨域获取数据的方式较Ajax更好,那么如何来解决cookie和session丢失的问题

目前就这些,期待回答 @Cam

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

转身以后 2022-09-09 11:47:07

这块比较成熟的方法是通过SSO单点登录来解决,因为跨域控制是由浏览器来控制的,所以不同域名也确实没法共享cookie,也就导致没法共享session。SSO的解决方法是通过单点登录,在不同域名下都生成独立的身份识别cookie,进而在服务器端共享一个身份。如新浪就是这么实现的weibo.com与sina.com.cn共享身份的。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文