[發明專利]網頁的多級路由方法及裝置

有效

• 申請號: 201410528611.3
• 申請日: 2014-10-09
• 公開（公告）號: CN104268258B
• 公開（公告）日: 2018-02-23
• 發明（設計）人: 李浛天
• 申請（專利權）人: 北京國雙科技有限公司
• 主分類號: G06F17/30
• 分類號: G06F17/30;G06F9/44
• 代理公司: 北京康信知識產權代理有限責任公司11240
• 代理人: 吳貴明,張永明

技術領域

本發明涉及計算機領域，具體而言，涉及一種網頁的多級路由方法及裝置。

背景技術

隨著富客戶端(Rich Client)技術的發展，AngularJS這一前端網頁腳本框架越來越頻繁地被使用。富客戶端的一個主要體現就是單頁網站(Single Page Application)，單頁網站的一個顯著特點就是只向服務器請求一個主頁面，其他頁面通過ajax異步加載進來并在客戶端進行路由管理。AngularJs提供了ngRoute模塊服務來實現單頁網站，該服務有良好的特性，可以方便地對參數進行解析，也可以方便地對路由實現管理。然而ngRoute模塊卻沒有提供多級路由管理的機制。在一級路由導向的頁面下隨著單頁網站的規模增大，多級路由的需求越來越多，如何智能、穩定地對多級路由進行管理，是Angular現在必須要面臨的問題。

在AngularJS中，angular-ui項目中的ui-router插件雖然實現了多級路由的管理功能，但是它拋棄了ngRoute模塊所擁有的尤其是$routeParams的許多便利的特性，比如非常方便地指定多級參數以及查詢參數的處理等內容。

現有技術對于$routeParams所具有的功能支持度不良好，而且改變了整個網站的路由架構。這樣使得路由的開發變得非常復雜，并不適合人們對其進行擴展，即如果希望添加一個新的路徑，使用者需要在配置中完整地將這個路徑表達出來。

針對現有技術中實現網頁多級路由的方法非常復雜，導致的開發復雜，時間周期長的問題，目前尚未提出有效的解決方案。

發明內容

本發明的主要目的在于提供一種網頁的多級路由方法及裝置，以解決現有技術中實現網頁多級路由的方法非常復雜，導致的開發復雜，時間周期長的問題。

為了實現上述目的，根據本發明實施例的一個方面，提供了一種網頁的多級路由方法。該方法包括：在網頁中劃分至少兩個區域，區域包括：第一區域、第二區域；在第二區域中，至少劃分兩個子區域，子區域包括：第一子區域、第二子區域；配置由第一區域路由至第二區域的路由參數，其中，路由參數用于索引第二區域的模板地址；配置第二區域內第一子區域的子路由參數，其中，子路由參數用于索引第二子區域的頁面地址；將子路由參數和路由參數轉換為路由地址；通過路由地址對第二區域進行刷新，將路由地址對應的頁面信息輸入至第二區域。

為了實現上述目的，根據本發明實施例的另一方面，提供了一種網頁的多級路由裝置，該裝置包括第一分割模塊，用于在網頁中劃分至少兩個區域，區域包括：第一區域、第二區域；第二分割模塊，用于在第二區域中，至少劃分兩個子區域，子區域包括：第一子區域、第二子區域；第一配置模塊，用于配置由第一區域路由至第二區域的路由參數，其中，路由參數用于索引第二區域的模板地址；第二配置模塊，用于配置第二區域內第一子區域的子路由參數，其中，子路由參數用于索引第二子區域的頁面地址；第一生成模塊，用于將子路由參數和路由參數轉換為路由地址；刷新模塊，用于通過路由地址對第二區域進行刷新，將路由地址對應的頁面信息輸入至第二區域。

根據發明實施例，通過在網頁中劃分至少兩個區域，區域包括：第一區域、第二區域；在第二區域中，至少劃分兩個子區域，子區域包括：第一子區域、第二子區域；配置由第一區域路由至第二區域的路由參數，其中，路由參數用于索引第二區域的模板地址；配置第二區域內第一子區域的子路由參數，其中，子路由參數用于索引第二子區域的頁面地址；將子路由參數和路由參數轉換為路由地址；通過路由地址對第二區域進行刷新，將路由地址對應的頁面信息輸入至第二區域，解決了現有技術實現網頁多級路由的方法非常復雜，導致的開發復雜，時間周期長的問題。實現了可以任意指定多級路由，提高了開發效率的效果。

附圖說明

構成本申請的一部分的附圖用來提供對本發明的進一步理解，本發明的示意性實施例及其說明用于解釋本發明，并不構成對本發明的不當限定。在附圖中：

圖1是根據本發明實施例一的網頁的多級路由方法的流程圖；

圖2是根據本發明實施例的擁有多級路由結構的網頁的結構示意圖；

圖3是根據本發明實施例一可選的的網頁的多級路由方法的流程圖；

圖4是根據本發明實施例二的網頁的多級路由裝置的結構示意圖；以及

圖5是根據本發明實施例二可選的網頁的多級路由裝置的結構示意圖。

具體實施方式

需要說明的是，在不沖突的情況下，本申請中的實施例及實施例中的特征可以相互組合。下面將參考附圖并結合實施例來詳細說明本發明。