javascript - 請問前後端分離的spa應用程式是怎麼一回事?
ringa_lee
ringa_lee 2017-05-16 13:35:49
0
6
654

作為一個自學後端的前端不是很懂,spa是訪問網址時一次性返回去,之後靠前端路由切換顯示麼?然後伺服器只負責對ajax回傳資料?

ringa_lee
ringa_lee

ringa_lee

全部回覆(6)
Peter_Zhu

你只要提供一個url連結到前端的index.html頁面,然後寫好介面API就行了,其他的都交給前端處理。

迷茫

是的,你理解的沒錯
只有一個入口文件,靠路由切換組件,後台提供api

伊谢尔伦

1.是不是一次性返回取決於你有沒有做了代碼異步加載,提取公共部分的處理
2.spa頁面的切換是通過前端路由導航的
3.前後端完全分離,代碼沒有耦合,服務器只提供資料服務,前端透過ajax呼叫服務端接口,取得資料之後再更新頁面。

希望能幫到你。

phpcn_u1582

傳統:前端由多個頁面組成,後端負責組織資料、實作路由、甚至產生頁面內容;前端後端其實是混雜一起的;
當前:前端由單一頁面或少量頁面構成(Single Page Application),前端框架負責組織路由,切換頁面內容(一般將頁面分割成元件/Componet),後端只負責提供API 服務並收發資料;
這樣前後端就基本分離解耦了。

我想大声告诉你

後端只負責提供前端所需的數據,其他頁間的切換跳轉與使用者的互動等邏輯的實作都由前端來完成。
spa單一頁面只需要一個index.html頁面,作為整個專案的入口,然後引入必需的js文件,其他js文件可以按需加載,具體的頁面內容可以由js動態產生渲染。有時頁面的變化不是重新請求,也不是刷新,而是透過事件驅動,執行對應的方法來重新渲染當前頁面。

大家讲道理

一切都要從ajax的局部刷新說起.

傳統的web, 瀏覽器輸入一個url然後返回一個頁面.

後來, 人們發現這樣太浪費資源啦, 比如, 我點了個讚, 那麼數據庫和頁面上的讚數都要+1, 這個刷新頁面肯定是不行的啊, 那就'局部刷新'吧.

再後來, 機智的開發者又想到, hash路徑段(形如#header)是不會像伺服器發請求的, 那麼我們可以在點擊一個錨點的時候加載一個小頁面, 局部刷新, 再加上可以操作瀏覽器的歷史記錄來實現回退等功能. 那乾脆就搞個前端路由吧. 於是前端路由就出現啦.

其實前端路由本質上也是一種局部刷新, 但是更規範. 這次刷新, 拉回來的是一個完整的組件, 這個組件包含了視圖和數據. 這裡的數據又分為兩種, 一種是後端傳過來的, 暫且成為資料庫資料, 另一種是為了更好地管理視圖而在前端產生的資料, 暫且成為視圖資料.

一通亂說過後, 我們就可以好好分析一下SPA到底是個什麼東西啦.

SPA是single page application的簡稱, 中文叫單頁應用. 何為單頁? 就是只有一個頁面, 這個頁面一般是index.html, 這是專案的入口檔案. 自專案啟動到結束, 瀏覽器中始終都是這個頁面, 你看到的變化只是組件之間的創建和刪除. 比如你在這個頁面裡引入bootstrap(不是個好主意), 那你所有的組件都會受到bootstrap的影響.

... 實在寫不下去了, 剩下的太長啦. 等我哪天寫個文章好好說一下. 作為的答案的話, 篇幅實在太大.

簡單的來說, 就是前端提供視圖, 後端提供json資料. 用後端的資料來渲染前端的頁面.

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板