How to work with sessions in Vue and Flask?

You know, web applications need sessions or cookies for authentication. I am trying to create a web application with microframes Vue.JS and Flask like ERP or CRM.

I'm confused. How can I work with sessions? Think we have this code in 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'})

and our interface codes should be like this:

  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
      })
    }
  }

Everything is fine until I refresh the page. When I refresh the page, I lose sessions.

Server-side sessions are important for many reasons. If I use localStoreor something like this as safe as possible, I have no idea.

I need help working on similar projects. You can give me some advice. Because I have never worked with similar projects.

Other materials that I read on this topic:

, .

+6
1

- , SPA . () . vue . , - , .

, , , . , . , , , , , .

1)

HTTP- ( , ). . , "Set-Cookie", "sessionid" , . "Set-Cookie", :

  • , , cookie
  • -//- cookie

, Set-Cookie 2, -.

2)

, , : 1) HTTP-, 2) cookie

( Chrome "" ), . . , Set-Cookie, . cookie , , , ( ).

, cookie cookie. Chrome Chrome "", "" , . cookie, . cookie, . , cookie , . / ( a//). cookie , 3

3)

, , . , ajax, URL- , , , . , - . cookie , :

  • http cookie
  • , cookie-domain/path /
  • cookie .

cookie , , .

, , , - .

+1

All Articles