UE像素流通过URL地址传递参数解决方案
在使用UE自带的像素流解决方案时,虽然效果一般,但是还能凑活用,最近在实际项目中,需要通过配对服务器的URL地址传递参数,本文以传递token为例。
例如:下方地址为配对服务器(Matchmaker)的访问地,希望通过URL中带参的方式,将token传递给UE
http://192.168.100.78:8081/?token=666
此时需要解决的问题有以下几个?
1、Matchmaker获取URL地址中的token参数
2、Matchmaker在重定向到信令服务器(SignallingWebServer)时,将token一起带过去
3、SignallingWebServer将token传递给UE(这部分可以参考UE官网的使用教程像素流送)
下面我重点说一下问题1和问题2的解决方案,Matchmaker服务和SignallingWebServer服务都是使用node来实现的,所以公司如果有使用node开发栈的同事,处理起来会比较简单,如果没有的话,可以参考我下方的解决方案。
问题一:
找到matchmaker.js文件,这里就是matchmaker和核心逻辑。
image.png
找到下图代码处,此处内容是Matchmaker重定向到信令服务器的路由地址。
image.png
将此处代码修改为下图所示,这样重定向的路由地址中会携带token参数,这样第一个问题就解决了。
image.png
${req.query.token} //此部分代码含义为:获取URL地址上的token参数
res.redirect(`http://${cirrusServer.address}:${cirrusServer.port}?token=${req.query.token}`);
问题二:
问题一解决后,会发现token会被重定向到信令服务器的路由地址上,如图所示
image.png
这时候,找到信令服务的player.html文件。
image.png
打开player.html,在<head></head>标签中增加截取url中token的代码
image.png
实际项目中,有可能遇到由于UE程序启动时机问题,造成的UE没有正常收到player.html发送过来的token。所以增加了每500毫秒发送一次,UE成功接收到token后,会给player.html发送一条接收成功的指令。
同时UE侧也需要在EventBeginPlay后,定时给player.html发送请求token的指令。
<script>
//获取url地址中的token参数
function GetQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
var context = "";
if (r != null)
context = decodeURIComponent(r[2]);
reg = null;
r = null;
return context == null || context == "" || context == "undefined" ? "" : context;
}
console.log("信令服务器收到token:" + GetQueryString("token"));
//ue成功收到token
let token_success = false;
function myHandleResponseFunction(data) {
//获取token
if (data === "get_token") {
//信令服务轮询给UE发送token
let token = {token: GetQueryString("token")};
let timer = setInterval(() => {
if (!token_success) {
console.log("信令服务器尝试发送token给ue:" + GetQueryString("token"));
emitUIInteraction(token);
} else {
console.log("信令服务器停止发送token给ue");
clearInterval(timer);
timer = null;
}
}, 500);
//ue成功收到token
} else if (data === "token_success") {
console.log("ue成功收到token");
token_success = true;
}
}
//监听UE发送过来的消息
addResponseEventListener("handle_responses", myHandleResponseFunction);
</script>
注意:除了通过player.html来和UE通信,直接修改信令服务的源码,通过监听和UE的连接状态来传递token也是可以的,可惜本人非前端出身,没有再往下去研究,有大佬通过这种方式解决了可以留个言撒。
UE像素流使用教程可以参考B站上的一位大佬,写的非常详细
UE4像素流送