当前位置: 首页 > news >正文

远程服务和web服务和前端,三方通过socket和websocket进行双向通信传输数据

1. 什么是socket?

在计算机通信领域,socket 被翻译为“套接字”,它是计算机之间进行通信的一种约定或一种方式。通过 socket 这种约定,一台计算机可以接收其他计算机的数据,也可以向其他计算机发送数据。

2. 什么是websocket?

WebSocket是一种网络通信协议,是HTML5新增的特性,实现了基于浏览器的远程socket,使浏览器和服务器可以进行全双工通信。

3. 要实现什么样的效果?

  • socket服务端和web服务端实现数据双向通信。socket服务端可以是任何语言实现(c++、java、php、go等),任何部署方式(本机、远程)

  • web服务端(go 实现)和前端通过websocket实现数据双向通信.

  • socket服务、web服务、前端实现数据双向通信。

    前端通过websocket发送数据给web服务 -》 web服务 -》 web服务将数据通过socket推送给远程服务端

    远程服务通过socket将数据推送给web服务 -》 web服务 -》 web服务将数据通过websocket推送给前端

    远程服务和前端即使数据发送者也是接收者。

    web服务是数据中转战。(也可以处理业务需求)

4. 如何实现?

在实现三方通信数据双向通信之前,先实现

  1. 远程服务与web服务之间通过socket进行全双工通信
  2. web服务通过websocket将数据主动推送给前端并接收前端发来的数据

1. 远程服务与web服务之间通过socket进行全双工通信

socket服务可用其他任何语言实现(c++、java、php等)。这里采用go

server: 远程服务

  1. 监听
listener, err := net.Listen("tcp", "127.0.0.1:5412")
  1. 建立连接
conn, err := listener.Accept()
  1. 读 (注意: 如果数据太长,需要分片处理)
reader := bufio.NewReader(os.Stdin)
fmt.Print("请输入服务端发送的数据:")
sendinfo, err := reader.ReadString('\n')
if err != nil {fmt.Println("读取服务端要发送的数据出错!")continue
}
  1. 写入
sendinfo = strings.TrimSpace(sendinfo)
if sendinfo == "exit" {fmt.Println("退出服务端")return
}
conn.Write([]byte(sendinfo))

client: web服务

  1. 连接
conn, err := net.Dial("tcp", "127.0.0.1:5412")
for {n, err := conn.Read(buffer[:])if err != nil {fmt.Println("客户端读取socket服务端数据出错")break}fmt.Println("客户端读取socket数据是:", string(buffer[:n]))
}
  1. 写入
fmt.Print("请输入要发送给socket服务端的数据: ")
msg, err := reader.ReadString('\n')
if err != nil {fmt.Println("读取客户端要发送的数据出错!")return
}
msg = strings.TrimSpace(msg)
if msg == "exit" {fmt.Println("退出socket客户端")return
}
conn.Write([]byte(msg))

2. web服务基于websocket和前端通信

web服务

  1. 升级HTTP
ar upgrader = websocket.Upgrader{ReadBufferSize:  1024,WriteBufferSize: 1024,CheckOrigin: func(r *http.Request) bool {return true},
}ws, err = upgrader.Upgrade(w, r, nil)
func read() {for {_, p, err := ws.ReadMessage()if err != nil {log.Println(err)return}log.Println("Received message:", string(p))}
}
func write() {reader := bufio.NewReader(os.Stdin)for {fmt.Println("请输入要发送给socket服务端的数据: ")msg, err := reader.ReadString('\n')err = ws.WriteMessage(websocket.TextMessage, []byte(msg))if err != nil {log.Println(err)return}}
}

前端

var input = document.getElementById("input");
var output = document.getElementById("output");
var socket = new WebSocket("ws://localhost:1234");socket.onopen = function () {output.innerHTML += "Status: Connected\n";
};socket.onmessage = function (e) {output.innerHTML += "Server: " + e.data + "\n";
};function send() {socket.send(input.value);input.value = "";
}

3. 三方双向通信

实现了第一步和第二步就可以实现第三步,将第一步和第二步的代码进行合并即可。

唯一不同这里定义里两个无缓冲的通道.

  • 前端将数据发送给web服务,web服务拿到数据写入chanMess中。在web服务和远程服务通信期间,就可以读chanMess中的数据,然后将数据推送给远程服务

  • 远程服务将数据推送给web服务,web服务拿到数据写入socketMess中。在web服务和前端通信期间,就可以读socketMess中的数据,然后将数据推送给前端

var chanMess    = make(chan []byte) // 存储 websocket数据
var socketMess  = make(chan []byte) // 存储 socket数据

