socketio webapp не работает - PullRequest
Новая
       121

socketio webapp не работает

0 голосов
/ 19 июня 2020

Я пытаюсь создать приложение для чата. Но сначала я пытаюсь создать канал так, чтобы, когда пользователь заполняет форму и нажимает кнопку создания канала, канал создается и отображается в списке объединенных каналов, но ничего не происходит. когда я нажимаю кнопку создания канала. Javascript / HTML код: 


    <script>

        document.addEventListener('DOMContentLoaded',function(){
            if(!localStorage.getItem("displayname")){
            var displayname;
            while(!displayname){
                var displayname=prompt("Enter displayname","displayname");

            }
            localStorage.setItem("displayname",displayname);
            document.querySelector('.name').innerHTML=  'welcome '+ displayname;
            }
            else{
            document.querySelector('.name').innerHTML=  'welcome '+ displayname;

             }

            var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port);
            socket.on('connect', () => {
                document.querySelector('.createchannel-button').onclick=()=>{
                    const newchannel = document.querySelector('#creatingchannel-inputfield').value;
                    socket.emit('checkchannel',{'newchannel':newchannel});
                    return false;
                };

            });
            socket.on('channel status', data => {
                if (data.channelstatus==True) {
                    const div= document.createElement('div');
                    const channel=document.createElement('a');
                    channel.id=data.newchannel;
                    div.append(channel);
                    document.querySelector('.joinedchannel-list').append(div);
                }
                else{
                    alert(`${data.newchannel} already exists`);
                }

            });

        });




    </script>
<body>
<center><div class="name"> <div></center>

            <div class="joinedchannel-list">

            </div>
        </div>
        <form>
            <input type="text" name="createchannel" id="createchannel-inputfield" placeholder="enter channel name">
            <button  type="submit" class="createchannel-button">Create Channel</button>
        </form>
    </div>




    <div class="main">
        <div class="chat-head">
             heading
        </div>

        <div class="chat">

        </div>

        <div class="message">
            <form>
                <input type="text" name="message">
                <button onclick="send()" class="send-button">send </button>

            </form>

        </div>
    </div>
    <div style="float: right;">

    </div>



</body>
</html>

Это мой flask код: 

import os
import requests
from flask import Flask,render_template,request
from flask_socketio import SocketIO,emit

app= Flask(__name__)
app.config["SECRET_KEY"] = os.getenv("SECRET_KEY")
socketio = SocketIO(app)

channels=[]
@app.route("/")
def chat():
    return render_template("chat.html")

@socketio.on("checkchannel")
def checkchannel(data):
    newchannel = data["newchannel"]
    channelstatus=True
    for i in channels:
        if i==newchannel:
            channelstatus=False
            newchannel="name already exists ..select other name"
            emit("channel status", {"newchannel": newchannel,"channelstatus":channelstatus}, broadcast=False)

    channels.append(newchannel)
    emit("channel status", {"newchannel": newchannel, "channelstatus": channelstatus}, broadcast=True)


if __name__ == '__main__':
    socketio.run(app)

Вот что происходит, когда я загружаю страницу и пытаюсь создать канал 'channel1'. Меняется только URL-адрес, и ничего не происходит. Далее отображаемое имя также меняется на undefined и отображается 'welcome undefined'

1 Ответ

0 голосов
/ 19 июня 2020

Попробуйте использовать этот код: 

var person = prompt("Please enter your name", "Sample Name");

if (person != null) {
  document.getElementById("demo").innerHTML =
  "Hello " + person + "! How are you today?";
}

И я думаю, что вы получаете undefined, потому что в первый раз localstorage не имеет никакого значения. Поэтому вместо этого поместите его в функцию onclick

...