项目展示:



问题总结:
一、单用户重复登录设备

将每次输入的用户名与已经记录在后台的数组ar比较,如果存在则表示重复。

// 生成数组
var ar="";
socket.on(‘array’, function (val) {
ar = val;
// console.log(ar);
});

       if(ar.indexOf(lo.value)==-1){
sweetAlert("恭喜您,登录成功!");
socket.emit('setName', lo.value.trim());
names1(lo.value.trim());
login1.style.display="none";
document.querySelector(".bg").style.display = "none";
document.querySelector(".cd span").style.display = "none";
document.querySelector(".title img").style.display = "block";
document.querySelector(".fix").style.display = "block" ;
document.querySelector(".title").style.display = "block" ;
document.querySelector(".tit").innerText=lo.value.trim();
document.querySelector(".swal-button").onclick = function () {
document.getElementById("text").focus();
document.querySelector(".fix").addEventListener('click', function (e) {
if (e.target.nodeName === "LI"&&e.target.innerText != document.querySelector(".tit").innerText) {
document.querySelector(".fix").style.display="none";
document.querySelector(".chat_b").style.display="block";
document.querySelector(".box").style.display="block";
document.querySelector(".tit").innerText = e.target.innerText;
document.querySelector("#text").focus();
onOff=true;
}
else{
sweetAlert("不能跟自己聊天哦~");
}
})
}
}
else{ sweetAlert("不能重复登录哦!"); return }

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/118669243

关于个人全栈项目【臻美Chat】遇到的BUG以及解决方法的更多相关文章

  1. 《从零开始做一个MEAN全栈项目》(3)

    欢迎关注本人的微信公众号"前端小填填",专注前端技术的基础和项目开发的学习. 上一篇文章给大家讲了一下本项目的开发计划,这一章将会开始着手搭建一个MEAN项目.千里之行,始于足下, ...

  2. 《从零开始做一个MEAN全栈项目》(2)

    欢迎关注本人的微信公众号"前端小填填",专注前端技术的基础和项目开发的学习.   上一节简单介绍了什么是MEAN全栈项目,这一节将简要介绍三个内容:(1)一个通用的MEAN项目的技 ...

  3. 《从零开始做一个MEAN全栈项目》(1)

    欢迎关注本人的微信公众号"前端小填填",专注前端技术的基础和项目开发的学习. 在本系列的开篇,我打算讲一下全栈项目开发的优势,以及MEAN项目各个模块的概览. 为什么选择全栈开发? ...

  4. 一个关于vue+mysql+express的全栈项目(一)

    最近学了mysql数据库,寻思着能不能构思一个小的全栈项目,思来想去,于是就有了下面的项目: 先上几张效果图吧       目前暂时前端只有这几个页面,后端开发方面,有登录,注册,完善用户信息,获取用 ...

  5. 全栈项目|小书架|服务器端-NodeJS+Koa2 实现书籍详情接口

    通过上篇文章 全栈项目|小书架|微信小程序-首页水平轮播实现 我们实现了前端(小程序)效果图的展示,这篇文章来介绍服务器端的实现. 书籍详情分析 书籍详情页面如下: 从上图可以分析出详情页面大概有以下 ...

  6. 全栈项目|小书架|服务器端-NodeJS+Koa2实现首页图书列表接口

    通过上篇文章 全栈项目|小书架|微信小程序-首页水平轮播实现 我们实现了前端(小程序)效果图的展示,这篇文章来介绍服务器端的实现. 首页书籍信息 先来回顾一下首页书籍都有哪些信息: 从下面的图片可以看 ...

  7. 全栈项目|小书架|服务器开发-NodeJS 使用 JWT 实现登录认证

    通过这篇 全栈项目|小书架|服务器开发-JWT 详解 文章我们对JWT有了深入的了解,那么接下来介绍JWT如何在项目中使用. 安装 $ npm install jsonwebtoken 生成 Toke ...

  8. vue3+node全栈项目部署到云服务器

    一.前言 最近在B站学习了一下全栈开发,使用到的技术栈是Vue+Element+Express+MongoDB,为了让自己学的第一个全栈项目落地,于是想着把该项目部署到阿里云服务器.经过网上一番搜索和 ...

  9. Vue、Node全栈项目~面向小白的博客系统~

    个人博客系统 前言 ❝ 代码质量问题轻点喷(去年才学的前端),有啥建议欢迎联系我,联系方式见最下方,感谢! 页面有啥bug也可以反馈给我,感谢! 这是一套包含前后端代码的个人博客系统,欢迎各位提出建议 ...

  10. SpringBoot 整合 Elastic Stack 最新版本(7.14.1)分布式日志解决方案,开源微服务全栈项目【有来商城】的日志落地实践

    一. 前言 日志对于一个程序的重要程度不用过多的言语修饰,本篇将以实战的方式讲述开源微服务全栈项目 有来商城 是如何整合当下主流日志解决方案 ELK +Filebeat . 话不多说,先看实现的效果图 ...

随机推荐

  1. 12-factors

    12-factors 官方网址 The Twelve-Factor App 简介 如今,软件通常会作为一种服务来交付,它们被称为网络应用程序,或软件即服务(SaaS).12-Factor 为构建如下的 ...

  2. 论文解读(S^3-CL)《Structural and Semantic Contrastive Learning for Self-supervised Node Representation Learning》

    论文信息 论文标题:Structural and Semantic Contrastive Learning for Self-supervised Node Representation Learn ...

  3. Mybatis结果集映射问题

    之前的数据库图简单都是纯小写格式,这一次做项目为了显得正规一些,模拟实际的情况,采用了驼峰命名的规则,这时候就遇到了结果匹配的问题. 之前只要 <select id="select&q ...

  4. Codeforces Round #721 (Div. 2)A. And Then There Were K(位运算,二进制) B1. Palindrome Game (easy version)(博弈论)

    半个月没看cf 手生了很多(手动大哭) Problem - A - Codeforces 题意 给定数字n, 求出最大数字k, 使得  n & (n−1) & (n−2) & ...

  5. Sql语言-操作表

    2. 操作表 1. C(Create):创建 1. 语法: create table 表名( 列名1 数据类型1, 列名2 数据类型2, .... 列名n 数据类型n ); * 注意:最后一列,不需要 ...

  6. Android第五六周作业

    1.返回键实现对话框弹出是否退出应用程序 package com.example.zuoye1; import androidx.appcompat.app.AlertDialog; import a ...

  7. 数据建模软件Chiner,颜值与实用性并存

    目录 一.chiner介绍 二.值得关注的功能点 2.1. 兼容各种格式的数据建模文件 2.2. 支持多数据库.代码生成 2.3. 支持逻辑视图与物理视图设计 2.4. 自动生成数据库文档 三.总结 ...

  8. petite-vue源码剖析-逐行解读@vue-reactivity之effect

    当我们通过effect将副函数向响应上下文注册后,副作用函数内访问响应式对象时即会自动收集依赖,并在相应的响应式属性发生变化后,自动触发副作用函数的执行. // ./effect.ts export ...

  9. 二叉查找树速通攻略 图文代码精心编写(Java实现)

    说在前面 如题目所言 这篇文章为了给下一篇二叉查找数做铺垫和前期知识准备,以便大家有良好的阅读体验,本来想合在一起的,但觉得有些长,所以就拆开了哈哈哈,还是新手向,两篇文章有些长,但如果能认真看下去, ...

  10. Linux系统常用命令速查手册

    点击上方"开源Linux",选择"设为星标" 回复"学习"获取独家整理的学习资料! 系统信息 arch      #显示机器的处理器架构(1 ...