4. 完整代码可以私聊获取

相关文章:

远程服务和web服务和前端,三方通过socket和websocket进行双向通信传输数据

1. 什么是socket? 在计算机通信领域,socket 被翻译为“套接字”,它是计算机之间进行通信的一种约定或一种方式。通过 socket 这种约定,一台计算机可以接收其他计算机的数据,也可以向其他计算机发送数据。 2. 什么是websocket?…...

Linux 网络基础(2)应用层(http/https协议、请求格式、响应格式、session、cookie、加密传输)

说明:网络基础2讲解的是应用层的典型协议, 通过对于典型协议的理解,来体会数据的网络传输的软件层面的流程与原理。 面试中网络通信相关问题占了很大的比重,而网络通信相关的问题大多都集中在网络基础2这个单元中 下面是应用层的位…...

解决sshfs挂载报错

使用ssh命令和sshfs命令报错 read: Connection reset by peer rootjiangcheng01:~/common/remote# sshfs -o allow_other htrdxxx.xxx.xxx.xxx:/home/htrd /root/common/remote/dev01 read: Connection reset by peer 报错问题排查,追加命令 -o debug -o sshf s_d…...

由于过多的连接错误而被 MySQL服务器 阻止

Caused by: com.mysql.cj.exceptions.CJException: null, message from server: "Host 10.105.***.** is blocked because of many connection errors; unblock with mysqladmin flush-hosts" 这个错误可能表示当您尝试使用 IP 地址为 "10.105.***.**" 的…...

Go语言实现JDBC

Go语言操作数据库 Go语言提供了关于数据库的操作,包下有sql/driver 该包用来定义操作数据库的接口,这保证了无论使用哪种数据库,操作方式都是相同的; 准备工作: 下载驱动 需要在代码所在文件夹下执行相应的命令 go get github.com/go-sql-driver/mys…...

ubuntu修改环境变量的几种方法

ubuntu修改环境变量的几种方法 有多种方法可以修改Ubuntu系统的环境变量,包括: 临时修改环境变量:在终端中使用export命令可以临时修改环境变量。例如,要将PATH环境变量添加到新目录,可以运行以下命令: …...

基于html+css的图展示95

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…...

数据库基础——5.运算符

这篇文章我们来讲一下SQL语句中的运算符操作。 说点题外话:SQL本质上也是一种计算机语言,和C,java一样的,只不过SQL是用来操作数据库的。在C,java中也有运算符,这两种语言中的运算符和数学中的运算符差距不…...

JMeter 性能测试基本过程及示例

jmeter 为性能测试提供了一下特色: 2023年最新出炉性能测试教程,真实企业性能压测全流程项目实战训练大合集!_哔哩哔哩_bilibili2023年最新出炉性能测试教程,真实企业性能压测全流程项目实战训练大合集!共计11条视频&…...

漏洞复现 CVE-2018-2894 weblogic文件上传

vulhub weblogic CVE-2018-2894 1、 搭建好靶场,按提示访问 http://192.168.137.157:7001/console 按照给出的文档,会查看容器的日志,找到管理员用户名/密码为 weblogic / h3VCmK2L,暂时用不到,不需要登录 2、未授权…...

二叉树:填充每个节点的下一个右侧节点指针(java)

leetcode116:填充每个节点的下一个右侧节点指针 leetcode原题链接:题目描述递归解法一递归方法二(效率更高)二叉树专题 leetcode原题链接: 116题:填充每个节点的下一个右侧节点指针 题目描述 给定一个 完美二叉树 &a…...

Android 12.0修改系统默认设备类型的平板电脑类型为设备类型

1.概述 在12.0的系统rom产品开发中,对于产品设备类型都默认为tablet即平板电脑类型,即 product="tablet" 在一些不是平板的项目中,可能需要修改这个类型为device类型 即 product="device",这就需要找到相关设置系统属性的代码,修改系统属性就可以了 2…...

debug研究

