xTrans: 可能是比较快的手机、PC在线文字传输

xTrans是一款基于nodejs的跨平台文字传输工具,旨在简化手机到电脑或反之的文字传输。通过被动返回消息机制,实现两端实时通讯。前端利用AJAX与后端交互,支持快捷的复制粘贴功能,如PC端Ctrl+C自动粘贴提交,手机端点击消息即可复制。虽然最初计划的自动粘贴功能受限于浏览器权限,但整体实现了简洁高效的传输体验。未来考虑使用socket提升效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

简介

闲来无事,想起之前总是需要手机的文字发送至电脑,或者电脑发送至手机,使用的均为QQ或微信,总觉麻烦,就萌生了写一个工具的想法。加上nodejs需要学,就用这几天时间构思了一个基于nodejs的多终端文字传输工具:xTrans

[DEMO:放在了HEROKU上的测试页]

[源码:GITHUB:]
感兴趣的同学可以挑战我杂乱的代码

结构

起初没想到要用nodejs,php对于我来说是极好的,但是一想github只支持静态页面,demo放到哪成了问题。想到heroku自己还没用过,从它的支持列表里看到了nodejs,于是决定用nodejs当后端,顺便学习一下。

思来想去,形成下图
xTrans

后端

在研究了一些nodejs教程后,搭了一个简单的HTTP服务器,主要有返回post/get请求和返回文档流两个功能。

对于两个终端间的连接,采用的是被动返回消息。当一个房间初始化后,前端会不停的向后端发送请求,如果当前房间的数组内有信息,就以post方式返回给请求者,这样就完成了消息的发送。简而言之,谁请求,给谁信息。

类似的,房间初始化也是先随机生成一个ID,不停的请求ID状态,若有第二个人加入当前ID,即请求此ID状态,后端就会返回给两个访问者一个开始通讯的标志,这时通讯就建立了。

整个实验过程中后端没有遇到太大的难度。

前端

第一次访问时要随机生成二维码,这是用现成的JS插件做的。建立通讯后,发送消息和接收消息是同一个页面。这些内容都是ajax向nodejs后端发送post请求,后端会根据房间状态和消息内容给予信息反馈。

整个机制就是这样的,非常简单。在完成逻辑后,我又找了个切换特效加到页面上,微调了许多小地方,最终形成一个完整的应用。

复制粘贴

前一段研究的粘贴板相关都用到了这里面,包括监听粘贴,execComand复制等。比如在PC端,准备就绪时,只需按Ctrl C便可自动粘贴并提交;对于接收信息,直接单击消息即可完成复制,无需选取。
在我研究这个内容时,我已经想到了这个应用,当时的构想是手机打开一个网页,在粘贴板已经复制到需要传输的信息时,直接摇晃手机,即可进行发送。PC端一接收到信息,便可自动复制到粘贴板,整个操作过程只需1s。
但是之前研究发现,网页限制了粘贴权限,而在写这个应用的时候,又发现连复制也有权限限制,只能有用户触发才可以。
实践出真知啊。

小结

在我想好结构后,看了一些其他的nodejs的代码,发现其实可以使用nodejs的socket进行通讯,这样会成倍的提高效率,有机会用在以后的维护升级中。

heroku什么的之前也没用过,百度几个文章时间新旧不一,说法不同。最终还是看官网的教程,自己尝试出来的,看来今后学习研究什么,还是以官网文档为主才是正确的方向。

整个研究过程中基本没什么困难,只是有些小的CSS和JS上的毛病,有状态加上细心就可以搞定。同时也应了书上一句话,很多想法都是在具体操作中延伸出来的。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值