从零开始搭建仿抖音短视频App-前后端开发模式，前端框架的选择、前端项目搭建
目錄
前后端開發模式
傳統JavaWeb開發模式
?前后端分離模式?編輯
前端框架的選擇-UniApp介紹
?內網互通原則
運行到iphone與Android
前后端開發模式
傳統JavaWeb開發模式
????????首先我們用戶會發送請求到瀏覽器，這是他們的一個交互。隨后，瀏覽器的請求會經過，直
接到達我們的服務器。由于我們是JavaWeb這種傳統的一種模式，我們所有的一些前端后端的資
源都是打包放在一起的，放在某一個服務器里面去的。像我們的后端，比如說像 model view
controller，那么這就是一個mvc，它其實是我們的后端代碼。然后我們前端的資源像
HTML,CSS,JS這些，其實它們混在一起都是一個整體。那么，這一塊的話，其實呢，就是我們
所謂的一個JSP。 JSP是可以在我們的服務器上去做渲染的。渲染完畢以后，再通過我們的一些數
據，我們再回傳到瀏覽器。在瀏覽器上展示給用戶。這個JSP，是在服務端渲染的。所以說它的一
個用戶請求，如果說很大很多的話，那么就會造成我們對服務器的一種壓力。
?前后端分離模式
????????用戶請求是通過這個瀏覽器打開某一個網站，網站會渲染打開相應的一些頁面。像h5的話，
所有設置到的一些html，css，js他們其實都是在我們的里面Nginx里面去進行部署的。因為我們是
前后端分離，那么前后端分離就是把前端從我們的原先的一個整體里面給剝離出來。進行一個獨立
的開發和部署，那么對于我們后端來講的話，這個時候它又是另外的一個單獨的包,?是部署在另外
的一個服務器里面的，或者說是一個服務器的集群。那么在我們的一個前端里面,現在所有的一些
請求交互，其實都是在我們的這個Nginx里所包含的這些頁面里發起的一些請求。那么他們都是一
些Restful形式的web service，那么請求的時候他們是可以去攜帶一些json的數據，那么隨后我們
在后端處理完畢之后，還可以把這個json給回傳過去。所以這個json的話是一種數據的載體。這個
其實就是我們的h5前后端分離的一種模式。
當然除了這種模式的話，其實像手機端開發也是前后端的一種分離的模式。那么，像安卓小程序
啊，它們都是歸類為前端的，那么這樣子的話，這就是一個前端的開發模式了，然后對于我們后
端來講，其實后端你只需要去開發一套接口，就可以同時提供給h5安卓小程序去使用了。
通過我們的這個前后端分離的話，我們還能夠去達到一個精準定位bug，可以去理清我們的一個
bug。
前后端分離，它不僅是一種開發模式，它其實也是一種架構模式。那么我們也可以稱之為是一種前
后端分離的架構，那么使用前后端分離架構的時候是需要去區分前后端的項目。前端和后端項目，
他們是兩套不同的項目，放在兩個不同的服務器里面，需要去獨立的部署，并且要有兩套不同的代
碼庫，要有不同的開發人員去開發和維護。
前端框架的選擇-UniApp介紹
這個uniapp是一個開源的技術，它是使用點Vue.js所開發的前端應用的一個框架。Uni它就是一個
聯合的一個意思，我們作為開發者，只需要去編寫僅僅一套代碼。就可以發布到安卓，IOS，
Web，它是支持響應式的，其實就是H5。以及各種小程序，比方說微信，支付寶，百度頭條，快
手，釘釘，淘寶等等，相應的一個小程序你都可以發布，并且還支持快應用等多個平臺。
主要目的：跨平臺，一套代碼去開發更多的應用，減少用人成本。
另外在后面的話，我們還會使用到uniCloud。基于這個cdn我們會去做它的一個視頻的上傳。
?內網互通原則
如何保證在同一個網段，?
打開cmd，ipconfig：
?只要我們的手機端，電腦在這樣的網段里面，之間都可以達到互通。
查看我們的手機，也是在這個網段里面的。
（關于如何判斷是不是在同一個網段，我們去看它的子網掩碼255對應的IP地址，就是這里二進制的前32位，即192.168.1.0，是在這一個網段中的）
請求地址需要改成我們的內網IP地址，就是說當我們去請求的時候，我們的請求地址一定不能寫?
localhost。因為按照很早以前，在學JAVA的時候，可能就會直接寫一個去請求我們電腦上的一個
服務接口。這樣子雖然在電腦上是沒問題，因的客戶端就在電腦,localhost就是代表自己.但是對于
手機來講的話,我們是APP，APP請求localhost，我的APP在手機上它是沒有服務的，所以請求也
是發送給了自己的手機端，所以這邊是會有問題。
云部署時會改成云服務器的地址：
運行到iphone與Android
首先你是需要把你的手機連接到電腦，一旦連接到電腦成功以后呢，在這邊會有一個顯示。
如果說你有小程序有網頁端的話，那么也可以直接運行到網頁端也是可以的。
?連接安卓手機后，開啟usb調試。點擊運行到安卓設備：
?運行到iphone，點擊運行：
這里它不叫APP，它叫做基座，模擬的基座，我們通過基座點開就可以去調試。
這里我們先去做一些設置：
?
?點擊信任：
?之后進入模擬基座：
首頁，朋友，消息，點擊我的：
?這時候已經完成了前端的部署，這個時候我們的其實就已經是可運行的，但是我們這上是沒有任
何東西的，因為我們沒有后端啊，沒有后端我們就沒有任何數據。
如果說你沒有相應的手機，那么你也是可以使用模擬器去運行的。在windows還有是mac OS上
都有相應的安卓模擬器，也是可以去選擇去開啟去使用。這個是mac OS平臺的simulator。
?
我們在進行調試的時候，可能會需要一些數據的一個展示。onLaunch這里是我們的一個生命周期，在我們初次啟動加載的時候會運行。在里面進行一個控制臺的打印：?
這就完成了我們前端的一個部署，完成了我們的測試。
總結
以上是生活随笔為你收集整理的从零开始搭建仿抖音短视频App-前后端开发模式，前端框架的选择、前端项目搭建的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 牛腩--SQLHelper
- 下一篇： 城头土命适合做计算机电脑职业,土命人适合