Question

您知道，Web应用程序需要会话或cookie来进行身份验证。我尝试使用Vue.JS和Flask微框架构建Web应用程序，例如ERP或CRM。

我很困惑。我如何处理会话？我们认为我们在Flask中有这样的代码：

import os
from flask import Flask, request, jsonify, abort, session

app = Flask(__name__)
app.config['SECRET_KEY'] = os.getenv('SECRET_KEY') or \
    'e5ac358c-f0bf-11e5-9e39-d3b532c10a28'

@app.route('/login', methods=['POST'])
def user_login():
    user = request.form['user']
    session['isLogged'] = True
    return jsonify({'status': session['isLogged']})

@app.route('/user-info')
def user_info():
    if 'isLogged' in session:
        return jsonify({'user': 'ali'})
    else:
        return jsonify({'error': 'Authentication error'})

我们的前端代码应该是这样的：

  mounted() {
    this.checkIsLogged();
  },
  methods: {
    checkIsLogged() {
      fetch('http://127.0.0.1:5000/user-info', {
        mode: 'no-cors',
        method: 'GET',
      }).then((resp) => {
        return resp;
      }).then((obj) => {
        if(obj.user) {
          this.status = true
        }
      })
    },
    login() {
      let frmData = new FormData(document.querySelector("#frmLogin"));

      fetch('http://127.0.0.1:5000/login', {
        mode: 'no-cors',
        method: 'POST',
        body: frmData,
      }).then((resp) => {
        return resp;
      }).then((obj) => {
        this.status = obj.status
      })
    }
  }

在刷新页面之前一切正常。当我刷新页面时，我会丢失会话。

服务器端会话很重要，原因有很多。如果我使用localStore或类似的东西，那么我可能不知道。

我需要一些帮助他们从事类似项目的工作。你可以给我一些建议。因为我从未做过类似的项目。

我在这个主题上读过的其他内容：

我仍然对我能做些什么感到困惑。

Answer 1

会话处理是您的SPA并不真正关心的事情。会话位于用户代理（浏览器）和服务器之间。您的vue应用程序与它没有多大关系。这并不是说你不能做错事，但通常问题不在你的前端。

有人说这很难对这个问题给出答案，因为我们真的不知道什么是错的。我能做的就是告诉你如何诊断这类问题。在此诊断过程中，您将找出实际问题的位置，至少在我看来，我需要做的事情显而易见。

步骤1）

使用一些低级HTTP工具来检查服务器响应（我个人在懒惰时使用curl或Postman）。将登录请求发送到服务器并查看响应标头。登录成功后，您应该有一个标题＆＃34; Set-Cookie＆＃34;，通常内容为＆＃34; sessionid＆＃34;或者你用于会话的任何密钥。如果你没有看到＆＃34; Set-Cookie＆＃34;以下之一是真的：

您的服务器未启动会话，因此未向客户端发送会话cookie
在某处过滤掉Cookie的代理/防火墙/反广告或跟踪插件

如果您看到Set-Cookie标题继续执行步骤2，否则请查看有关所选后端技术中的会话的手册。

步骤2）

值得庆幸的是，大多数现代浏览器都有一个开发人员控制台，可以让你做两件事： 1）检查您的HTTP请求标头，正文和响应标头和正文 2）看一下存储的cookie

使用第一个功能（在Chrome中，这将在开发人员控制台中的＆＃34; Network＆＃34;标签下）诊断请求和响应。为此，您需要在应用程序中执行登录时打开开发人员控制台。检查登录的响应，如果登录成功，则应包含Set-Cookie。如果cookie不存在，您的服务器不会发送它，可能是出于安全原因（跨域策略）。

如果存在，cookie现在必须存在于cookie商店中。在chrome开发人员控制台中，转到＆＃34;应用程序＆＃34;选项卡，展开左侧菜单中的Cookies，然后查看存在cookie的主机。应该有一个cookie存在于之前的步骤中设置。如果不是，浏览器不接受cookie。当您的cookie设置为某个域或路径时，通常会发生这种情况，这不是正确的域。在这种情况下，您可以尝试将域和/或路径设置为空值或正确值（如果路径为＆＃34; /＆＃34;）。如果您的cookie存在，请转到步骤3

步骤3）

记得当我说应用程序与会话无关时。您使用ajax发送的每个请求或只是在浏览器中输入有效的URL都会在请求标头中发送此主机的所有Cookie。除非您主动阻止您使用的任何库，否则这样做除非您这样做。如果您的请求不包含会话cookie，则通常会出现以下情况之一：

您的http库的使用会主动阻止发送cookie
您正在发送正确的请求，但Cookie域/路径与请求主机/路径不匹配，因此不会一直发送
您的Cookie超级短暂且已过期

如果您的Cookie发送正确，那么您的会话处理应该有效，除非您的服务器不记得该会话或启动新会话而不管现有会话。

我意识到这个问题已经过时了，这个广泛的答案来得太晚了，但是有类似问题的人也许可以从中获利。

如何在Vue和Flask中使用会话？

1 个答案: