v-rep--websocket接口

websocket是什么

V-REP 中的 Web Socket 是一种用于在 V-REP 和外部应用程序之间进行通信的协议和技术。Web Socket 基于 TCP 连接,可以提供双向、实时的数据传输,适用于互动性或实时交互性应用。

(比如v-rep在云服务器上运行,通过websocket和用户所使用的web前端通信)

什么是云仿真

就是将v-rep的仿真程序发送到云服务器上,借助云服务器更好的硬件设备更高效地运行v-rep程序,用户可以从云服务器上获取需要的v-rep数据。

使用云仿真是将 V-REP 的仿真环境迁移到云端,让 V-REP 在云服务器上进行运行,用户通过互联网,通过浏览器等远程接入云端的 V-REP环境来完成仿真操作。因此,使用云仿真不需要将 V-REP 的程序发送到云服务器上运行,而是将 V-REP 的仿真环境放到云端进行运行,用户可以通过互联网访问云端的 V-REP 环境,进行仿真任务,而不需要在本地计算机上安装和配置 V-REP 软件。

什么是云端

云端(Cloud)指的是互联网上的远程服务器,也被成为"云服务器",是封装计算资源的虚拟化环境。云端提供了一个集中式的存储、管理和运行数据和应用程序的平台,用户可以通过互联网访问这些数据和应用程序。

《互联网上用于管理,存储,运行数据的服务器》

websocket在v-rep中的作用

完成云服务器上v-rep仿真和web浏览器之间的通信。

websocket的实现

v-rep内部websocket实现(服务端)

wsRemoteAPI

源码链接

sim = require 'sim'
removeLazyLoaders()

wsRemoteApi = {}
//获取wsRemoteApi.verbose这个v-rep全局参数的值,无值返回0
function wsRemoteApi.verbose()
    return sim.getNamedInt32Param('wsRemoteApi.verbose') or 0
end

function wsRemoteApi.require(name)
    _G[name] = require(name)
end

function wsRemoteApi.info(obj)
    if type(obj) == 'string' then obj = wsRemoteApi.getField(obj) end
    if type(obj) ~= 'table' then return obj end
//~=  :表示不等于
    local ret = {}
    for k, v in pairs(obj) do
        if type(v) == 'table' then
            ret[k] = wsRemoteApi.info(v)
        elseif type(v) == 'function' then
            ret[k] = {func = {}}
        elseif type(v) ~= 'function' then
            ret[k] = {const = v}
        end
    end
    return ret
end
/*
该函数接受一个字符串类型的参数 `f`,表示要获取的值的键。在 Lua 语言中,字符串类似于表中的字段名,可以作为表索引来访问对应的值。例如,`_G['print']` 可以获取 Lua 语言中的 `print` 函数。

在函数体内部,首先将 `_G` 赋值给变量 `v`,表示从全局变量表开始查找。然后通过 `string.gmatch` 函数循环遍历字符串类型的键 `f` 中所有的单词和下划线,以及它们出现的顺序。

在每次循环中,根据单词获取表 `v` 中对应的值,并将其赋值给变量 `v`。如果在遍历的过程中遇到了 `v` 为空(`nil`)的情况,则说明字符串类型的键在 `_G` 全局变量表中不存在,于是返回 `nil`。最后返回变量 `v`,表示找到了对应的值,并将其返回。
*/
//获取key(f)对应的value
function wsRemoteApi.getField(f)
    local v = _G
    for w in string.gmatch(f, '[%w_]+') do
        v = v[w]
        if not v then return nil end
    end
    return v
end

function wsRemoteApi.handleRequest(req)
    if wsRemoteApi.verbose() > 1 then print('request received:', req) end
    local resp = {}
    resp['id'] = req['id']
    if req['func'] ~= nil and req['func'] ~= '' then
        local func = wsRemoteApi.getField(req['func'])
        local args = req['args'] or {}
        if not func then
            resp['error'] = 'No such function: ' .. req['func']
        else
            local status, retvals = pcall(
                                        function()
                    local ret = {func(unpack(args))}
                    return ret
                end
                                    )
            resp[status and 'ret' or 'error'] = retvals
        end
    elseif req['eval'] ~= nil and req['eval'] ~= '' then
        local status, retvals = pcall(
                                    function()
                local ret = {loadstring('return ' .. req['eval'])()}
                return ret
            end
                                )
        resp[status and 'ret' or 'error'] = retvals
    end
    resp['success'] = resp['error'] == nil
    if wsRemoteApi.verbose() > 1 then print('returning response:', resp) end
    return resp
end

function onWSMessage(server, connection, message)
    local rawReq = message

    -- if first byte is '{', it *might* be a JSON payload
    if rawReq:byte(1) == 123 then
        local req, ln, err = json.decode(rawReq)
        if req ~= nil then
            local resp = wsRemoteApi.handleRequest(req)
            resp = json.encode(resp)
            simWS.send(server, connection, resp, simWS.opcode.text)
            return
        end
    end

    -- if we are here, it should be a CBOR payload
    local status, req = pcall(cbor.decode, rawReq)
    if status then
        local resp = wsRemoteApi.handleRequest(req)
        resp = cbor.encode(resp)
        -- resp=sim.packTable(resp,1)
        simWS.send(server, connection, resp, simWS.opcode.binary)
        return
    end

    sim.addLog(sim.verbosity_errors, 'cannot decode message: no suitable decoder')
    return ''
end

function wsRemoteApi.publishStepCount()
    -- if wsRemoteApi.verbose()>1 then
    --    print('publishing simulationTimeStepCount='..simulationTimeStepCount)
    -- end
end

function sysCall_info()
    return {
        autoStart = sim.getNamedBoolParam('wsRemoteApi.autoStart') ~= false,
        menu = 'Connectivity\nWebSocket remote API server',
    }
end

function sysCall_init()
    simWS = require 'simWS'
    port = sim.getNamedInt32Param('wsRemoteApi.port') or 23050
    if wsRemoteApi.verbose() > 0 then
        sim.addLog(
            sim.verbosity_scriptinfos,
            string.format('WebSocket Remote API server starting (port=%d)...', port)
        )
    end
    json = require 'dkjson'
    -- cbor=require 'cbor' -- encodes strings as buffers, always. DO NOT USE!!
    cbor = require 'org.conman.cbor'
    wsServer = simWS.start(port)
    simWS.setMessageHandler(wsServer, 'onWSMessage')
    if wsRemoteApi.verbose() > 0 then
        sim.addLog(sim.verbosity_scriptinfos, 'WebSocket Remote API server started')
    end
    stepping = false
end

function sysCall_cleanup()
    if not simWS then return end
    if wsServer then simWS.stop(wsServer) end
    if wsRemoteApi.verbose() > 0 then
        sim.addLog(sim.verbosity_scriptinfos, 'WebSocket Remote API server stopped')
    end
end

function sysCall_addOnScriptSuspend()
    return {cmd = 'cleanup'}
end

function sysCall_addOnScriptSuspended()
    return {cmd = 'cleanup'}
end

function sysCall_nonSimulation()
end

function sysCall_beforeMainScript()
    local outData
    if stepping then
        outData = {doNotRunMainScript = not go}
        go = nil
    end
    return outData
end

function sysCall_beforeSimulation()
    simulationTimeStepCount = 0
    wsRemoteApi.publishStepCount()
end

function sysCall_actuation()
    simulationTimeStepCount = simulationTimeStepCount + 1
    wsRemoteApi.publishStepCount()
end

function sysCall_afterSimulation()
    stepping = false -- auto disable sync. mode
end

function setStepping(enable)
    stepping = enable
    go = nil
end

function step()
    go = true
end

wsRemoteAPI中的接口sysCall_init()调用simWS的start接口建立连接。

那么sysCall_init什么时候被执行呢?

v-rep启动的时候就会自动启动连接的监听。

simWS

源码链接

从这个插件的start函数中可以看出,调用start,server端就会listen,然后accept,建立连接。

服务端代码启动流程

1,监听启动

1-1,v-rep启动----调用wsRemoteAPI中的接口sysCall_init(),其中调用simWS的start接口监听,建立连接。

2,事件监听启动

onInstancePass中调用webSocket::server对象的poll接口进行事件监听。

onInstance由v-rep自动调用。

verbose

在 V-REP 中,`wsRemoteApi.verbose()` 函数用于设置或获取远程 API 调用时的日志输出级别。日志输出级别是一个整数值,决定了在进行远程 API 调用时打印哪些日志信息,以便于调试和问题定位。

常见的远程 API 日志输出级别如下:

  • 0:不输出任何信息;

  • 1:输出仅关键信息,如连接建立和断开等;

  • 2:输出详细调用信息,如函数名、参数等;

  • 3:输出所有信息,包括调试和错误信息。

浏览器前端websocket实现和接口调用(客户端)

前端怎么打开网页

html双击就会自动使用浏览器打开,浏览器打开就会自动执行html。

(选择Edge浏览器快一些)

客户端代码启动流程

前端页面显示肯定是通过加载html文件,通过解析html文件显示页面的。

前端通过在html中切入js语言,浏览器自动解析并执行。

