HTMLの静的ページと動的ページの詳細。 注意。 仕事の準備

誰かに助けを求めずに、自分の手でウェブサイトを作成して維持できるのは素晴らしいことではありませんか? お金を節約することに加えて(結局のところ、Web開発サービスには多くの費用がかかります)、これにより多くの問題を独自に解決できます:個人のWebページ、企業のWebサイト、オンラインストアの作成、興味深いプロジェクトの実装-これは人ができることの完全なリスト。Web開発技術を所有している。

この本を読んだ後、あなたは現代のウェブサイトが何であるか、その概念がどのように開発されるか、ホスティングとドメイン名が何であるか、静的なウェブページが動的なものとどのように異なるか、ウェブサイトのコンテンツがどのように形成されるか、なぜあなたが最適化する必要があるかを学びますそれ、そして多くの友人。 HTMLハイパーテキストマークアップ言語を使用してWebページを個別にプログラミングする方法を学び、Web開発者向けに特別に作成されたソフトウェア製品に精通し、最小限の時間と労力で本格的なWebサイトを自動的に作成できるようにします。 。

簡単でアクセスしやすいスタイルのプレゼンテーション、および多数の実例となるイラストと実用的な例は、この本の研究を魅力的なプロセスに変えます。その結果、魅力的な最新のWebリソースをすばやく作成し、すべてを実行できるようになります。それを維持、維持、最適化するために必要な手順。

本:

静的および動的なWebページの概念

以前、静的および動的なWebページを構成するものについて簡単に説明しました。 このセクションでは、この問題について詳しく検討します。

静的ページの名前はそれ自体を物語っています。そのようなページでは、静的で一定の不変の情報が表示されます。 むしろ、変更することができますが、そのためには、ページのプログラムコードを適切に調整する必要があります。

通常、静的ページファイルはHTML形式です。 Web開発者は、サイトのコンテンツを形成するHTMLコードを記述し、ファイルに名前を割り当ててから、ページをWebサーバーにアップロードして、インターネットユーザーが利用できるようにします。 たとえば、企業のWebサイトでは、静的ページに会社の歴史や活動の主な方向性などに関する情報が含まれている場合があります。静的Webの作成からWeb開発の分野での最初の経験を開始する必要があることに注意してください。ページ。 これについては、HTMLを使用したWebプログラミングの基本に関する章で詳しく説明します。

ノート

HTML言語で記述されたページのアドレスは、ピリオドに続く文字で終わります。

動的Webページと静的Webページの基本的な違いは、そのコンテンツは永続的ではなく、変更される可能性があることです。 これは、ユーザーの希望に応じて、または訪問者によって作成されてWebサーバーに送信された要求に基づいて形成されます。 前に述べたように、動的Webページの最も一般的な例は、ユーザーが送信した検索クエリに基づいて検索エンジン(www.google.ruなど)から返された検索結果を含むページです。 Webページを使用するもう1つの典型的な例は、オンラインストアです。訪問者は、オプションを使用して、関心のある製品とプロパティを示し、リクエストを送信します(これは通常、対応するボタンなどで行われます)。数秒で、指定された条件を満たす製品のリストが画面に表示されます。 さらに、動的ページは、さまざまな目的や方向性のために他のサイトで広く使用されています。

動的ページはHTML言語を使用して作成することもできますが、別の言語であるPHPの方が適しています(主に機能が広いため)。 したがって、ページファイル形式はHTMLではなくPHPになり、そのインターネットアドレスはピリオドに続く文字で終わります。

クラウドストレージに基づいた静的サイトに関する出版物のサイクルを継続します(以前の出版物およびを参照)。 今日は、それらの微調整と最適化の問題について詳しく説明します。

ユーザーの観点から見たサイトの優れた作業の主な基準は、もちろん、コンポーネントのダウンロード速度です。 なんらかの理由でサイトの読み込みに時間がかかりすぎると、必然的に待つことにうんざりしている訪問者を失うことになります。 ウェブサイトを速くて便利にするために、あなたはそれを最適化するためにいくつかの仕事をする必要があります。

アカマイからクラウドCDNストレージに接続する方法についてはすでに説明しました。 CDNは、すべての静的コンテンツ(画像、テキストファイル、JS、CSSなど)を世界中に散在するキャッシュサーバーに保存します(マップを参照)。

Webページまたはそのリソースにアクセスする場合、要求は、クライアントに地理的に最も近いキャッシュサーバーによって処理されます。 CDNを使用すると、固定デバイスとモバイルデバイスの両方でWebサイトの読み込み速度を上げることができます。

デフォルトでは、すべてのデータは24時間CDNにキャッシュされます。 最近、リポジトリに新しい機能が追加されました。これを使用すると、いつでもCDNキャッシュをクリアできます。

これを行うには、図に示されているタブに移動し、キャッシュをクリアするページのアドレスをフォームに入力します。 キャッシュはすぐにはクリアされませんが、フォームが送信されてから約15分後にクリアされます。

どのWebページにも、画像、スクリプト、スタイルファイルなど、さまざまな要素が含まれています。 初めてページにアクセスするユーザーは、一連のHTTPリクエストを行うことで、これらすべての要素を取得します。 多数のファイルの再ダウンロードを回避するために、キャッシュが使用されます。

HTTPプロトコルで使用されるキャッシュモデルは、いわゆるバリデーターに基づいています。これは、キャッシュされたドキュメントが最新であることを保証するためにクライアントが使用する特別なヘッダーです。 バリデーターのおかげで、クライアントはキャッシュされたコピー全体をサーバーに送信せずにドキュメントの状態を確認できます。 次に、サーバーは、受信したバリデーターがクライアントのキャッシュに古いコピーが存在することを示している場合にのみ、応答でドキュメントを送信します。

バリデーターは長所と短所に分類されます。 強力なバリデーターがHTTP / 1.1で導入されました。 これらは、ファイルが変更されるたびに変更されるため、そのように名付けられています。 これらには、いわゆるETag(エンティティタグ)が含まれます。 ETagは、ドキュメントのコンテンツの識別子です。 ドキュメントの少なくとも1ビットが変更されると変更されます。 識別子は、たとえば、ドキュメントのコンテンツのMD5合計として使用できます。 クライアントがサーバーにドキュメントを要求すると、ETag値が応答で送信されます。次に例を示します。

