應(yīng)用場景：

說點(diǎn)廢話，三維場景或者叫可視化或者叫數(shù)字孿生等等，其實(shí)就是三維的一個東西，游戲在很早很早之前就已經(jīng)使用了，現(xiàn)在像建筑設(shè)計、汽車、機(jī)械等等也都開始使用了。畢竟從二維到三維這個進(jìn)步的方向是不會錯的，雖然很多都沒真正落地。

當(dāng)然不一定所有項目都要使用云渲染，例如你的項目本身就是CS架構(gòu)的，就是電腦端的一個應(yīng)用程序，只要電腦配置可以，那么就完全不需要云渲染了。

一般情況下，可能你的項目是BS架構(gòu)的；為什么現(xiàn)在都做BS架構(gòu)，其實(shí)簡單來說就是方便，不需要熱更新，容易分享，給別人一個連接就可以。

BS架構(gòu)才會用到云渲染，當(dāng)然也不一定所有的BS架構(gòu)都需要云渲染，比如你的項目很小，模型面數(shù)也很小，打包之后不超過50M100M的，那你通過Unreal也好或者Unity打包個WebGL嵌入到前端就可以了，現(xiàn)在的網(wǎng)速加載個50M的東西應(yīng)該還是可以的，而且以后會更快；也許以后網(wǎng)速快到1g都很快能加載完的話，瀏覽器也能帶動超多面數(shù)的三維場景，那么云渲染似乎又沒了用武之地了。

回歸正題：

目前用云渲染的場景：智慧城市、智慧社區(qū)/園區(qū)、智慧樓宇、智慧工廠等等；反正就是各種智慧的東西，說真的，這吹牛的能力確實(shí)一般，詞匯也真的是匱乏，搞來搞去全是智慧什么什么。

前置條件：

使用Windows10操作系統(tǒng)

要做云渲染，那你必須要有一個配置極高的電腦，最重要的是要有一個超級顯卡，越牛越好越貴越好，推薦NVIDIA系列顯卡。云渲染嗎，就跟多年前的遠(yuǎn)程桌面是的；網(wǎng)頁性能不行，就讓服務(wù)器來渲染，然后給你推送像素流就行了。

一般情況下，推薦使用Chrome、Firefox。

一、像素流推送準(zhǔn)備工作

1.安裝vscode，選擇擴(kuò)展，搜索Vetur插件，安裝一下。vscode中查看Terminal，切換到控制臺Command Prompt，切換到命令行，node ?--version，查看一下裝沒裝過node，沒有的話，進(jìn)入下一步，安裝node環(huán)境。

2.安裝node，重新看看js環(huán)境，node ?--version，還有npm ?--version，這個包管理器。

3.安裝vue，這是一個目前主流的前端開發(fā)環(huán)境，大部分公司應(yīng)該都是在用這個，查看你的電腦上有沒有vue的環(huán)境，vue ?--version。安裝vue直接在vscode控制臺中輸入npm install -g @vue/cli回車即可。

4.安裝echarts圖表插件，在vscode終端中輸入npm install echarts ?--save回車即可。

5.新建ue項目，開啟像素流送插件Pixel Streaming，打包win64版本。

二、使用步驟

1.進(jìn)入ue打包的目錄\WindowsNoEditor\Engine\Source\Programs\PixelStreaming\把WebServers拷貝到WindowsNoEditor同級目錄下，有這個WebServers文件夾的前提是在ue中已經(jīng)使用了Pixel Streaming插件。如果沒有找到上述路徑，那么應(yīng)該是在\WindowsNoEditor\Samples\PixelStreaming\中，ue版本更新后，路徑應(yīng)該是改了。

2.修改信令配置\WebServers\SignallingWebServer\config.json

config.json默認(rèn)是這樣的

然后，你需要刪掉，修改成下面這樣.如果下面的信令配置不對，那么你可以去官方看一下。

信令服務(wù)器的作用就是把前端和后端做一個連接。

3.\WebServers\Matchmaker文件夾下，雙擊run.bat，啟動服務(wù)，等窗口內(nèi)出現(xiàn)提示；自己看看是否與配置文件相符。啟動成功后不要關(guān)閉窗口，關(guān)閉窗口就表示關(guān)閉了該服務(wù)。

如果你覺得run.bat這個啟動信令不好找，當(dāng)然你可以使用新的批處理，放在最外層級中；@echo off

call"WebServers\SignallingWebServer\run.bat"，這樣你雙擊新的批處理啟動服務(wù)就可以了。

4.“啟動實(shí)例.bat”

你也可以使用批處理，@echo off

start WindowsNoEditor/Demo.exe -ResX=1920 -ResY=1080 -PixelStreamingIP=localhost -PixelStreamingPort=7777 -log -RenderOffScreen

5.新建文件夾WebVue，進(jìn)入WebVue，在文件瀏覽器的地址欄中輸入cmd，回車，在打開的命令行窗口中，輸入vue create demo。

6.把安裝好的demo文件夾拖到vscode中打開

7.把ue4Player文件夾拷貝到\WebVue\demo\src\下，App.vue的第七行改成import HelloWorld from ‘./ue4Player/example.vue’

8.選擇vscode的查看頁簽，選擇終端，在打開的終端中輸入npm run serve，等待啟動前端server后，打開瀏覽器可查看渲染效果。

三、公網(wǎng)方案

1.確保本地能正常運(yùn)行。

2.公網(wǎng)服務(wù)器端口開發(fā)

? ? ?tcp：3478、777、7777

? ? udp：1-65535

3.修改信令配置，即上面說到的\WebServers\SignallingWebServer\config.json，其中120.55.50.49是公網(wǎng)服務(wù)器的ip地址。如果不行，你可以去官方看一下。

4.新增兩個shell文件,文件名+內(nèi)容。

文件名：_start.sh

內(nèi)容： nohup node cirrus --configFile='./config.json' >out.log 2> out.err &

? ? ? ? ? echo $! > out.pid

文件名：_stop.sh

內(nèi)容：PID=$(cat out.pid)

? ? ? ? ?kill -9 $PID

5.上傳SignallingWebServer文件夾到服務(wù)器，修改shell文件可執(zhí)行權(quán)限

6.啟動信令服務(wù) ? sh _start.sh

7.檢查端口監(jiān)聽情況 ?netstat -lunpt，確保7777和777端口正常監(jiān)聽

8.本地啟動實(shí)例，其中參數(shù)PixelStreamingIP=120.55.50.49，為公網(wǎng)服務(wù)器ip

9.啟動前端，連接120.55.50.49地址上的信令服務(wù)器，此時可以看到流送畫面