client端(前端)建立连接只需要两步

1,建立RemoteAPIClient对象;

2,调用RemoteAPIClient中的WebSocketAsPromised对象的open接口发起连接。

前端html中的js建立RemoteAPIClient对象,调用对象open()发起和server的连接,利用这个对象---和服务端建立连接和通信。

        <script>
            const log = (what) => $('#log').append(`${what}\n`);
            (async () => {
                var client = new RemoteAPIClient('localhost', 23050, 'json');
                log('Connecting...');
                await client.websocket.open();
                log('Getting proxy object "sim"...');
                var sim = await client.require('sim');
                log('Calling sim.getObject("/Floor")...');
                var [h] = await sim.getObject('/Floor');
                log(`Result: ${h}`);
            })();
        </script>
client端事件发送

RemoteAPIClient对象中的call接口调用WebScoketAsPromised对象的sendRequest接口发送数据,并等待server端执行返回执行结果数据。

RemoteAPIClient
"use strict";

const WebSocketAsPromised = require('websocket-as-promised');

class RemoteAPIClient {
    //编解码方式(默认为 'cbor')
    constructor(host = 'localhost', port = 23050, codec = "cbor", opts = {}) {
        this.host = host;
        this.port = port;
        this.codec = codec;
        var packMessage;
        var unpackMessage;
        /*
        则使用 CBOR 序列化和反序列化库 `CBOR.encode` 和 `CBOR.decode`
         进行编解码。`packMessage` 为一个函数,将传入的数据进行 CBOR 编码,
         并返回编码后的结果。`unpackMessage` 为一个异步函数,将传入的数据进
         行 CBOR 解码,并返回解码后的结果。

         如果编解码方式为 `'json'`,则使用 JavaScript 原生的 JSON 序列化和
         反序列化函数 `JSON.stringify` 和 `JSON.parse` 进行编解码。
        */
        if(this.codec == 'cbor') {
            //this.websocket.binaryType = "arraybuffer";
            packMessage = data => CBOR.encode(data);
            unpackMessage = async data => CBOR.decode(await data.arrayBuffer());
        } else if(this.codec == "json") {
            packMessage = data => JSON.stringify(data);
            unpackMessage = data => JSON.parse(data);
        }
        var wsOpts = {
            packMessage,
            unpackMessage,
            // attach requestId to message as `id` field
            attachRequestId: (data, requestId) => Object.assign({id: requestId}, data),
            // read requestId from message `id` field
            extractRequestId: data => data && data.id,
        };
        for(var k in opts)
            wsOpts[k] = opts[k];
        this.websocket = new WebSocketAsPromised(`ws://${this.host}:${this.port}`, wsOpts);
    }
/*
使用 `await` 关键字等待该 Promise 对象执行完成并获取响应结果,保存在变量
 `reply` 中。
 在该方法中,使用了 `async` 关键字将 `call` 方法标记为异步函数,使其返回一个 
 Promise 对象。在调用 `await` 时,控制权会交给引擎,等待 WebSocket 通信的异
 步操作完成,并返回一个响应结果
*/
//函数调用,传递函数名和参数
    async call(func, args) {
        var reply = await this.websocket.sendRequest({func, args});
        if(reply.success) {
            return reply.ret;
        } else {
            throw reply.error;
        }
    }
/*
返回name所对应的值,name可能是一个普通变量,也可能是一个建值对的key,或者其他
js对象
*/
    async getObject(name) {
        var r = await this.call('wsRemoteApi.info', [name]);
        return this.getObject_(name, r[0]);
    }

    async require(name) {
        await this.call('wsRemoteApi.require', [name]);
        return await this.getObject(name);
    }

    getObject_(name, _info) {
        const client = this;
        var ret = {}
        for(let k in _info) {
            var v = _info[k];
            if(Object.keys(v).length == 1 && v['func'] !== undefined)
                ret[k] = async function(...args) {
                    return await client.call(name + "." + k, args);
                };
            else if(Object.keys(v).length == 1 && v['const'] !== undefined)
                ret[k] = v['const'];
            else
                ret[k] = this.getObject(name + "." + k, null, null, v);
        }
        return ret
    }
}
WebSocketAsPromised

`WebSocketAsPromised` 是一个第三方 JavaScript 库,用于实现基于 Promise 的 WebSocket 连接。

标准的 WebSocket API 使用回调函数来处理事件,例如在连接建立时调用 `onopen` 回调函数,在收到消息时调用 `onmessage` 回调函数等。而使用 `WebSocketAsPromised` 库可以直接返回 Promise 对象来处理 WebSocket 相关的操作,这种写法更符合现代 JavaScript 中基于 Promise 或 async/await 的编程风格,更易于编写和维护。