HTTP / 1.1 200 OKサーバー:Selectel_Storage / 1.0 Accept-Ranges:bytes Last-Modified:Mon、18 Aug 2014 12:25:38 GMT X-Timestamp:1408364738.80296 Content-Type:image / jpeg Content-Length:458073 Access-Control -Allow-Origin:* Access-Control-Expose-Headers:Last-Modified、ETag、X-Timestamp ETag: "ebef3343a7b152ea7302eef75bea46c3" Date:Wed、20 Aug 2014 11:52:48 GMT
同じドキュメントが再度要求されると、保存されたバリデーター値がIf-None-Matchヘッダーに渡されます。

GET / HTTP / 1.1ホスト:example.org If-None-Match: "ebef3343a7b152ea7302eef75bea46c3"
ドキュメントが変更されていない場合、サーバーは応答でヘッダーと304 NotModifiedコードのみを返します。 それ以外の場合、サーバーはコード200を返し、ドキュメントの新しいバージョンとその新しいETag値を転送します。

リポジトリでは、ファイルをアップロードした直後にETagが生成されます。 コンテンツのMD5ハッシュです。 コンテンツが変更されると、ETagも変更されます。

弱いバリデーターは、ファイルが変更されるたびに必ずしも変更されるとは限らないバリデーターです。

弱いバリデーターの例は、Last-Modifiedヘッダーです。 このヘッダーの値は、ファイルが最後に変更された日付です。 リポジトリに自動的にインストールされます。 If-Modified-Sinceヘッダーの要求で、Last-Modifiedヘッダーに現在含まれている日付より前の日付を指定すると、応答も304 NotModifiedになります。

強力なバリデーターは、どのような状況でも使用できます。 弱いバリデーターは、ファイルの正確な内容に依存しないコンテキストで使用されます。

たとえば、両方のタイプのバリデーターを条件付きGET要求で使用できます(変更後または一致しない場合)。 ただし、ファイルを部分的にアップロードする場合は、強力なバリデーターのみを使用できます。そうしないと、クライアントは一貫性のない形式でファイルを受信します。

max-ageディレクティブを指定したCache-Controlヘッダーは、元のファイルがストレージにあるファイルのコピーのブラウザーキャッシュ内の経過時間を設定するために使用されます。 このヘッダーのおかげで、サイトの読み込み速度を大幅に向上させることができます。ファイルがキャッシュされている場合、ブラウザはサイトに1回リクエストすることなく、キャッシュからコンテンツを即座に表示します。
キャッシュ内のファイルの保存時間は秒単位で示されます。

キャッシュ制御:最大年齢= 7200
示されている例では、7200秒(2時間)です。 通常、CSS、JS、および画像ファイルはこの方法でキャッシュされます。 それらを永久にキャッシュし、コンテンツが変更されたときにHTMLでそれらへのリンクを変更することが望ましいです。 RFC 2616は、このようなファイルのキャッシュ時間を1年を超えないようにすることを推奨しています。

キャッシュ制御:最大年齢= 31536000
特定のファイルをキャッシュせずに常に「新鮮」に提供したい場合、Cache-Controlヘッダーは次の値に設定されます。

キャッシュ制御:キャッシュなし
これは、アイテムをまったくキャッシュしないこと、およびリポジトリにアクセスするたびにクライアントがアイテムを要求することを指定します(この場合、ファイル本体をダウンロードする必要があるため、ファイルのダウンロード時間が長くなります)。

ファイルを常に最新の状態に保つもう1つの方法は、ファイル名にコンテンツチェックサムを追加することです。

ファイルの内容が少なくとも1ビット変更されると、チェックサムも変更されます。 変更がなかった場合、ブラウザはキャッシュからのファイルを使用します。 ファイルを変更すると、ファイルへのリンクが変更され、新しいバージョンがロードされます。

チェックサムは、標準のmd5sumまたはsha1sumユーティリティと、特別なユーティリティの両方を使用して取得できます。

