当前位置：网站首页>【虚幻引擎UE】UE5实现WEB和UE通讯思路

【虚幻引擎UE】UE5实现WEB和UE通讯思路

2022-08-04 07:37:00 【兔小昀】

UE5实现WEB和UE通讯思路

两个方案，根据需求选择适合自己的：
1.UE打包为像素流页面，嵌入WEB进行通讯。
2.UE和WEB基于WEB UI插件实现通讯，打包为像素流页面。

实现效果如下 ↓
请添加图片描述

本文着重说明第二种方案。

示例项目工程文件：https://download.csdn.net/download/qq_35079107/86270090
注意使用前需要创建C++编译。

1.使用WebUI插件
在这里插入图片描述
2.创建用户控件，拖动组件进视图

3.在用户控件中编写蓝图代码
在这里插入图片描述
函数这样写。

3.在WEB中编写js代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<script src="js/UEtoWebUI.js"></script>	
        <div id="main" style="width: 1000px;height:50px;position:1px; top:1px;">BBB</div>
		<button id="btn_A" onclick="clickItem()">WEB发送消息</button>
		<script>
			window.ue = ue;
			ue4("init",'init');
			function clickItem() {
    
				ue4("clickItem",'WEB CALL');
			}
			ue.interface.finished = data=>{
    
				document.getElementById("main").innerHTML=data;
			}
		</script>
	</body>
</html>