在这段代码中,`this.websocket` 保存了一个 `WebSocketAsPromised` 类型的对象,表示当前客户端的 WebSocket 连接。`WebSocketAsPromised` 的构造函数需要传递两个参数:WebSocket 的 URL 和 WebSocket 配置对象。其中,URL 参数表示要连接的 WebSocket 服务器的地址和端口号,`wsOpts` 参数为可选参数对象,用于配置 WebSocket 的一些选项,如超时时间、心跳间隔等。

通过创建基于 Promise 的 `WebSocketAsPromised` 类型的对象,可以使用 `async/await` 等方式来处理 WebSocket 连接的事件处理和错误处理,让代码更加简洁、易读和可维护。

open()函数的作用

用于client对端发起连接,和远程server建立连接。

        <script>
            const log = (what) => $('#log').append(`${what}\n`);
            (async () => {
                var client = new RemoteAPIClient('localhost', 23050, 'json');
                log('Connecting...');
                await client.websocket.open();
                log('Getting proxy object "sim"...');
                var sim = await client.require('sim');
                log('Calling sim.getObject("/Floor")...');
                var [h] = await sim.getObject('/Floor');
                log(`Result: ${h}`);
            })();
        </script>
如果open连接失败

如果`open()`连接失败,`open()` 后面的代码不会执行,而是会抛出异常。在这个案例中,如果`await client.websocket.open()`连接失败,控制台会输出一个错误或异常信息,即不会输出"Getting proxy object "sim"..."或"Result: ${h}"。

这是因为`await`关键字会等待异步方法的执行结果,如果异步方法出现错误或异常,则会阻塞当前线程并将错误或异常抛出,因此,如果`open()`连接失败,则异步 `async () => {...}` 函数的执行会被中止,后续的代码也不会执行。

对于上面的代码,如果server端没打开,client端一直处于Connecting

websocketpp

pp---cpp

websocket提供了封装好了client和server从链接建立,数据监听,通信到结束通信的对象和接口。

资料链接

讲解

用户手册

html和js

一般情况下,前端加载 HTML 文件时,其中的 JavaScript 代码就会被自动执行。这是因为 HTML 中的 `<script>` 标签会被浏览器自动解析并执行其中的 JavaScript 代码

当浏览器解析 HTML 文件时,碰到 `<script>` 标签时会自动执行其中的脚本。如果 `<script>` 标签中带有 `src` 属性,则浏览器会根据该属性的值加载外部 JavaScript 文件,并自动执行其中的代码 。如果 `<script>` 标签内部有 JavaScript 代码,则直接执行其中的代码。

需要注意的是,当浏览器加载 JS 文件时,会阻塞 HTML 页面的渲染。如果 JavaScript 代码很长或运行时间很长,可能会导致页面出现卡顿的现象。为了避免这种情况,可以将 JavaScript 代码放到页面底部,在 HTML 元素加载完毕后再执行。另外,也可以使用异步加载技术,如 `<script async src="xxx.js"></script>` 让 JS 文件在后台异步加载,避免阻塞页面渲染。

eg:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>CoppeliaSim remote API client</title>
    </head>
    <body>
        <div id="log" style="white-space: pre"></div>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/gh/spaceify/cbor-js@master/cbor.js" integrity="sha512-0ABB8mRQj73e8+aaUzonPYnP34/YsUCf6SGUJp/pj5BUXttDonDIvCI7XuC7C27Qem6yRpzIzTlq8kJSlUNjoQ==" crossorigin="anonymous"></script>
        <script src="WebSocketAsPromised.bundle.js"></script>
        <script src="RemoteAPIClient.js"></script>
        <script>
            const log = (what) => $('#log').append(`${what}\n`);
            (async () => {
                var client = new RemoteAPIClient('localhost', 23050, 'json');
                log('Connecting...');
                await client.websocket.open();
                log('Getting proxy object "sim"...');
                var sim = await client.require('sim');
                log('Calling sim.getObject("/Floor")...');
                var [h] = await sim.getObject('/Floor');
                log(`Result: ${h}`);
            })();
        </script>
    </body>
</html>

这是一个基于 JavaScript 的 V-REP 远程 API 客户端示例,用于在网页中通过 JavaScript 调用 V-REP 中的场景对象和函数。

在代码中,首先定义了一个 `log` 函数,用于在页面上输出调试信息。然后使用 `async` 函数和箭头函数等语法定义了一个立即执行的异步函数,其中包含了调用 V-REP 远程 API 的过程。

