愛鋒貝

標(biāo)題: UE4.27 UE5 像素流送新人向教程，手把手帶你避坑 [打印本頁]
作者: 慧聰師太    時(shí)間: 2022-9-21 08:10
標(biāo)題: UE4.27 UE5 像素流送新人向教程，手把手帶你避坑
近期因?yàn)橐幚硐袼亓魉拖嚓P(guān)工作，所以整理了一下UE4.27像素流送的流程，本教程雖然使用UE4.27版本，按理說UE5應(yīng)該暫時(shí)也沒有什么使用方式上的變化。
再就是因?yàn)楣揪W(wǎng)絡(luò)限制，所以我只記錄了3個(gè)應(yīng)用場(chǎng)景：
如果了解這幾個(gè)場(chǎng)景的工作原理，配置公網(wǎng)多實(shí)例場(chǎng)景應(yīng)該很輕松，無非就是開通特定端口與配置公網(wǎng)IP，有其他大佬教程，可以參考食用，因?yàn)槲覜]有實(shí)踐，所以此文不做過多贅述，這篇文章主要是想手把手教你理解像素流送如何配置與應(yīng)用，更全面更理論性的像素流送可以參考大佬文章。
當(dāng)然也不要忘記還有官方文檔可以參考
準(zhǔn)備工作：
打開UE4引擎，找到插件菜單。

(, 下載次數(shù): 14)
搜索Pixel Streaming像素流送，啟用插件，然后重啟引擎

(, 下載次數(shù): 10)
打開項(xiàng)目設(shè)定

(, 下載次數(shù): 13)
找到Input -> Always Show Touch Interface（一直顯示觸控界面），如果你打算使用手機(jī)來流送畫面，建議開啟。

(, 下載次數(shù): 11)
找到編輯器偏好

(, 下載次數(shù): 14)
找到Play -> Play in Standalone Game -> Additional Launch Parameters
在里面加入下面后綴
-AudioMixer -PixelStreamingIP=localhost -PixelStreamingPort=7777

(, 下載次數(shù): 12)
*稍微解釋一下這里：
當(dāng)我們點(diǎn)擊Play選項(xiàng)中的Standalone Game的時(shí)候，其實(shí)就是在編輯器之外的獨(dú)立版本啟動(dòng)游戲，所以點(diǎn)擊后你能看見類似打包游戲一樣的界面，執(zhí)行完畢后他才會(huì)開始運(yùn)行獨(dú)立的游戲。

(, 下載次數(shù): 13)
而我們?cè)谶@里填寫的后綴其實(shí)就是和在Windows資源管理器下給快捷方式加后綴一樣的操作，只是因?yàn)樗麤]有快捷方式讓我們看見，所以要在這里添加后綴。

(, 下載次數(shù): 12)
當(dāng)然如果你不用這個(gè)Play Standalone Game選項(xiàng)，每次調(diào)試都選擇直接打包也ok，那這里不填也無所謂，了解原理即可。
**解釋一下這幾個(gè)后綴命令：
-AudioMixer 像素流送默認(rèn)是沒有聲音的，所以想要有聲音，這個(gè)必須記得添加
-PixelStreamingIP=localhost 像素流送的IP地址，現(xiàn)在是本地端口，這個(gè)后面可以根據(jù)需要修改
-PixelStreamingPort=7777 像素流送端口，同理也是可以修改的
Windows下給快捷方式添加后綴
前置工作結(jié)束
1.打包文件：
首先隨便擺個(gè)場(chǎng)景

(, 下載次數(shù): 10)
然后直接打包

(, 下載次數(shù): 14)
然后我們找到剛剛打包好的文件，給執(zhí)行文件創(chuàng)建一個(gè)快捷方式

(, 下載次數(shù): 12)
然后右鍵屬性，給其添加后綴命令
-AudioMixer -PixelStreamingIP=localhost -PixelStreamingPort=7777


之后確認(rèn)關(guān)閉窗口
2.配置信令服務(wù)器
找到信令服務(wù)器的位置，如果你在前置配置中正確啟用了像素流送插件，打包時(shí)他會(huì)出現(xiàn)這個(gè)文件夾。
位置：
打包目錄下
\Samples\PixelStreaming\WebServers\SignallingWebServer\platform_scripts\cmd\
打開run_local.bat這個(gè)文件

(, 下載次數(shù): 12)
如果是初次執(zhí)行他會(huì)進(jìn)行必要的環(huán)境安裝

(, 下載次數(shù): 13)
安裝好就會(huì)開始運(yùn)行，直到出現(xiàn)下面的綠字，就算是信令服務(wù)器啟動(dòng)成功了。

(, 下載次數(shù): 11)
當(dāng)然到這里還算結(jié)束，還要對(duì)信令服務(wù)器進(jìn)行配置，所以先關(guān)閉這個(gè)窗口。
回到打包目錄下
Samples\PixelStreaming\WebServers\SignallingWebServer\
找到cirrus.js，右鍵 -> 編輯，找到下圖這里，看見密密麻麻的字符先別慌，圈起來的是比較重要的，我一個(gè)一個(gè)解釋

