特にDjangoまたはExpressを使用した場合、バックエンドの開発を行いました。サーバー側のルーティング機能に精通している必要があります。外国で人気のあるブログシステムであるWordPressも、非常に古典的なルーティング実装のケースです。それで、ルートは正確には何ですか? WordPressを通じて簡単に説明しましょう。
WordPressの書き換えルールを理解している人はすべて、実際には、URLアクセスはWordPressインストールディレクトリのindex.phpに基づいていることを認識しています(サーバーに既に存在するファイルへのアクセスを除く)。 WordPressの固定リンクがモード設定にある場合は明らかです。たとえば、記事のURLはindex.php?p = idであり、分類ページのURLはindex.php?cat = idです。
ここで、index.phpはルーター関数として機能します。次の写真をご覧ください。
言い換えれば、訪問するアドレスに関係なく、すべてのリクエストは最終的にindex.phpにリダイレクトされます。プログラムは、アクセスURLの特性に基づいて必要なページのタイプを決定し、データベースにクエリを作成し、最後にHTMLコンテンツをブラウザに返します。
上記で言及したのは、Webバックエンドルーティングです。フロントエンドルーティングとは何ですか?実際、フロントエンドルーティングテクノロジーは現在広く使用されており、多くのオープンソースJSライブラリは、Angularjs、Ember.js、Director.jsなどのフロントエンドルーティングをサポートしています。フロントエンドルーティングの原理はバックエンドルーティングと同じです。これにより、すべてのインタラクションを可能にし、1つのページに表示して、サーバーの要求を削減し、カスタマーエクスペリエンスを向上させるために実行できます。ますます多くのWebサイト、特にWebアプリケーションは、フロントエンドルーティングを使用します。
Director.JSは、最も純粋なルート登録/パーサーです。 「#」シンボルを使用して、ページを更新せずに異なるURLパスを整理し、異なるURLパスに従って異なるコールバックメソッドを一致させます。 Director.jsは、クライアントに適用するだけでなく、node.jsを使用してバックグラウンドでも適用できます。また、上記のバックエンドルーティング機能を実装することもできます。フロントエンドルーティングの実装に関する次の例を見てみましょう
Web QQと同様のWebデスクトップアプリケーションを設計する必要があります。デスクトップには多くの小さなアイコンがあり、それぞれの小さなアイコンはコンピューターのデスクトップと同様の機能アプリケーションです。デスクトップにBaiduのニュースボタンがあります。それをクリックして、現在のページにウィンドウをポップアップします。 Baidu Newsと別のアイコンを表示できます。それをクリックして現在の時間を表示します。簡単な例を次に示します。
<!doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <script src = "https://rawgit.com/flatiron/director/master/build/director.min.js"> </script> <スタイル:0;パッド:0;パッド:0; {width:100%; height:100%; background:#3d72b8} #baidunews {width:40px; height:40px; background:url( "./ du.png")no-repeat; display; block; margin:50px;} #tweibo {width:40px; heigh:url:url( "。ノーリピート;ディスプレイ:ブロック;マージン:50px;} </style> </head> <body> <a href = "#/baidunews" id = "baidunews"> </a> <a href = "#/time" id = "tweibo"> </a> <scrip> // defin "/baidunews":[showframe、getBaidunews]} // route var router = router(route)router.init();初期化//現在の時刻関数nowtime(){var = new date()を表示するコールバック関数を定義します。 var y = now.getTullyear(); var m = now.getmonth()+1; var d = now.getDate(); var h = now.gethours(); var mi = now.getMinutes(); var s = now.getSeconds(); alert( "current time/n"+y+"year"+m+"月"+d+"day"+h+"time"+mi+"minute"+s+"秒"); } //ブラウザフレームワーク関数を表示する関数を定義しますshowframe(){var f = document.createelement( "div"); f.style.width = "985px"; f.style.height = "500px"; f.style.position = "absolute"; f.style.top = "50px"; f.style.left = "200px"; f.style.background = "white"; f.style.border = "2px solid #ccc"; //閉じるボタンvar close = document.createelement( "span"); close.style.position = "absolute"; close.style.right = "5px"; close.style.cursor = "pointer"; close.style.marginight = "5px"; close.onclick = function(){document.body.removechild(f); } close.innerhtml = "x"; //サイトの外側のiframeをロードするvar win = document.createelement( "iframe"); win.id = "myiframe"; win.frameborder = 0; win.style.width = "100%"; win.style.height = "100%"; F.AppendChild(close); F.AppendChild(Win); document.body.AppendChild(f); } // baiduニュースのWebページgetBaidunew(){document.getElementById( "myiframe").src = "http://news.baidu.com/"; } </script> </body> </html>上記のコードから、Director.jsがルーティングと転送にページに「#」を使用していることがわかります。上記の例は、非常に簡単な例です。 Director.JSは、より複雑で巨大な機能を実装できます。 AJAXおよびサーバーデータと対話でき、他のJSクラスライブラリと共存できます。これは、強力なWebアプリケーション開発ツールです。
director.jsはSEOに影響を与えますか?
クライアントのDirector.JSはSEOに影響を与えます。これは、すべてのデータが1ページにのみ行われ、一部のデータはエンジンスパイダーを検索するのに役立たない方法で保存されるためです。 SEOフレンドリーである必要がある場合は、「Webアプリケーション」の代わりに「Webページ」を構築する必要があることを意味します。 Director.JSはお勧めしません。
参照:director.js