首页 > 解决方案 > 从 URL 字符串中删除信息

问题描述

我正在创建一个聊天,但我受到了一个来源的启发,当我“登录”并且聊天出现时,它出现在 URL 中:

chat.html?username=rr&room=JavaScript 

如何确保当我进入聊天时它只看到“Chat.html”?

我尝试将此代码添加到其中,但如果有人更改,问题将是相同的,就像它是一个 GET。我如何在 POST 中做到这一点?使用 javascript 并不容易

代码:

const chatForm = document.getElementById('chat-form');
const chatMessages = document.querySelector('.chat-messages');
const roomName = document.getElementById('room-name');
const userList = document.getElementById('users');

// Get username and room from URL
const { username, room } = Qs.parse(location.search, {
    
  ignoreQueryPrefix: true,
});


const socket = io();

socket.emit('joinRoom', { username, room });

socket.on('roomUsers', ({ room, users }) => {
    outputRoomName(room);
    outputUsers(users);
});


socket.on('message', (message) => {
    console.log(message);
    outputMessage(message);

    chatMessages.scrollTop = chatMessages.scrollHeight;
});

chatForm.addEventListener('submit', (e) => {
    e.preventDefault();

    let msg = e.target.elements.msg.value;

    msg = msg.trim();

    if (!msg) {
        return false;
    }

    socket.emit('chatMessage', msg);
    
    // Clear input
    e.target.elements.msg.value = '';
    e.target.elements.msg.focus();
});

// Output message to DOM
function outputMessage(message) {
    const div = document.createElement('div');
    div.classList.add('message');
    const p = document.createElement('p');
    p.classList.add('meta');
    p.innerText = message.username;
    p.innerHTML += `<span> - ${message.time}</span>`;
    div.appendChild(p);
    const para = document.createElement('p');
    para.classList.add('text');
    para.innerText = message.text;
    div.appendChild(para);
    document.querySelector('.chat-messages').appendChild(div);
}

function outputRoomName(room) {
    roomName.innerText = room;
}

function outputUsers(users) {
    userList.innerHTML = '';
    users.forEach((user) => {
    const li = document.createElement('li');
        li.innerText = user.username;
        userList.appendChild(li);
    });
}

document.getElementById('leave-btn').addEventListener('click', () => {
    const leaveRoom = confirm('Sei sicuro di voler uscire dalla chatroom?');
    if (leaveRoom) {
        window.location = '../index.html';
    } else {
    }
});

我希望我已经很好地解释了自己,我只需要为网站添加安全性,因为这样他们就可以进入随机的“房间”,我可以放置会话吗?

标签: javascriptphphtmlnode.js

解决方案


推荐阅读