UE 像素流UE与JS互相通信

谁在敲打我的窗丶

已于 2023-11-11 09:52:34 修改

阅读量999

点赞数 1

分类专栏： UE像素流文章标签： javascript 前端开发语言 ue5 ue4

于 2023-06-20 15:58:57 首次发布

本文链接：https://blog.csdn.net/weixin_42439888/article/details/131308505

版权

UE像素流专栏收录该内容

3 篇文章 1 订阅

订阅专栏

欢迎来到我的博客记录学习过程中遇到的问题
UpUpUppppppp

测试版本UE5.0.3
UE通信JS
ue把数据传输到js

前端添加代码：
在app.js start()方法中添加监控事件

 addResponseEventListener("UECallJS",myTest1Function)

移除监听

  removeResponseEventListener("UECallJS")

function myTest1Function(data)
{
    console.log(data)
    // if(data=="UECallJS")
    // {
    //     console.log(data)
    // }
}

在这里插入图片描述
UE中添加蓝图：
创建一个Actor并且添加"PixelStreamingInput"的组件，把Actor放入场景中
使用SendPixelStreamingResponse节点把UE中的数据传输到JS端

点击UE中的按钮JS会进行打印UE传输过来的数据

JS通信UE
JS把数据传输到UE中
前端添加代码：
在player.html 找到load()方法，添加一个按钮，并且绑定事件myTest2Function(参数1，参数2)

<div id="overlay" class="overlay text-light bg-dark">
			<div id="overlayHeader">
				<input type="button" value="JSCallUE" onclick="myTest2Function(2,5)">
			</div>
		</div>

在这里插入图片描述
在app.js中添加myTest2Function(category, item)方法

function myTest2Function(category, item)
{
    let descriptor = {
        Category: category,
        Item: item
    };
    emitUIInteraction(descriptor);
    console.log(descriptor);
}

在这里插入图片描述
UE添加蓝图：
绑定像素流输入事件，监听JS传过来的数据
使用GetJsonStringValue节点解析JS传入过来的数据
Descriptor:JS传过来的数据
FieldName:JS端传过来的字段名类似Json取值，键值对形式
StringValue:FieldName所对应的值
在这里插入图片描述