在异步函数中,首先创建了一个名为 `client` 的 `RemoteAPIClient` 对象,用于与 V-REP 中的远程 API 服务建立连接。其中 `localhost` 表示连接本地计算机,`23050` 表示连接的端口号,`json` 表示使用 JSON-RPC 协议进行通信。

然后使用 `client.require('sim')` 函数获取到远程 API 的命名空间 `sim`,该命名空间包含了 V-REP 中预定义的各种对象和函数。最后使用 `sim.getObject('/Floor')` 函数获取到名为 `/Floor` 的场景对象,将结果保存到变量 `h` 中。

在获取到结果后,调用 `log` 函数将结果输出到页面上。

js调用加载lua模块,调用lua接口实现及原理

最终的实现是通过三方库定义的WebSocketAsPromised接口sendRequest()向服务端发送需要调用的接口和参数,服务端接收到请求之后,会执行需要调用的接口,并返回执行接口返回的内容。

因为我们v-rep中的RemoteAPIClient指定了序列化和反序列化,所以即使调用Lua或者c++接口,反序列化之后就可以变为js所对应的数据。

class RemoteAPIClient {
    //编解码方式(默认为 'cbor')
    constructor(host = 'localhost', port = 23050, codec = "cbor", opts = {}) {
        this.host = host;
        this.port = port;
        this.codec = codec;
        var packMessage;
        var unpackMessage;
        /*
        则使用 CBOR 序列化和反序列化库 `CBOR.encode` 和 `CBOR.decode`
         进行编解码。`packMessage` 为一个函数,将传入的数据进行 CBOR 编码,
         并返回编码后的结果。`unpackMessage` 为一个异步函数,将传入的数据进
         行 CBOR 解码,并返回解码后的结果。

         如果编解码方式为 `'json'`,则使用 JavaScript 原生的 JSON 序列化和
         反序列化函数 `JSON.stringify` 和 `JSON.parse` 进行编解码。
         
        数据传输格式使用json,无论数据来自lua函数返回还是c++函数返回,JSON.parse都解析为
        js数据。
        */
        if(this.codec == 'cbor') {
            //this.websocket.binaryType = "arraybuffer";
            packMessage = data => CBOR.encode(data);
            unpackMessage = async data => CBOR.decode(await data.arrayBuffer());
        } else if(this.codec == "json") {
            packMessage = data => JSON.stringify(data);
            unpackMessage = data => JSON.parse(data);
        }
        var wsOpts = {
            packMessage,
            unpackMessage,
            // attach requestId to message as `id` field
            attachRequestId: (data, requestId) => Object.assign({id: requestId}, data),
            // read requestId from message `id` field
            extractRequestId: data => data && data.id,
        };
        for(var k in opts)
            wsOpts[k] = opts[k];
        this.websocket = new WebSocketAsPromised(`ws://${this.host}:${this.port}`, wsOpts);
    }

客户端怎么调用接口的

通过html中执行js代码。

方式1:先加载模块,再通过模块加载模块中定义的接口。

插件中的返回值通过js获取

直接在js中定义与调用的函数返回的类型对应的js变量接收返回值即可。

                //getInfo返回数组
                var [info]=await simTest.getInfo();
                log(`info length: ${info.length}`);
                for(var i=0;i<info.length;++i){
                    log(`getInfo: ${info[i]}`);
                }
相关推荐
hgdlip3 分钟前
手机IP地址:定义、查看与切换方法
网络协议·tcp/ip·智能手机
dengjiayue3 小时前
tcp 的重传,流量控制,拥塞控制
网络协议·tcp/ip
咕德猫宁丶4 小时前
探秘Xss:原理、类型与防范全解析
java·网络·xss
黑子哥呢?5 小时前
Linux---防火墙端口设置(firewalld)
linux·服务器·网络
hellojackjiang20115 小时前
开源轻量级IM框架MobileIMSDK的鸿蒙NEXT客户端库已发布
网络·即时通讯·im开发·mobileimsdk-鸿蒙端
WebDeveloper20016 小时前
如何使用美国域名中心US Domain Center和WordPress创建商业网站
运维·服务器·css·网络·html
车载诊断技术7 小时前
电子电气架构 --- 什么是EPS?
网络·人工智能·安全·架构·汽车·需求分析
KevinRay_7 小时前
Python超能力:高级技巧让你的代码飞起来
网络·人工智能·python·lambda表达式·列表推导式·python高级技巧
2301_819287128 小时前
ce第六次作业
linux·运维·服务器·网络
CIb0la8 小时前
GitLab 停止为中国区用户提供 GitLab.com 账号服务
运维·网络·程序人生