(, 下載次數(shù): 12)
UseMatchmake
true/false是否使用Matchmaker（多實(shí)例自動(dòng)分配player用的）
MatchmakerAddress
Matchmaker地址 這個(gè)地址是我們要訪問的地址配合matchmaker.js中的Matchmaker端口使用
MatchmakerPort
這個(gè)要和matchmaker.js中的Matchmaker中設(shè)定的端口一致
PublicIp
公網(wǎng)IP，局域網(wǎng)測(cè)試時(shí)候可以寫localhost或者127.0.0.1
HttpPort
此像素流送程序使用的端口
StreamPort
此像素流送程序要流送的地址要和像素流送程序快捷方式的后綴命令-PixelStreamingIP一致
*因?yàn)閁E4.27好像和之前的版本不同，這個(gè)版本的config.json文件內(nèi)已經(jīng)將需要用到的可修改項(xiàng)整合在一起了，這里我推薦直接修改cirrus.js文件，因?yàn)檫@里面的const優(yōu)先級(jí)高，后面不會(huì)因?yàn)樾薷膬蓚€(gè)文件而起沖突（可能我的解釋有誤，也希望有大神給我講一下區(qū)別）

(, 下載次數(shù): 14)

(, 下載次數(shù): 13)
回歸正題。

(, 下載次數(shù): 13)
局域網(wǎng)環(huán)境單實(shí)例串流我們只需要確認(rèn)Public IP和StreamerPort修改即可，而這兩個(gè)位置的參數(shù)要和程序的快捷方式一致，不然無法串流

(, 下載次數(shù): 12)
全部搞定后，我們運(yùn)行剛配置好的信令服務(wù)器的run_local.bat，建議直接創(chuàng)建快捷方式到外面，不然每次找太麻煩了，直接運(yùn)行這兩個(gè)文件

(, 下載次數(shù): 8)
如果配置的都正確，綠字會(huì)提示Streamer Connected: ::1，這表示像素流送的程序與信令服務(wù)器已經(jīng)鏈接上了

(, 下載次數(shù): 11)
之后我們?cè)诒緳C(jī)瀏覽器（我用的是edge）輸入我們自己配置好的IP與端口

(, 下載次數(shù): 12)
點(diǎn)擊Start即可開始像素流送了

(, 下載次數(shù): 13)

(, 下載次數(shù): 12)
右上角的加號(hào)可以修改像素流送配置，官方文檔可查閱如何配置，這里不做贅述。
單實(shí)例本地像素流送場(chǎng)景算搞定了。
接下來講
二．單實(shí)例局域網(wǎng)像素流送（局域網(wǎng)內(nèi)任意設(shè)備控制UE程序）
其原理就是在剛剛配置好的本地流送基礎(chǔ)上修改PublicIP地址，然后局域網(wǎng)內(nèi)設(shè)備訪問這個(gè)地址即可控制。
首先我們查一下局域網(wǎng)內(nèi)電腦的IP
直接打開cmd命令提示符，ipconfig回車，就能找到自己IPv4的地址，記住這個(gè)地址，
回到cirrus.js，把PublicIP修改為你的地址，同時(shí)

(, 下載次數(shù): 10)
別忘記快捷方式這里也要進(jìn)行相同修改，不然像素流送會(huì)失敗

(, 下載次數(shù): 9)
保存之后運(yùn)行程序與信令服務(wù)器。

(, 下載次數(shù): 11)
在網(wǎng)頁輸入你的PublicIP+端口網(wǎng)頁即可鏈接，在局域網(wǎng)內(nèi)的手機(jī)輸入相同地址，手機(jī)也可以鏈接，如下圖。

(, 下載次數(shù): 13)
*手機(jī)和電腦操控的是同一實(shí)例，類似于玩游戲的遠(yuǎn)程遙控，或者本地串流的意思。
三.多實(shí)例局域網(wǎng)自動(dòng)分配像素流送（局域網(wǎng)內(nèi)網(wǎng)頁/手機(jī)控制不同的獨(dú)立程序）
因?yàn)槎鄬?shí)例我們要用到多個(gè)實(shí)例（就是至少兩個(gè)UE程序），所以我們要復(fù)制一份打包好的文件夾隨便起個(gè)名就好

(, 下載次數(shù): 14)
如果上面的單實(shí)例配置已經(jīng)明白原理，那么多實(shí)例無非就是兩個(gè)程序配置
相同的PublicIP +不同的HTTPPort + 不同的streamerPort
然后用Epic官方的Matchmaker自動(dòng)分配進(jìn)入的用戶去操控不同的實(shí)例。
1.開啟Matchmaker功能 + 配置信令服務(wù)器
開啟Matchmaker，只要去編輯信令服務(wù)器的cirrus.js即可

