资讯专栏INFORMATION COLUMN

注册和登录(关于Cookie)

jay_tian / 3004人阅读

摘要:当的过期时间被设定时,设定的日期和时间只与客户端相关,而不是服务端。

前记

我将描述一下登陆和注册之间发生了什么,将场景分为客户端和服务端,服务器是Node.JS,客户端是由JS写的

注册 1、注册请求

这是由客户端发送一个POST请求给服务端,其中包含了用户名和密码

let $form = $("#signUpForm")
    $form.on("submit", (e)=>{
      e.preventDefault()
      let hash = {}
      let need = ["email", "password", "password_confirmation"]
      need.forEach((name)=>{
        let value = $form.find(`[name=${name}]`).val()
        hash[name] = value
      })
      $form.find(".error").each((index, span)=>{
        $(span).text("")
      })
      $.post("/sign_up", hash)  
        .then((response)=>{
          console.log(response)
        }, (request)=>{
          let {errors} = request.responseJSON
          if(errors.email && errors.email === "invalid"){
            $form.find("[name="email"]").siblings(".error")
              .text("邮箱格式错误")
          }
        })
    })
2、服务器检查

服务器需要检查发送过来的用户名是否注册过,如果注册过就返回失败,如果没有注册过就写入数据库

3、返回

写入数据库成功,就将注册成功返回给用户

登录 1、输入账号密码

输入账号密码,并用POST发送给服务器,可以检查输入格式

let $form = $("#signInForm")
    $form.on("submit", (e) => {
      e.preventDefault()
      let hash = {}
      let need = ["email", "password"]
      need.forEach((name) => {
        let value = $form.find(`[name=${name}]`).val()
        hash[name] = value
      })
      $form.find(".error").each((index, span) => {
        $(span).text("")
      })
      $.post("/sign_in", hash)
        .then((response) => {
          window.location.href = "/"
        }, (request) => {
          alert("邮箱与密码不匹配")
        })
    })
2、服务器检查

获取账号密码,服务器查询数据库,看是否有对应的账号存在

3、返回

如果有对应的存在就返回登录成功,如果没有,就返回登录失败

Cookie

在上面的注册和登录过程中会有一些问题,网站是如何判断登录与否的,有些页面只有登录才可以访问,另外,如何来确认登录的是谁,这样才不会搞混乱,这时就需要引入Cookie来解决这些问题

设置Cookie

在登录的一瞬间,服务器通过Set-Cookie,例如

        response.setHeader("Set-Cookie", `sign_in_email=${email}`)

告诉浏览器,在这个用户上做了个标记,以后只要相同的源的请求都会带上这个Cookie,服务器Set-Cookie的是什么,浏览器Cookie就会是什么。

期限

Cookie并不是永久有效的,就像游乐场的门票一样,你在游乐场去任何地方都需要这张门票,但是这个门票会有期限,这个期限可以自己设置,和关闭浏览器便失效的会话期Cookie不同,持久性Cookie可以指定一个特定的过期时间(Expires)或有效期(Max-Age)。

response.setHeader("Set-Cookie", `id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT`)

当Cookie的过期时间被设定时,设定的日期和时间只与客户端相关,而不是服务端。

特点

服务器通过Set-Cookie响应头来设置Cookie

浏览器得到Cookie后,每次请求都会带上Cookie

服务器读取Cookie就知道登录用户的信息

Cookie存在电脑上的一个秘密的文件位置

Cookie并不安全,可以做假

Cookie有效期的默认时间由浏览器决定,后端可以强制设置

不同浏览器上的Cookie不可以互通

关于Cookie的更多信息,可以在MDN上查看

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52868.html

相关文章

  • 注册登录关于Cookie

    摘要:当的过期时间被设定时,设定的日期和时间只与客户端相关,而不是服务端。 前记 我将描述一下登陆和注册之间发生了什么,将场景分为客户端和服务端,服务器是Node.JS,客户端是由JS写的 注册 1、注册请求 这是由客户端发送一个POST请求给服务端,其中包含了用户名和密码 let $form = $(#signUpForm) $form.on(submit, (e)=>{ ...

    wthee 评论0 收藏0
  • 登录注册理解Cookie的作用过程

    摘要:需要注意的细节问题为什么前后端都要进行表单验证前后端都要验证邮箱格式是否正确,账号密码格式是否正确,两次提交的密码是否相同等。因为黑客可以绕过前端的验证流程,例如黑客可以直接使用进行请求的发送,直接与后台服务器进行交互。 这篇文章是前一篇文章(Cookie理论知识)的实践性理解 完整代码: 完整代码 Cookie在注册登录时的作用过程: 注册 注册时把账号密码写入数据库 登录 第一次登...

    cheng10 评论0 收藏0
  • JWT、OAuth 2.0、session 用户授权实战

    摘要:为用户提供授权以允许用户操作非公开资源,有很多种方式。具体的代码根据不同的授权方案而有所不同。使用授权原理利用来验证用户,有两种机制实现。使用来实现用户授权主要用于签发如果有将异步的签名。   在很多应用中,我们都需要向服务端提供自己的身份凭证来获得访问一些非公开资源的授权。比如在一个博客平台,我们要修改自己的博客,那么服务端要求我们能够证明 我是我 ,才会允许我们修改自己的...

    zhaot 评论0 收藏0
  • JWT、OAuth 2.0、session 用户授权实战

    摘要:为用户提供授权以允许用户操作非公开资源,有很多种方式。具体的代码根据不同的授权方案而有所不同。使用授权原理利用来验证用户,有两种机制实现。使用来实现用户授权主要用于签发如果有将异步的签名。注意这里的与之前用于签发的应该是同一个。 在很多应用中,我们都需要向服务端提供自己的身份凭证来获得访问一些非公开资源的授权。比如在一个博客平台,我们要修改自己的博客,那么服务端要求我们能够证明 我是...

    Jochen 评论0 收藏0
  • nodejs+mongodb构建一个简单登录注册功能

    摘要:搭建简单登录注册还是我又来了近来突然对数据库和后台有点感兴趣就开始了漫长的学习之路想想自己只是一个前端只会斯科瑞普所以就开始看看着看着突然发现和更配哦遂就开了我的之路由于我的表达能力有限下面的文章可能写的不是那么详细有看不懂的可以去我上看源 nodejs+mongodb搭建简单登录注册 biu!biu!biu!还是我又来了!!! 近来突然对数据库和后台有点感兴趣,就开始了漫长的学习之...

    yibinnn 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<