單頁面應用程序?qū)嶋H上將視圖呈現(xiàn)從服務器傳輸?shù)綖g覽器。服務器僅提供JSON格式數(shù)據(jù)，視圖和內(nèi)容由本地JavaScript組織和呈現(xiàn)。搜索搜索引擎抓取的內(nèi)容需要完整的HTML和內(nèi)容，單頁面應用程序架構(gòu)網(wǎng)站，并且不支持搜索。

如果網(wǎng)站的用戶體驗和搜索友好，如果我們有更好的體驗和友好的搜索支持，這是一把雙刃劍。

單頁面應用程序只有一頁。視圖的變化通常由路線驅(qū)動。首先，我們來談談單頁應用程序的URL中的＃。許多使用單位結(jié)構(gòu)網(wǎng)站的URL出現(xiàn)。

##是瀏覽器URL中的錨點。當前頁面更改##參數(shù)時，頁面將跳轉(zhuǎn)到錨點的位置。通過JavaScript，我們可以在##：

在##之后更改參數(shù)后，頁面不會重載，因此大多數(shù)單頁架構(gòu)網(wǎng)站使用URL中的##作為當前視圖的URL地址，例如：

Backbone.js通過更改＃參數(shù)來組織視圖。有一個演示可用于直觀地體驗URL更改。

閱讀本演示后，您可能會發(fā)現(xiàn)熟悉的符號＃!這是Twitter在URL上使用的。此徽標由Google提出（AJAX抓?。壕W(wǎng)站網(wǎng)站管理員和開發(fā)者指南1）：

由于復雜的單頁架構(gòu)頁面很難被Google抓取，因此為開發(fā)人員開發(fā)了一個規(guī)范：

_escaped_fragment_此參數(shù)是Google指定的命名。如果開發(fā)人員想要向Google提交網(wǎng)站內(nèi)容，則必須使用此參數(shù)生成靜態(tài)頁面。

根據(jù)上面的演示，我只想舉例說明Google如何抓取頁面:

http://119.28.4.22/?escapedfragment _=/detail/1

因此，Server需要為Google抓取生成靜態(tài)內(nèi)容。

以下是單頁架構(gòu)的簡要介紹。如果爬網(wǎng)程序訪問根目錄，則配置服務器端路由。

當Google訪問119.28.4.22/#!/detail/1時，它將自動轉(zhuǎn)換為http://119.28.4.22/?_escaped_fragment_=/detail/1，以Nginx為例：

/api是后臺服務的接口。 Nodejs用作示例。代理設置如下：

這樣，我們將重寫Google對/api接口的訪問權限，然后在服務器的/api處理請求中輸出靜態(tài)內(nèi)容。

Gogole的規(guī)范必須具有站點地圖支持，因為它可以用于單頁架構(gòu)站點，索引頁面也是JavaScript呈現(xiàn)的。提交站點地圖時，您無需關注參數(shù)名稱_escaped_fragment_，只需提交帶有哈希符號的URL，例如：

技術趨勢的步伐很快，單頁應用程序，URL散列和渲染方法實際上已經(jīng)流行了很長時間。對于許多具有良好數(shù)據(jù)的外國用戶，開發(fā)人員將選擇HTML5 History API的pushstate功能。丟棄＃！在URL中。但是，網(wǎng)站，＃在IE6和7等低端瀏覽器中更受歡迎，可以非常兼容。關于使用HTML5 History API構(gòu)建單頁應用程序，也歡迎討論。

參考文獻1:https://support.google.com/webmasters/answer/174992?hl=zh-Hans