(, 下載次數(shù): 14)
UseMatchmaker把false改成true，Matchmaker就開啟了；
MatchmakerAddress 因?yàn)槭潜镜鼐钟蚓W(wǎng)多實(shí)例，所以填本機(jī)的IPv4地址就好，也是稍后要訪問的地址
MatchmakerPort 這個(gè)端口要和Matchmaker文件中的端口對(duì)應(yīng)，下面步驟會(huì)提到
PublicIp 這里可以先寫成localhost，不過后續(xù)建議和MatchmakerAddress一致吧。
HttpPort 此處不要和另外一個(gè)像素流送程序的端口重復(fù)，也不要和Matchmaker的端口重復(fù)。
StreamerPort 同上，都不要和另外的端口重復(fù)，必須是唯一的
這是第一個(gè)像素流送要用到的信令服務(wù)器配置，第二個(gè)其實(shí)大同小異我們要注意的是

(, 下載次數(shù): 14)
MatchmakerAddress，MatchmakerPort，PublicIp這三項(xiàng)是否與另一個(gè)信令服務(wù)器填寫一致？
HttpPort，StreamerPort是否是唯一？
2.配置快捷方式
這里比較容易理解，要注意的是每個(gè)快捷方式的
-PixelStreamingIP和-PixelStreamingPort后綴命令
這兩個(gè)地址是否和對(duì)應(yīng)的信令服務(wù)器地址相同即可

(, 下載次數(shù): 14)
比如本教程中就是
實(shí)例一快捷方式：
-PixelStreamingIP=localhost -PixelStreamingPort=7777
實(shí)例二快捷方式：
-PixelStreamingIP=localhost -PixelStreamingPort=9999
3.配置Matchmaker配置文件。
因?yàn)槎鄠€(gè)信令服務(wù)器只需要用一個(gè)Matchmaker，所以只需要配置一個(gè)即可。
路徑如下
打包文件夾\Samples\PixelStreaming\WebServers\Matchmaker
找到config.json文件打開

(, 下載次數(shù): 11)
文件里內(nèi)容很簡(jiǎn)單，主要修改的就是HttpPort和MatchmakePort。

(, 下載次數(shù): 12)
*這里解釋下
HttpPort
這是我們使用Matchmaker后要訪問的端口，需要配合cirrus.js中的MatchmakerAddress使用
示例：網(wǎng)頁直接輸入172.x.x.x:80（即MatchmakerIp:MatchMakerPort)即可訪問了
MatchmakerPort
這個(gè)端口要和cirrus.js中的MatchmakerPort一致
全部配置好之后，我們運(yùn)行matchmaker，如果是初次運(yùn)行會(huì)自動(dòng)安裝必要環(huán)境，不放心也可以先運(yùn)行setup.bat再run.bat。

(, 下載次數(shù): 11)
之后下面顯示的就是他所監(jiān)聽的端口

(, 下載次數(shù): 12)
然后依次運(yùn)行兩個(gè)信令服務(wù)器，信令服務(wù)器們會(huì)顯示連接到了Matchmaker。

(, 下載次數(shù): 13)
Matchmaker也會(huì)顯示連接信令服務(wù)器。

(, 下載次數(shù): 13)
此時(shí)打開兩個(gè)像素流送程序即可，Matchmaker也會(huì)顯示有兩個(gè)端口已經(jīng)準(zhǔn)備好自動(dòng)分配

(, 下載次數(shù): 12)
此時(shí)訪問地址xxx.x.x.x:60即可

(, 下載次數(shù): 11)
*訪問60端口是因?yàn)槲覀兊膍atchmaker所在端口是60，當(dāng)連接后，他會(huì)自動(dòng)為我們分配到正在進(jìn)行像素流送的70和90端口。
總結(jié)一下就是打開matchmaker x1，像素流送程序 x2，配對(duì)的信令服務(wù)器 x2。

(, 下載次數(shù): 11)
最終效果就是這，很壯觀。。。如果你要開3個(gè)4個(gè)5個(gè)更多的像素流送，就要開更多的程序與信令服務(wù)器。
*這里說下N卡有個(gè)限制，最多我們只能開3個(gè)像素流送，但是有辦法開更多，方法大佬已經(jīng)找到了。
至此，局域網(wǎng)內(nèi)的像素流送就完成了，還是因?yàn)楣揪W(wǎng)絡(luò)問題，我沒有配置公網(wǎng)，各位可以參考其他大佬的文章，本文如果理解了，公網(wǎng)或者云服務(wù)器端還是好配置的。
這里說一些注意事項(xiàng)
如果之后再遇到什么坑，我還會(huì)來更新，也希望各位大佬多多交流，共同進(jìn)步！
最后，希望各位開發(fā)順利！多拿Money！

-----------------------------



歡迎光臨 愛鋒貝 (http://m.7gfy2te7.cn/) Powered by Discuz! X3.4