使用 socketio 时如何重定向到另一条路由

Question

I am trying to redirect the page to a different route, whenevery i get a message from the client. It is basically going to get different messages from different clients, and when it reaches specific amount in my players_choices array, i want the page to redirect.

This is my server code

from flask_app import app
from flask import render_template, redirect, request, flash, session
from flask_socketio import SocketIO, send
from flask_app.controllers import users_controller
from flask_app.controllers import scores_controller
import json
import ast

socketio = SocketIO(app, cors_allowed_origins="*")
players_choices = []

@socketio.on('message')
def handle_message(message):
    
    print("\n\n\nMESSAGE TYPE ")
    print(message)
    print("\n\n\nCHOICEEEEEE END")

    if message != "User connected!":
        send(message, broadcast=True)
    
        extracted_string = message['json']
        print("\n\n\nIM AM HERE***********")
        print(extracted_string)
        choices = ast.literal_eval(extracted_string)
        print("\n\n\nPRINTING JSONED DIC")
        print(choices['user_id'])
        print(choices['choice'])

        players_choices.append(choices)
        print("\n\n\nPLAYERS CHOICES")
        print(players_choices)


        if len(players_choices)>=2:
            session['main_user_choice'] = players_choices[0]
            session['opponent_user_choice'] = players_choices[1]
            print("\n\n\nSESSION VALUES")
            print(session['main_user_choice'])
            print(session['opponent_user_choice'])
            print("SESSION VALUES\n\n\n")
            return redirect('/result')

if __name__ == "__main__":
    socketio.run(app, host='localhost', port=5001)

And this is my html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/style.css') }}">
    
    <script type="text/javascript" src="{{ url_for('static', filename='js/script.js') }}" defer></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js" integrity="sha512-q/dWJ3kcmjBLU4Qc47E4A9kTB4m3wuTY7vkFJDTZKjTs8jhyGQnaUrxa0Ytd0ssMZhbNua9hE+E7Qv1j+DyZwA==" crossorigin="anonymous"></script>
    <script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
    <script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            var socket = io.connect("localhost:5001");

            socket.on('connect', function(){
                socket.send("User connected!");
            });

            $('#rock').on('click', function(){
                //console.log("******************DATA")
                //console.log($('#rock').data())
                socket.send($('#rock').data())
            });
            $('#paper').on('click', function(){
                socket.send($('#paper').data())
            });
            $('#scissor').on('click', function(){
                socket.send($('#scissor').data())                
            });

        });
        
    </script>    
    <title>Gameplay</title>
</head>

<body class="bg-color-lght-green">
    <div class="container border mt-5">
        <!-- Choose now header -->
        <h1 class="d-flex justify-content-center mt-5 display-5 animate__animated animate__fadeIn">CHOOSE NOW</h1>
        <!-- Hand images with link to the loading page -->
        <div class="d-flex flex-wrap justify-content-center gap-3 ">
            <a href="/waiting_for_opponent" id="paper" data-json="{'user_id': '{{logged_user.name}}', 'choice' : '2'}"><img onmouseover="addShake(this)" onmouseleave="removeShake(this)" src="{{RockPaperScissorsImages.paper}}" alt="paper"> </a>
            <a href="/waiting_for_opponent" id="rock" data-json="{'user_id': '{{logged_user.name}}', 'choice' : '1'}"><img onmouseover="addShake(this)" onmouseleave="removeShake(this)" src="{{RockPaperScissorsImages.rock}}" alt="rock"> </a>
            <a href="/waiting_for_opponent" id="scissor" data-json="{'user_id': '{{logged_user.name}}', 'choice' : '3'}"><img id="scissorsss" onmouseover="addShake(this)" onmouseleave="removeShake(this)" src="{{RockPaperScissorsImages.scissors}}" alt="scissors"> </a>
        </div>

        <!-- HomePage Button -->
        <div class="d-flex justify-content-center me-2 ms-2 mb-5">
            <button onclick="window.location.href='/dashboard'" class="btn btn-outline-dark mt-5  animate__animated animate__fadeIn" style="border: 1px solid white; color: white" > Home Page</button>
        </div>
    </div>
</body>
</html>

i have other pages and routes defined in another controller, so i want it to redirect to '/result' route whenever len(players_choices)>=2 the length of my array reaches 2

I tried return redirect('/result') but it doesnt do anything

Answer 1

When using the redirect function with Flask, I believe you need to put the full URL in the parameter.

Try this:

@socketio.on('message')
def handle_message(message):
    
    print("\n\n\nMESSAGE TYPE ")
    print(message)
    print("\n\n\nCHOICEEEEEE END")

    if message != "User connected!":
        send(message, broadcast=True)
    
        extracted_string = message['json']
        print("\n\n\nIM AM HERE***********")
        print(extracted_string)
        choices = ast.literal_eval(extracted_string)
        print("\n\n\nPRINTING JSONED DIC")
        print(choices['user_id'])
        print(choices['choice'])

        players_choices.append(choices)
        print("\n\n\nPLAYERS CHOICES")
        print(players_choices)


        if len(players_choices)>=2:
            session['main_user_choice'] = players_choices[0]
            session['opponent_user_choice'] = players_choices[1]
            print("\n\n\nSESSION VALUES")
            print(session['main_user_choice'])
            print(session['opponent_user_choice'])
            print("SESSION VALUES\n\n\n")
            return redirect('example.com/result') #Put your actual URL here. You may need to add "https://".

if __name__ == "__main__":
    socketio.run(app, host='localhost', port=5001)

Look at this website for more information: Click here