debug研究 debug的condition 通常用在for循环里面 for循环中实际使用 [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UsmJ93w5-1685344057464)(D:\typora_pic_all\image-20230529145417753.png)] log.info("当前共有{}条数据待处理", vos…...

zabbix监控系统

一、Zabbix概述 1、使用zabbix的原因 作为一个运维,需要会使用监控系统查看服务器状态以及网站流量指标,利用监控系统的数据去了解上线发布的结果,和网站的健康状态。 利用一个优秀的监控软件,我们可以: ●通过一个友好的界面进…...

Python入门学习

一、执行Python(Hello World)程序 对于大多数程序语言,第一个入门编程代码便是 “Hello World!”,以下代码为使用 Python 输出 “Hello World!” 1.1 创建hello.py文件 1.2 编写程序 #!/usr/bin/python…...

自动驾驶嵌入式开发工程师:车载SOC开发修炼秘籍

声明:本文档是博主在开发学习过程中写的笔记,本意是便于以后开发复盘,参考《 ug1144-petalinux-tools-reference-guide》、《ug1085》、黑金Zynq UltraScale MPSoC 5EV开发板资料、英伟达官方资料。大佬勿喷 大佬勿喷 大佬勿喷!&a…...

Linux之搭建环境

文章目录 1 FileZilla软件2 Linux搭建samba文件共享服务器,实现基于Linux和Windows的共享文件服务2.1 smaba的安装与基本应用2.2 samba的账号权限配置2.3 win系统下的文件无法复制到Linux共享文件夹中 1 FileZilla软件 在跟着正点原子教程安装后,出现如下…...

泡利矩阵(一)

〇、厄米矩阵 厄米矩阵(Hermitian Matrix),也称为自共轭矩阵(Self-adjoint Matrix),是线性代数中的一个重要概念。它是指一个复数域上的方阵,其转置矩阵与共轭矩阵相等。 具体来说&#xff0c…...

通用支付系统设计

支付永远是一个公司的核心领域,因为这是一个有交易属性公司的命脉。那么,支付系统到底长什么样,又是怎么运行交互的呢?抛开带有支付牌照的金融公司的支付架构,下述链路和系统组成基本上符合绝大多数支付场景。其实整体可以看成是…...

metaRTC+ZLMediaKit实现webrtc的推拉流

概述 ZLMediaKit是一个基于C11的高性能运营级流媒体服务框架,是一个支持webrtc SFU的优秀的流媒体服务器系统。 metaRTC新版本支持whip/whep协议,支持whip/whep协议的ZLMediaKit推拉流。 信令通信 ZLMediaKit新版本支持whip和whep协议,支…...

Vim 调用外部命令学习笔记

Vim 外部命令集成完全指南 文章目录 Vim 外部命令集成完全指南核心概念理解命令语法解析语法对比 常用外部命令详解文本排序与去重文本筛选与搜索高级 grep 搜索技巧文本替换与编辑字符处理高级文本处理编程语言处理其他实用命令 范围操作示例指定行范围处理复合命令示例 实用技…...

Java 语言特性(面试系列1)

一、面向对象编程 1. 封装(Encapsulation) 定义:将数据(属性)和操作数据的方法绑定在一起,通过访问控制符(private、protected、public)隐藏内部实现细节。示例: public …...

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接:A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串,只有在同时为 o 时输出 Yes 并结束程序,否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

学校招生小程序源码介绍

基于ThinkPHPFastAdminUniApp开发的学校招生小程序源码,专为学校招生场景量身打造,功能实用且操作便捷。 从技术架构来看,ThinkPHP提供稳定可靠的后台服务,FastAdmin加速开发流程,UniApp则保障小程序在多端有良好的兼…...

el-switch文字内置

el-switch文字内置 效果 vue <div style"color:#ffffff;font-size:14px;float:left;margin-bottom:5px;margin-right:5px;">自动加载</div> <el-switch v-model"value" active-color"#3E99FB" inactive-color"#DCDFE6"…...

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

oracle与MySQL数据库之间数据同步的技术要点

Oracle与MySQL数据库之间的数据同步是一个涉及多个技术要点的复杂任务。由于Oracle和MySQL的架构差异&#xff0c;它们的数据同步要求既要保持数据的准确性和一致性&#xff0c;又要处理好性能问题。以下是一些主要的技术要点&#xff1a; 数据结构差异 数据类型差异&#xff…...

QT: `long long` 类型转换为 `QString` 2025.6.5

在 Qt 中&#xff0c;将 long long 类型转换为 QString 可以通过以下两种常用方法实现&#xff1a; 方法 1&#xff1a;使用 QString::number() 直接调用 QString 的静态方法 number()&#xff0c;将数值转换为字符串&#xff1a; long long value 1234567890123456789LL; …...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

Maven 概述、安装、配置、仓库、私服详解

目录 1、Maven 概述 1.1 Maven 的定义 1.2 Maven 解决的问题 1.3 Maven 的核心特性与优势 2、Maven 安装 2.1 下载 Maven 2.2 安装配置 Maven 2.3 测试安装 2.4 修改 Maven 本地仓库的默认路径 3、Maven 配置 3.1 配置本地仓库 3.2 配置 JDK 3.3 IDEA 配置本地 Ma…...