また、ファイルへのリンクに任意の文字セット(タイムスタンプ(http://example.com/script.js?timestamp_here)など)を追加し、サイトが展開されるたびにリンクを更新することもできます。 ただし、この方法を使用する場合、ブラウザが不要な要求を行わないという保証はありません。内容が変更されていないファイルに対しても、別のリンクがリードし(キャッシュキーはクエリパラメータとともにリンク全体です)、それらを再度ダウンロードする必要があります。

HTMLページの場合、Cache-Controlヘッダーをno-cacheに設定することをお勧めします。 ページ上で緊急に何かを変更する必要があり、クライアントがこのページをすでにキャッシュしている場合(最新のブラウザはデフォルトでこれを行います)、クライアントは変更をまったく表示しない可能性があります。

これは、CDNを使用する場合に特に重要です。アカマイのCDNは、デフォルトで24時間、対応するヘッダーのないファイルをキャッシュします。 もちろん、キャッシュをクリアすることはできますが(上記を参照)、対応するリクエストを送信してから少なくとも15分待つ必要があります。 キャッシュなしの値を設定すると、起こりうる問題を回避するのに役立ちます。ページは常に最新の状態で読み込まれます。 この場合のブラウザは引き続きIf-None-Match(またはIf-Modified-Since)ヘッダーを使用し、変更されていないページは再度読み込まれません。

場合によっては、変更の頻度に基づいてHTMLページのキャッシュ時間を指定する方がよい場合があります。 たとえば、サイトのニュースが掲載されているページが1時間ごとに更新される場合、max-ageを3600(1時間)に設定できます。

ストア内のCache-Controlヘッダー(およびその他のHTTPヘッダー)の値は、Webインターフェイスを介して設定できます。

ウェブインターフェースを介して、ヘッダー値はコンテナ全体に対してのみ設定されます。 個々のファイルのヘッダー値は、APIを介して、またはサードパーティのクライアントを使用してのみ設定できます。

Cache-Controlの代わりにExpiresヘッダーを使用できます。 その値は、RFC 1123の日付形式で日付を示し、それ以降はファイルが無効になります(例:2012年1月31日火曜日15:02:53 GMT)。 この日付まで、ブラウザはサイトにリクエストを送信しませんが、キャッシュからファイルを受信します。 この日付以降、ファイルは再度ダウンロードされます。

圧縮の助けを借りて、あなたはサイトの読み込みを大幅にスピードアップすることができます。 HTTP / 1.1以降、クライアントはサポートされている圧縮方法をAccept-Encodingヘッダーで報告します。

Accept-Encoding:gzip、deflate
サーバーの応答では、使用された圧縮方法に関する情報がContent-Encodingヘッダーで送信されます。

コンテンツエンコーディング:gzip
もちろん、今日最も人気があり、最も一般的に使用されている方法の1つはgzipです。 その助けを借りて、ダウンロード時間を大幅に短縮することができます。 Gzipは、HTML、CSS、JSなどのテキストファイルで特にうまく機能します。 圧縮のおかげで、テキストファイルのサイズ(したがって、送信されるトラフィックの量)は平均5〜10分の1に削減されます。 これにより、ページの読み込み速度が大幅に向上する可能性があります。これは、接続が遅いモバイルクライアントにとって特に重要です。

グラフィックファイルにgzipを使用することは意味がありません。圧縮してもサイズを大幅に縮小することはできず、多くの場合、サイズを大きくすることさえあります。

Akamai CDNは、デフォルトでほとんどのテキストファイルにgzipを使用します。

縮小とは、ファイルのサイズを縮小し、ダウンロード時間を短縮するために、ファイルから不要な/オプションの文字を削除することを意味します。 このため、ファイルサイズは平均1.5〜3分の1に削減されます。 今日、JSやCSSだけでなく、他の種類のファイル(HTML、グラフィックファイルなど)も縮小する方法が広まっています。

縮小化には、特に次のような特別なツールが使用されます。

ミニファイの助けを借りて、重要でないスペースや改行を削除するだけでなく(CSSとJSではオプションです)、より複雑な操作を実行することもできます。 たとえば、JSでは次のような関数です。

関数summ(first_param、second_param)(return(first_param + second_param);)
これを関数s(a、b)(return(a + b))に変換し、その操作のロジックを完全に維持しながら、コード内のあらゆる場所でsummの代わりにsを使用できます。 JavaScriptの縮小手順がどのように機能するかは、http://lisperator.net/uglifyjs/の「OpenDemo」セクションで確認できます。

最新のブラウザは、ドメインごとに平均6つの同時リクエストを行います。 サイトに小さなファイルが多数含まれている場合、読み込みに時間がかかることがあります。これは、接続が遅いか不安定な場合に特に顕著です。

これは、連結が役立つ場合があります-同じタイプの複数のファイル(JSやCSSなど)を1つに結合します。 これにより、リクエストの数を減らして、ページの読み込み速度を上げることができます。

連結を使用して、画像の読み込みを高速化することもできます。 これは、URLにデータを埋め込む方法と、スプライトを使用する方法の2つの方法で実行できます。

データインジェクションは、特別なタイプのURL(データ:URI)を使用して実行されます。 URI(Universal Resource Identifator)は、CSSのimgタグのsrc属性と背景画像のURLの両方で使用できます。

画像をデータに変換するためのオンラインツールがあります:URI(たとえば、およびを参照)。

スプライトは、1つの画像に結合された画像のコレクションです。 さまざまなソフトウェアツールを使用してサイトを形成します。 CSSを使用すると、大きな画像の必要なセクションを参照して、サイトの適切な場所に配置できます。

スプライトは読み込み速度を上げるのに役立ちますが、操作が難しい場合が多いことに注意してください。 スプライトに少しでも変更を加えるには、CSSに付随する変更を加える必要があります。

JSプロジェクトを構築するための最新のツール(

Webサイトのコンテンツを興味深いコンテンツで更新するために毎日作業していると、おそらく毎日何百もの新しいWebサイトが作成され、何百もの新しいドキュメントが毎日追加されていると考えているでしょう。 これらすべての新しいページ配列はどのように作成され、どのように迅速に更新されますか? これはすべて、動的Webページの概念を使用しているため、一見したほど複雑ではありません。

この記事では、プレスリリースWebサイトの公開メカニズムを作成する手順について説明します。 当サイトは、データベースに保存されているオンザフライのプレスリリースをテンプレート化されたWebページに接続します。 Webサイト開発ツールについて書かれた本や記事がたくさんあるので、読者にWebサイト開発ツールの基本を紹介するつもりはありません。 この記事は主に、Webページや単純なサイトの作成にすでに経験があるユーザーを対象としています。 私たちの主な目標は、最初の動的Webサイトの開発を開始する方法を示すことです。 この記事を理解するには、情報システムアーキテクチャ、ハイパーテキストマークアップ言語(HTML)、およびPerlプログラミング言語の基本的な知識があることが望ましいです。 このサイトの構築には、Apache、MySQL、Perl / DBIの3つの強力なオープンソーステクノロジーを使用します。

静的Webサイトとは何ですか?

動的なWebサイトの開発に取り掛かる前に、静的なWebサイトとそれを構成する静的なWebページが何であるかを理解することが重要です。 静的Webページは手動で作成され、保存されてサイトにアップロードされます。 このようなページのコンテンツを変更する必要がある場合は常に、ユーザーは通常HTMLエディターを使用して、仕事用のコンピューターでページを変更し、保存してから、Webサイトに再アップロードします。 CNN.comやBBC.co.ukのようなポータルをよく見ると、これらの企業はサイトのコンテンツを更新するためにレイアウトデザイナーの軍隊を雇っていると思うかもしれません。 実際、動的なWebサイトの概念を使用するより良い方法があります。

動的ウェブサイトとは何ですか?

動的Webサイトの表示される各ページは、絶えず変化するコンテンツが挿入されるテンプレートページに基づいており、通常はデータベースに保存されます。 ユーザーがページを要求すると、関連情報がデータベースから取得され、テンプレートに挿入されて新しいWebページが形成され、Webサーバーからユーザーのブラウザーに送信されて期待どおりにレンダリングされます。 コンテンツに加えて、Webサイトのナビゲーションも動的に作成できます。 したがって、サイトのコンテンツを更新する必要がある場合は、新しいページのテキストを追加するだけで、特定のメカニズムを使用してデータベースに挿入されます。 その結果、Webサイトは更新されているように見えます。

ダイナミックなウェブサイトの構築

動的サイトを作成するために最初に必要なのは、ApacheなどのWebサーバーです。

Webサーバーは、eコマースサイト、ニュースサーバー、検索エンジン、遠隔学習システム、さらにはこれらすべての分野にサービスを提供するために使用できます。 Webサーバーの選択は、個人または組織がインターネット上で実行しようとしているアクティビティの種類によって異なります。

Webサーバーのプラットフォームを選択することほど重要な、ビジネスで行う戦略的決定はほとんどありません。 サーバーのパフォーマンスは、サイトの信頼性、クライアントの要求に対するサイトの応答性、およびサイトの稼働を維持するために必要な労力を決定する上で非常に重要な要素です。 適切なコンポーネントと高品質のデザインを備えたWebサイトは、顧客やパートナーに、会社とやり取りするための新しい、より便利な方法を提供できます。 Webサーバーをオーバーロードすると、データベースサーバーまたはその他のリソースがクライアントで使用できなくなる可能性があります。

大企業は最近までMicrosoftInternet Information Server、Netscape FastTrack、IBM WebSphereに依存しており、Apacheは主に中小企業によって使用されていました。 しかし、現在、状況は多少変化しており、Apacheはいくつかの大規模なインターネットプロジェクト、特にYahooのパフォーマンスをサポートし始めています。

記事の完全版はCD-ROMにあります。

Apacheには、個人や企業のニーズに合わせてWebサーバーをカスタマイズするための豊富なオプションが用意されています。 設定は、構成ファイルに含まれているディレクティブを使用して行われます。 Apacheを使用すると、仮想Webサイトを作成でき、プロキシサーバーとしても機能します。 サーバーのコンテンツへのアクセスを限られた人数だけに提供する必要がある場合は、指定されたディレクトリにアクセスするときに、サーバーが自身またはデータベースの1つでログイン名とパスワードをチェックするようにWebサーバーを構成できます。それに接続されています。

次に、Webページに表示されるコンテンツ(コンテンツ)をどのように保存するかを決める必要があります。 この記事では、特定の例を使用して、MySQL DBMSでデータベースを作成する方法を示します。これにより、Webコンテンツをフィールドとデータを含むレコードを含むテーブルに分割できます。 フィールドは、テーブル内のデータの個別の単位です。 たとえば、col_title、col_date、col_fullstory、col_authorフィールドを使用してtbl_news_itemsテーブルを作成できます。 MySQLは、その使いやすさと管理のしやすさ、LinuxやWindowsを含むさまざまなプラットフォームへの無料配布、そして急速に人気が高まっているため、このようなデータベースを作成するための優れた選択肢です。

その後、ダイナミックHTMLテンプレートページを作成します。 データベースやテンプレートと対話するためのアプリケーションを開発するために、Perl言語を使用します。

実際、3つのPerlプログラムまたはスクリプトを作成する必要があります。1つは利用可能なすべてのプレスリリースへのリンク(pr-list-dbi.pl)を表示し、もう1つは選択したプレスリリースのコンテンツ(pr-content-dbi)を表示します。 pl)と3つ目は、データベース(pr-add-dbi.pl)に新しいプレスリリースを追加できるようにします。 レイアウト作業は、Allaire HomeSite(http://www.allaire.com/)などのお気に入りのHTMLエディターに割り当てることができます。 テンプレートを作成するときは、動的な塗りつぶしが挿入される空の領域(もちろん可変長)を残す必要があることを覚えておいてください。

プレスリリースの一般的なデザインを作成したら、上の空白の領域に特定のキーワードを挿入するだけです(詳細については以下を参照してください)。 ユーザーがプレスリリースを要求するとすぐに、WebサーバーはPerlコードを解析し、テンプレート内のキーワードをデータベースから取得したコンテンツ、つまり特定のプレスリリースに置き換えます。

最後に行うことは、テンプレートを特定のディレクトリのWebサーバーにアップロードすることです。 CuteFTP FTPクライアント(http://www.cuteftp.com/)を使用できますが、FARファイルラッパーを使用することをお勧めします。 覚えておくべき2つの重要なこと:最初に、テンプレートファイルには.plで終わる名前が含まれている必要があり、次に、実行可能である必要があります(UNIXシステムでは、chmod 0755 template_name.pl)。 それがすべてです!

機能の追加

プレスリリース発行メカニズムに機能を追加することは難しくありません。 データベースで利用可能なプレスリリースへのリンクを日付またはタイトルで並べ替え、年ごとにグループ化できます。 または、たとえば、実際にいつ公開されたかに関係なく、訪問者に情報を提供するために、Webページに時折プレスリリースを表示したい場合があります。 しかし、おそらく最も重要で便利な機能は、プレスリリースのコンテンツを入力するためのHTMLフォームを追加し、このフォームを処理してドキュメントをデータベースに投稿するためにPerlでCGIプログラムを開発することです。 CGI(Common Gateway Interface)は、Webサーバーと単一のプログラムの間のプロトコル、メカニズム、または正式な合意であることを思い出してください。 サーバーはHTMLフォームなどの入力データをエンコードし、CGIプログラムはそれをデコードして出力ストリームを生成します。 プロトコル仕様は、特定のプログラミング言語については何も述べていません。 したがって、このプロトコルに準拠するプログラムは、C、C ++、Visual Basic、Delphi、Tcl、Python、または私たちの場合のようにPerlで、ほぼすべての言語で記述できます。

結果のいくつかを要約しましょう。 この記事が、静的Webページに対する動的Webページの概念の利点を理解するのに役立つことを願っています。 この概念を適用すると、手作業が減り、サーバーのワークロードが分散され、サイトにコンテンツがすばやく追加されます。 Apache、MySQL、およびPerlの組み合わせにより、実質的に無料で使いやすく、クロスプラットフォームでスケーラブルな開発環境をインストールおよび構成するための柔軟性が提供されます。 ここでは、インストールの詳細については考慮しません。これは、まず、この記事に十分なスペースが割り当てられていないためです。次に、これらの各ツールには非常に詳細なドキュメントが付属しています。

MySQLDBMSでデータベースを作成する

データベースモデル開発

データベースを作成するための最初の最も重要なステップは、そのモデルを開発することです。 それでは始めましょう。

ステップ1

どういうわけかデータベースに名前を付ける必要があります。 それをdb_websiteと呼びましょう。

ステップ2

データベーステーブルに何が含まれるかを正確に決定する必要があります。 データベースには、何百ものテーブルを含めることができます。 最初は、プレスリリースを保存するために必要なテーブルは1つだけです。 それをtbl_news_itemsと呼びましょう。

ステップ3

テーブルに含まれるフィールドを定義する必要があります。 これらのフィールドは、プレスリリースのすべての要素を表します。 この例では、col_id(プレスリリースの数値ID)、col_title(タイトル)、col_date(発行日)、col_fullstory(コンテンツ)、col_author(作成者名)の5つのフィールドを使用しています。 col_idフィールドには、ユーザーが特定のプレスリリースのコンテンツを照会できる一意の識別子が含まれます。

データベースの作成

次に、MySQL DBMSへの接続を確立し、データベースを作成する必要があります。 以下に、コマンドラインからこれを行う方法を示します。 ただし、使いやすいグラフィカルインターフェイスを使用して管理できる管理システム(DBMSマネージャー)は数多くあります。

とりわけ、構造化照会言語(SQL)の基本を確実に知っておく必要があります。 MySQL DBMSには、サポートされているSQL仕様の完全な説明が付属しています。 この言語は、その演算子とその構造が理解しやすく、覚えやすいため、理解しやすいです。 これを機能させるには、データの作成(CREATEまたはINSERT)、選択(SELECT)、削除(DROPまたはDELETE)、およびデータの変更(UPDATE、MODIFY)のためのステートメントが必要です。 特定の例では、そのうちのいくつかのみを使用します。

ユーザーアカウントの設定と必要なアクセス権の割り当てをスキップするために、管理者(root)アカウントを使用していると仮定します。

ステップ1

ターミナルウィンドウを開き(LinuxまたはWindows 9x / NT / 2000用のXWindow GUIを使用している場合)、コマンドラインでmysqlと入力してMySQLDBMSに接続します。 応答として、mysql>コマンドの入力を求められるはずです。

ステップ2

次のように入力して、データベースを作成しましょう。

CREATE DATABASE db_website;

各コマンドの後に(;)を入力することを忘れないでください。 コマンド入力を終了する信号をMySQLに送信するため、これは非常に重要です。

db_websiteを使用します。

ステップ4

テーブルtbl_news_itemsを作成しましょう。ここで、フィールドに格納されるデータのタイプを定義します。 入力:

1.CREATE TABLE tbl_news_items(2.col_id INT NOT NULL AUTO_INCREMENT PRIMARY KEY、3.col_title VARCHAR(100)、4.col_author VARCHAR(100)、5.col_body TEXT、6.col_date DATE 7.);

ステップ5

データを保持するテーブルを作成したので、サンプルデータを入力する必要があります。 次のコマンドでは、col_idフィールドを定義しないことに注意してください。これは、新しいデータが追加されると自動的に入力されるためです。 また、日付の構文は次のとおりであることに注意してください。<год/месяц/день>..。 したがって、mysql>プロンプトで、次のコマンドを入力します。

8. INSERT INTO tbl_news_items(col_title、_ col_author、col_body、col_date)9。VALUES(10。 '私の最初のプレスリリース'、11。 'あなたの名前'、12。 'このプレスリリースはMySQLデータベースに保存されています'、13 。'2001/ 4/15 '14.);

挿入する同様のクエリをさらにいくつか入力します。 データベースに保存されているものを表示するには、mysql>プロンプトで次のように入力します。

SELECT * FROM tbl_news_items;

Perlで動的なWebページを作成する

仕事の準備

Perlプログラムを実行するには、UNIXまたはWin32用のPerlStandardまたはActiveStatePerlディストリビューションのPerlインタープリターバージョン5.005または5.6が必要です。 Win32で機能するアプリケーションを開発している場合は、ActiveStateのパッケージの方が使いやすく、さらに、追加のモジュールをインストールするためのPPMユーティリティが含まれています。

PerlプログラムとMySQLDBMSの相互作用を整理するには、PerlパッケージにDBIモジュールが含まれている必要があります。 モジュールは基本的にそれ自体では何もしませんが、データベースと対話するためのすべての操作をそれらに対応するドライバーにシフトするため、DBD-Mysqlライブラリ(DBIモジュールのMySQLデータベースのドライバー)をインストールする必要があります。 モジュールの作成者であり開発者であるTimBunceは、次のように述べています。「DBIは、PerlプログラムからデータベースにアクセスするためのAPIです。 DBI API仕様は、データベースとの透過的なインターフェースに使用される一連の関数、変数、およびルールを定義しています。」

データベースドライバーの概念は非常に便利です。Perlアプリケーションでは標準のDBI呼び出しを使用し、それが対応するドライバーにモジュールを転送します。これにより、技術的な知識を必要とせずに、データベースと直接対話します。特定の各DBMSの機能。 したがって、ドライバーDBD :: Sybase、DBD :: Oracle、DBD :: Informixなどがあります。 (( ご飯。 1 , ).

記事の範囲を少し超えてみましょう。 DBIパッケージに特定のDBMS用のドライバーが含まれていないとしましょう。 この場合、DBD-ODBCブリッジが役に立ちます。 ODBCドライバー(Open DataBase Connectivity)の新しいデータソース(データソース名)を作成するだけで十分です。ここで、このDBMSのタイプ、接続を確立するホストアドレス、データベース名を選択する必要があります。および認証データ、つまりユーザー名とパスワード( ご飯。 3)。 次に、DBIモジュールを使用して、データベースと対話します。 さらに、Win32 :: ODBC(Win32-ODBC)モジュールは通常、ActiveStatePerlの標準ディストリビューションに含まれています。 DBIでの作業とは少し異なりますが、一般的には非常に似ています。 唯一の違いは、Win32 :: ODBCはWin32のみのモジュールであり、DBD :: ODBCよりも効率的にネイティブODBC関数を操作できることです。

ODBCとDBIの間に類似点を描くことができます。 DBIは、ODBC Administrator(Database Driver Manager)に類似しています。 各DBDドライバーは、その機能がODBCドライバーに対応しています。 混乱する可能性がある唯一のことは、前述のように、DBD :: ODBCドライバーがあるという事実です。 ただし、ODBCドライバーとのDBI接続を確立することしかできません。

Win32のPPMユーティリティを使用してDBIおよびDBD-Mysqlをインストールするには、次のように入力します。

PpmインストールDBI

この時点で、コンピューターがインターネットに接続されている必要があることに注意してください。 ローカルディスクに対応するモジュールがある場合は、次のコマンドを入力してヘルプ情報を使用します。

Ppmヘルプのインストール

UNIXユーザーの場合、DBIモジュールのインストールは、他のPerlモジュールのインストールとほとんど同じです。

Tar –zxvf DBI-1.06.tar.gz cd DBI-1.06 / perl Makefile.PL make make test make install

CPANシェルを使用することもできます。 UNIXバージョンのActiveStateパッケージがコンピューターにインストールされている場合は、PPMインストールユーティリティを使用することもできます。 コンピューターが接続されているエンタープライズネットワークにファイアウォールまたはファイアウォールがインストールされていると、CPANシェルとPPMシェルが機能しない場合があります。 この場合、ソースコードが手動でロードされたモジュールによってのみ支援されます。 それらをインストールしてPerlまたはApacheに接続するには、Perlインタープリター、C / C ++またはGCC / PGCCコンパイラー、およびいくつかのmakeビルドユーティリティ(UNIXクローンの1つとMicrosoft VisualCによって提供される)が必要です。 ++)、nmake、またはdmake。 したがって、モジュールをインストールする手順はやや複雑です。 それらのほとんどすべてに、簡単に開始できる「ビルド」ドキュメントが付属しています。

記事のリストを表示する

プレスリリースデータベースが機能するようになったので、それをWebページに簡単に接続できます。 利用可能なすべてのプレスリリースのリストを表示する簡単なページを作成することから始めましょう。 デフォルトでは、Apache Webサーバーは、すべてのドキュメントがhtdocsディレクトリにあり、実行可能ファイルがcgi-binにあると「考えている」ことに注意してください。 したがって、拡張子が.plのすべてのファイルをcgi-binディレクトリに配置する必要があります。 次に、生成されたHTMLテンプレートファイルをtplディレクトリに配置する必要があります。 ディレクトリ階層は次のようになります。

/(任意のディスクのルート)/ local / local / usr / local / usr / bin / local / usr / cgi-bin / local / usr / htdocs / local / usr / tpl

DOS / Windowsシステムの場合、cgi-binへのパスは次のようになります。

C:\ローカル\ usr \ cgi-bin

ステップ1

お気に入りのテキストエディタを使用して、pr-list-tpl.htmファイルを作成します。

15. 16. 17. プレスリリース2001 18. 19. 20. @[メール保護] 21. 22.

このファイルは、利用可能なすべてのプレスリリースのリストを表示することを目的としています。

ステップ2

見つかったプレスリリースを含む各ブロックを表として表示するpr-list-block-tpl.htmファイルを作成します。

23.

24. 25. 26.
@[メール保護]
@[メール保護], _ @[メール保護]

ステップ3

プレスリリースの内容を表示するpr-content-tpl.htmファイルを作成します。

27. 28. 29. 2001年のプレスリリース:@ TITLE @ 30. 31. 32.

@[メール保護]

33. 34. 35. 36. 37.
@[メール保護]
著者: @[メール保護]日にち: @ [メール保護]
@[メール保護]
38. プレスリリースのリストを表示する.. 39. 40.

ステップ4

db_websiteデータベースからデータを読み取るPerlスクリプトpr-list-dbi.plを作成し、テンプレートHTMLファイルを使用して、プレスリリースのリストを表示します(このスクリプトのテキストはCDにあります)。

それでは、コードリストを見て、プレスリリースリストプログラムがどのように機能するかを見てみましょう。

1〜9行目は初期化ブロックのようなもので、すべてのグローバル変数と定数が宣言されています。

41。#!/ローカル/ usr / bin / perl 42.43.DBIを使用します。 44. $ dbh = DBI-> connect( ‘dbi:mysql:db_website’、 ’root’、 ’’); 45. $ path = "/ local / usr / tpl"; 46. $ TPL_LIST = "$ path / pr-list-tpl.htm"; 47. $ TPL_LIST_BLOCK = "$ path / pr-list-block-tpl.htm"; 48. 49. print "Content-type:text / html \ n \ n";

まず、Apache Webサーバーに、Perlインタープリターが配置されている場所を示すパスを指示します。このパスは、スクリプトが要求されたときに実行され、エラーがないかチェックしてから実行します。 次に、DBI(データベースインターフェイス)モジュールを宣言します。このモジュールのメソッドは、データベースと対話するためにプログラムで使用されます(3行目)。 次に、ログインユーザー名としてroot(管理者)を指定し、パスワードとして空の文字列(デフォルト)を指定して、db_website(4)データベースへの接続を確立します。 $ path変数で、HTMLテンプレートファイルが配置されているパスを指定します(5)。 変数$ TPL_LISTと$ TPL_LIST_BLOCKには、それぞれ名前(6、7)が示されています。 次に、HTMLストリームをユーザーのブラウザに出力するために、すべての送信データをMIMEテキスト/ html形式で提示する必要があることをWebサーバーに通知します(9)。

11〜22行目は、プログラムの本体を表しています。

50.51。open(L、 "$ TPL_LIST"); 52. while($ line1 = )(53 .chomp($ line1); 54 .if($ line1 =〜/ \ @ BLOCK \ @ /)(55 .read_db(); 56 .ins_data(); 57.)else(58 .print "$ line1 \ n "; 59.)60.)61。閉じる(L); 62.63。$ dbh->切断;

テンプレートファイルpr-list-tpl.htm(11)を開き、ループ(12-20)でそれを調べ、読み取られた各行を$ line変数に書き込みます。 各反復中に、この行に@キーワードが存在するかどうかを確認します。 [メール保護](14-19)、これは、この場所にプレスリリース付きのブロックを挿入する必要があることを意味します。 見つかったら、read_db()およびins_data()プロシージャを呼び出します。

26〜39行目は、プレスリリースを格納するtbl_news_itemsテーブルの内容を読み取るread_db()ルーチンの本体です。

64.65.66。subread_db(67。$ c = 0; 68. my($ sql)= "SELECT * FROM tbl_news_items"; 69. $ rs = $ dbh-> prepare($ sql); 70. $ rs->実行;71。while(my $ ref = $ rs-> fetchrow_hashref())(72。$ id [$ c] = "$ ref->( 'col_id')"; 73. $ title [$ c] = " $ ref->( 'col_title') "; 74. $ author [$ c] =" $ ref->( 'col_author') "; 75. $ date [$ c] =" $ ref->( 'col_date' ) "; 76. $ c ++; 77.)78。$ rs-> finish(); 79.)

カウンター$ c = 0を初期化し、テーブルからすべてのデータを選択するクエリを作成し(28)、クエリを実行し(29、30)、データをレコードセット(レコードセット)$ rsに取得します。 次に、ループ(31-37)で、fetshrow_hashrefメソッドを使用してレコードセットからデータを抽出し、現在のレコードのフィールドの名前と値を含む連想配列%ref(31)への参照を返します。 抽出されたデータ(32-35)を、それらのタイプに対応する通常の配列@ id、@ title、@ author、および@dateに書き込みます。 レコードセット(38)を閉じます。

41〜53行目はins_data()プロシージャの本体であり、データベースから抽出されたデータの発信データストリームへの挿入を実装します。 55〜63行目-ins_data()プロシージャからループで呼び出されるpr_block()プロシージャの本体:

80. 81. sub ins_data(82。$ toread = "pr-read-dbi.pl"; 83. for($ i = 0; $ i<$c; $i++) { 84. $line = &pr_block; 85. 86. $line =~ s/\@NUMBER\@/$id[$i]/; 87. $line =~ s/\@TITLE\@/$title[$i]/; 88. $line =~ s/\@AUTHOR\@/$author[$i]/; 89. $line =~ s/\@DATE\@/$date[$i]/; 90. $line =~ s/\@READ\@/$toread/; 91. print "$line"; 92. } 93. } 94. 95. sub pr_block { 96. my($block) = ‘’; 97. open (B, "$TPL_LIST_BLOCK"); 98. while ($line=)(99。$ブロック= $ブロック。$行; 100。)101。閉じる(B); 102.リターン($ブロック); 103.)

したがって、read_db()プロシージャの結果として、カウンタ$ cの最大値を受け取った後、ループ(43-52)で、pr-list-block-の内容を読み取るpr_block()プロシージャを実行します。 tpl.htm HTMLテンプレートを作成し、それを変数$ブロック(59)に書き込みます。これは、ins_data()プロシージャの$行(44)変数で返されます(62)。 さらに同じサイクルで、発信$行ストリームで見つかったキーワード@を(46-50)置き換えます [メール保護], @[メール保護], @[メール保護], @[メール保護], @[メール保護]@ id、@ title、@ author、@ date配列の値、およびこのループ反復($ i)に対応する$ toread変数に。

プレスリリースのテキストを表示する

データベースで利用可能なすべてのプレスリリースのリストを表示した後( ご飯。 4)、ユーザーにそのうちの1つのテキストを表示する機会を与える必要があります(対応するスクリプトはCDにもあります)。

新しいpr-read-dbi.plスクリプトは、すでに作成したpr-list-dbi.plスクリプトとは少し異なります。

このリストはリスト1と98%似ていますが、いくつかの小さな違いがあります。

  • クエリ文字列からid(9)パラメータを読み取るための接続されたCGIライブラリ(たとえば、http://localhost/cgi-bin/pr-content-dbi.pl?id = 1);
  • 1つのHTMLテンプレートのみが使用されます(pr-content-tpl.htm)。
  • データベースクエリには、col_id識別子によって特定のプレスリリースに対応するすべてのデータを選択するための条件付きSQLWHERE句が追加されています。
  • 選択したプレスリリースのテキストを含むcol_bodyフィールドもデータベースから読み取られます。

新しいプレスリリースの作成

データベースを直接操作してtbl_news_itemsテーブルに新しい情報を補充する必要なしに、新しいプレスリリースを作成する機能を追加することにより、システムの機能を拡張します。

したがって、新しいPerlプログラム(前の2つと同様にCDに収録されています)は、主にデータの表示ではなくデータベースへの追加を目的としているという点で、以前のプログラムとは異なります。 したがって、SQL INSERTクエリとDBIモジュールの対応するステートメントを使用して、データベースとの対話を担当する部分を少し変更する必要があります。

12〜18行目は、メインプログラムの本体です。

12. if($ cmd ne "add")(13.&show_form; 14.)else(15。$ dbh = DBI-> connect( 'dbi:mysql:db_website'、_ 'root'、 ''); 16 。&add_pr; 17.dbh->切断; 18。)

ここでは、プレスリリースをデータベースに追加するためにチームが到着したかどうかを確認します。 到着するとすぐに、データベースへの接続を確立し(15)、app_pr()サブルーチンを実行し(16)、接続を終了します(17)。 コマンドがなかった場合は、プレスリリースデータの入力フォーム(13)、つまりshow_form()プロシージャを表示するだけです。

20〜36行目は、pr_add()プレスリリース追加ルーチンの本体です。

19. 20. sub add_pr(21。$ title = $ q-> param( "pr_title"); 22. $ author = $ q-> param( "pr_author"); 23. $ body = $ q-> param( "pr_body"); 24. $ body = 〜s / \ r \ n /
/ NS; 25.26.my($ sql)= "INSERT INTO tbl_news_items(col_title、col_author、col_body、col_date)VALUES(\ '$ title \'、\ '$ author \'、\ '$ body \'、CURDATE())"; 27. $ rs = $ dbh-> do($ sql); 28.29.if( [メール保護])(30。$ rc = $ dbh-> rollback; 31.)else(32。$ rc = $ dbh-> commit; 33.)34。35. print "Location:/ cgi-bin / pr-list-dbi .pl \ n \ n "; 36.)

まず、フォーム(22-25)のデータを処理し、SQLクエリ(27)を作成し、DBIメソッド$ dbh-> do()を使用して実行(27)します。 ここではデータベースへのデータ挿入の手順を行っているため、失敗した場合に操作をキャンセルする可能性に注意する必要があります。 これを行うために、トランザクションの元に戻すコードとロールバックコードを前の状態(30〜34)に挿入しました。 $ dbh-> do()が失敗した場合は、行った変更を元に戻します(31)。 障害が発生しなかった場合は、加えられた変更を確認します(33)。 次に、すべてのアクションの後、すべてのプレスリリースのリストがあるページに移動します(36)。

37〜55行目は、新しいプレスリリースに関する情報を入力するためのフォーム出力プロシージャの本体です(HTMLテンプレートが使用され、その名前は$ TPL_INSERT変数pr-add-tpl.htmで指定されます)。

37. 38. sub show_form(39。print "Content-type:text / html \ n \ n"; 40. 41. open(L、 "$ TPL_INSERT"); 42. while($ line = )(43。chomp($ line); 44. if($ line =〜/ \ @ /)(45。if($ line =〜/ \ @ ADD \ @ /)(46。$ toadd = "pr-add -dbi.pl "; 47. $ line = 〜s / \ @ ADD \ @ / $ toadd /; 48.)else(49。$ tolist =" pr-list-dbi.pl "; 50. $ line =〜 s / \ @ LIST \ @ / $ tolist /; 51.)52.)53。print "$ line \ n"; 54.)55。close(L);

システムの過負荷

動的なWebサイトを開発しているので、それに応じてその情報の量は非常に急速に増加する可能性があります。 さらに、リソースの人気が高まると、その訪問者の数も増え、サーバーの過負荷、つまりシステムパフォーマンスの低下につながる可能性があります。 ハードウェアの能力を高める方法を探し始め、新しいシステムの構成を見つけようとする前に、RAMの過度の消費の考えられる原因の1つを排除することを試みることができます。 同じPerlが原因である可能性があります。 実際には、特定のPerlスクリプトにアクセスするたびに、WebサーバーはインタープリターをRAMにロードし(ハードディスクでは500〜1000 KBかかります)、後者は構文エラーを検索するためにプログラムを最初から最後まで解析します。 ..。。 その後、彼はそれを再度読み取り、変数と関数を初期化し、入力データ(パラメーター)を読み取り、処理して結果を返します。 同時にプレスリリースがあなたのサイトへの何百人もの訪問者を見たいと思ったらどうなるか想像できますか?

このプロセスを高速化するために、ApacheWebサーバー用の追加モジュールであるmod_fastcgiおよびmod_perlという特別なソリューションが作成されました。

FastCGIモジュール(mod_fastcgi)は、オペレーティングシステムの実行中のプロセス(タスク)間でのデータ交換ツールの広範な使用を前提としています。 作業の開始時に、WebサーバーはCGIプログラムをアクティブにし、プログラムとそのいくつかのコピーをバックグラウンドで実行したままにします。 プログラムへのリクエストは、すでにアクティブなコピーに転送されるだけで、プロセスの再アクティブ化に関連する追加の負荷からサーバーが解放されます。

mod_perlモジュールを使用すると、Apache Webサーバー自体と同じアドレス空間のRAMにPerlをロードし、Perlをメモリに残して、後者が終了するまで、CGIプログラムにアクセスするときにインタープリターの次のコピーがロードされないようにします。 このモジュールは、プログラムを変更する必要がないため、FastCGIよりも頻繁に使用されます。

ComputerPress 6 "2001

静的ページを管理するためのインターフェースは、さまざまな要素が配置されている1つの統合ブロックで構成されています(図5.1)。
実際、このページには、「タイトル」列と「ページアドレス」列のあるテーブルが表示されます。
上部には、ページ付けで表示する静的ページの数を指定できる入力フィールドがあります。
静的ページで3つの一括操作(削除、公開、非公開)も利用できます。

新しいページを追加する

新しいページを追加するには、[静的ページの追加]タブをクリックします(図5.2)。

その後、入力する必要のあるフォームのあるページにリダイレクトされます。 (図5.3)。


図5.3

注意:タイトルフィールドとページの本文自体は必須です。

見出し-新しいページの名前が表示されます。 タイトルデータは、ブラウザウィンドウのタイトルバーに表示されるTitleタグのコンテンツです。
アルト。 名前-ここでは、このページへのリンクを提供する必要があります。 注意:リンクはラテン語である必要があり、特殊文字やスペースを含めることはできません。
説明-ページの簡単な説明を作成するために使用され、検索エンジンがインデックス作成に使用します。
キーワード-キーワードメタタグのキーワード。

設定
  • 公開-このフラグが選択されている場合、このページはサイトに表示されません。
  • HTMLタグの使用を許可する-このフラグが選択されている場合、ページの本文で、bbコードに加えて、htmlタグを使用できます。
  • 自動フォーマットを無効にする-このフラグを選択すると、テキストの自動フォーマット、行の折り返しなどが無効になります。
サンプル-ここでは、特定のページが使用するテンプレートを指定する必要があります。
テンプレートは/ templates /(template_name)/ static /ディレクトリに配置する必要があり、拡張子は.tplである必要があります。
トピックの続き:
その他

今日、インターネット上のソーシャルネットワークは、特定の基準で人々をネットワークにまとめる特殊なサイトです。 彼らの成長の中で...