V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
zhng920823
V2EX  ›  分享创造

可视频 可随意创建的聊天室 聊天内容前端加密 服务端看不到

  •  
  •   zhng920823 · 107 天前 · 1595 次点击
    这是一个创建于 107 天前的主题,其中的信息可能已经有所发展或是发生改变。

    自适应移动设备和电脑浏览器

    • 电脑上就是下面的截图的样子.
    • 手机上会隐藏左边一列.

    支持私聊和视频

    • 点对应的昵称, 昵称变色, 进入私聊模式
    • 点 Group: N 返回群聊模式
    • 房间只有两个人的时候按电话按钮发起视频呼叫, 房间两人以上时需先进私聊模式才能视频.
    • 在较高版的浏览器上, 视频支持弹出画中画窗口, 可边视频边干别的.

    聊天内容包括视频通话的协商内容均加密后传输, 服务端看不到.

    • 加密密钥是通过 组名 + 密码 + saltA, 用特殊步骤计算出来的.
    • 聊天室的 ID 是用 组名 + 密码 + saltB, hash 出来的.
    大致这样的:
    Key = keygen(funcA(hashA(group_name, group_pass, salt_A)));
    RoomId = hashB(group_name, group_pass, salt_B)));
    服务端只知道 RoomId, 客户端知道 RoomId 和 key, 且无法通过 RoomId 推导 key
    所以服务端和运营商不知道聊天内容, 除非输入法或设备本身被...
    前端部分代码量不算多, 可用工具或 AI 分析并验证上述说法.
    

    没有预设的聊天室或公开的聊天室列表

    • 输入任意的 组名&密码&昵称 即可创建聊天室, 进聊天室前可获取分享链接.
    • 分享链接可任意包含 组名&密码&昵称, 如链接不含密码, 则需用其他方式传递密码.
    • 相同的 组名&密码 组合意味着相同的聊天室, 相同组名+不同密码则为不同聊天室.
    • 分享链接给朋友即可体验私密聊天, 如没有朋友可新开浏览器 tab 或用其它设备体验.

    还有什么别的用途

    • 不同设备之间传递分享文本内容.
    • 把手机或别的设备变成监控.

    Screenshots

    image image image image

    这个东西还不是开源的, 直接贴我的站点链接会封 IP, 用 Github 转一下吧 https://github.com/webd90kb/webd/tree/master/chatrooms

    12 条回复    2024-08-21 18:12:38 +08:00
    zhng920823
        1
    zhng920823  
    OP
       107 天前
    可输入 组名 密码 昵称 创建分享链接, 然后把分享链接放入收藏夹, 以后可直接点开使用.

    手机浏览器打开分享链接后, 用手机浏览器菜单的 添加到主屏幕/Add to Home Screen 可在桌面生成图标. 打开后是全屏显示的, 用起来有些类似 APP.
    zhng920823
        2
    zhng920823  
    OP
       107 天前
    webrtc 视频通话, 大多数情况下能直连.
    如果不能直连会通过 TURN 中转, 可能比较卡.
    zhng920823
        3
    zhng920823  
    OP
       107 天前
    在两端都有 IPv6 的情况下, 不管双方的光猫路由器防火墙的配置情况, 多数情况 WebRTC 是直连的.

    还有两边都是 OpenWRT 路由器, 只有一边的路由器有公网 IPv4, 跨运营商, 没有开启 uPnP, 没有配置 DMZ, 没映射端口, 关了 IPv6, 的情况下 WebRTC 也能直连. 不知道它是怎么穿透的 NAT.
    rekulas
        4
    rekulas  
       106 天前
    梦回 2006
    zhng920823
        5
    zhng920823  
    OP
       106 天前
    @rekulas #4 让你见笑了, 写前端的水平太差
    z1645444
        6
    z1645444  
       106 天前
    我去年有 po 一个帖子找类似的应用,op 目前做的看起来最接近想法,很棒,如果境内一直保持这样的访问速度就最好了,简单多端同步一些临时性的信息,极其方便,样式小小改动看起来清爽一点真是无敌了,赞个
    zhng920823
        7
    zhng920823  
    OP
       106 天前
    @z1645444 #6 多谢夸奖, 这个访问速度应该能保持住的. 只要体积够小加载就够快. 后端优化我比较擅长, 直接 C 写的 web/websocket 服务器.
    z1645444
        8
    z1645444  
       106 天前
    @zhng920823 #7 服务端是直接 C 写的吗,太硬核了😨
    zhng920823
        9
    zhng920823  
    OP
       106 天前
    @z1645444 #8 有不少积累的代码, 直接用了.
    NewYear
        10
    NewYear  
       105 天前
    @zhng920823

    UI 这块可以参考各个站点,V2 就是一个典型,我曾经注意过,一句话总结:

    多用圆角,页面用到的颜色不要太多,白底+灰色边框是最简单的搭配。

    圆角、白色背景、带点阴影,按钮也是淡灰色带颜色渐变,你看 V2 是不是就这样的一套逻辑。然后一个大背景作为点缀。。。不过聊天室不太适合搞大背景……但也可以像微信一样用一个圆角带背景色的框,把每一段话框起来。

    设计简单,不失高级感,CSS 也好写。。。。其他颜色要搭配起来比较麻烦,可能要调好久才能比较合适。
    NewYear
        11
    NewYear  
       105 天前
    楼主这个程序蛮是符合我的期待,现在各种聊天软件被监视,有的还随意封号( 3 年起步,封顶无期,说的就是 Soul App )。私有聊天软件还是蛮有必要的,能聊一些越界的话题比如如何上外网,比较轻松一点。


    突然想起 20 年前的碧海银沙聊天室。
    zhng920823
        12
    zhng920823  
    OP
       105 天前
    @NewYear #10 谢谢提醒, 我这个确实颜色鲜艳了, 尤其是登录页的. 这个站的代码写起来不费劲, 但是调整界面用了好久.
    @NewYear #11 这个东西的目的就是给人一个轻松说话的地方. 现在对一些 IM 的私聊也不放心.
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5870 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 969ms · UTC 02:36 · PVG 10:36 · LAX 18:36 · JFK 21:36
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.