[Powered by Google Translate] [週7は、続く]
[デビッド·J·マラン、ハーバード大学]
[これはCS50です。] [CS50.TV]
かしこまりました。お帰りなさい。これは、CS50です
これは7週目の終わりです。
だから、インターネットのまわりを回ってこれらの愚かなささいなことの一つ
そして我々は、最大丸呑みされ、それが今、あなたにマニアックな感覚の少しを行う必要があります。
まあ、それはそれはあなたたちにあったよりこの男に面白くなった。
、みんな、よくいえば、
今日は、ネイトの誕生日です。
あなたの感覚を与えるためにネイトと私はどれだけ良い
Web開発では、月曜日のクラスに基づいており、現在、これに基づい
私はあなたがまだそれを見ていない場合、私は、ネイトのホームページをアップしようと思いました。
ここでは、このIAネイトのHTML。
だから、あなたがこれを行う方法を見てみたい場合は、彼のソースコードを見て、ネイト
我々だけで簡単にあなたをembarassことができれば、スタッフが少し何かを得た
あなたはここのクラスの子供たちといくつかのデザートを共有したいと思います。
あなたがダウンして上に来るしたい場合。
あなたはすべての拍手と非常にいいですが、誰も、ネイトの近くのどこに座ってされていません
何らかの理由で、そのバックゾーンインチ
だから、おそらく、いくつかの人々がでこれらを楽しむために見つけることができます。
誕生日おめでとう、ネイト。
>> 追加のhello：私達は私達のCS50x学生からカップルクリップを示した。
あなたはそれが世界にある他に誰が見たい場合
に沿って続いていることを、あなたは、次のURLにアクセスして向かうことができます
ジョセフ、私たちのTFの1は、一種のモンタージュを一緒に入れているところ
その中で、リック·アストリーをこれらのビデオを提出されたすべての人の。
あなたはこれらをスクロールした場合と、それは実際に非常に感激です
人々が声を掛ける元の国や都市の多様性を見ることができます。
あなたはそれを見てみたいのですが、もしそうなら、それは学期の終わりまでアップされます。
今日、我々は、当社のWebを見て、Webプログラミング、HTMLなどを継続
我々はまた、今週の金曜日まで来て昼食を取る
あなたは、ご希望であり、特に、前に行っていない場合。
今週の金曜日のテーマは、ネイトの誕生日になります
あなたは、ネイトとの誕生日のランチを持っていると思いますので、もし
など、業界からの私達の友人の何人か、
そこにそのURLに頭をしてください。
スペースは、いつものように、制限されています。また、あなたが忘れてしまった場合、
、その次の週は問題セット4のスカベンジャーハントの締め切りであると認識
それによってcard.rawからそれらのJPEGのすべてを回復した後、
あなたとあなたのセクションの仲間、ご希望の場合、撮影しようとすることができ
可能な限り、そのメモリカードからコンピュータ科学者の多くは、
あなたとあなたのセクションでは、その後、素晴らしい賞品を獲得します。
提出するものとするときなどによってPSET 4の仕様に戻って参照してください。
また、あなたの手仕事は、不死化したいのであれば
コー​​スのウェブサイトとアパレルの歴史上、
あなたがデザインを送信を開始できるようになりまし歓迎されていることを知っている
今年のTシャツやスウェットなどのため。
我々は、我々はできる限り多くを含むように最善を尽くします
しかし、我々はスタッフの一部のメンバーがデザインのすべてを見直す必要があるでしょう
彼らが仕様と一致していることを確認するには、
そして我々は、それらのほんの一握りを発揮するために、一般的に選ぶ。
あなたはデザインタイプがおありであれば、ただ知っている要件
グラフィックスはPNG、少なくとも200 DPIは、アール
彼らは、4000以上のX 4000ピクセルであってはならない
と10メガバイトを超えないが、あなたのようなものを使用することを歓迎している
PhotoshopやGIMPや様々なグラフィックのプログラム、
あなたの処分で持っているものは何でも。
>> また、地平線上に最終的なプロジェクトです。最終的なプロジェクトは、本当に、50のクライマックスです
それによってコース内のすべての割り当ての、
それはあなた自身のことを行うには、本当にあなたの機会です。
そしてそれは、楽しみのために何かをする単にことができ
それはあなたの学生グループが持ついくつかの差し迫った問題を解決することができ、
いくつかの新しいウェブサイトのために、データのためのいくつかの新しいコレクション機構。
それは、iOS用、Android用モバイルアプリケーションにすることができます。
本当に、空は限界であり、今後数週間にわたって、
CからPHPとJavaScriptのようなこれらの高レベルの言語に我々は移行など、
あなた自身がますますいくつかの現実世界の技術に精通見つける、
いくつかの現実世界のツール、およびことを補うために、
もちろん、セミナーの歴史を持っていることを知って、
それによって、今後数週間にわたって、教員の一部
そしてキャンパスでから私たちの友人は、オプションのセミナーを開催しています
その上に行くと、典型的セクションで行われている内容以上の
、Androidのプログラミングのようなものをご紹介し
iOSのプログラミングのようなものをご紹介し
以上の高度なWeb開発技法。
これらの全体の歴史は、すでにオンラインであります。
あなたはcs50.net/seminarsに行けば、私たちは、かなり何年も前からこれを行ってきた
そしてあなたは、PDFやビデオをここにアーカイブ等のことがわかります
セミナーの数十人の動画です。
昨年は、例えば、我々は、あなたの技術的なインタビューをacingに関するセミナーを行いました
あなたが実際にオフに行くとインターンシップやフルタイムのギグをやるために探しているなら。
Windowsモバイル開発、Android開発、Googleマップ、
APIは、CSSは、ブラックベリーは、Emacs用の開発。
本当に、あなたの都合に合わせてこれらのセミナーのいずれかを見てみることを歓迎しています。
そして、我々は同様に、いくつかの新しいものをこの学期を保持することになります。
>> だから最終的なプロジェクトを進めて何ですか？
この日付がやや迫っているにもかかわらず、まあ、まず、
これは実際にはかなり現実的に最終的なプロジェクトについての思考を開始するだけの機会です。
我々は、唯一の私たちはまだコースでカバーされるだろうことのいくつかの始まりを知る
HTML、PHPなどが、Webに精通している、
だけと私はバイアスのWebに向かって、この会話理由
ほとんどの人は、Webベースの最終的なプロジェクトをやってしまう
しかし、それは必要なものではなく、。
C言語を使用して、目的は、C、Java、結構です
あなたが知っているか知りたいと思うかもしれない、他の言語は非常に細かいです。
しかし、最初に流れるジュースを得るために、我々は、提案前の提出を期待するよ
れ、cs50.netで今あるウェブサイト上でPDF、当たり、
そして左上には、最終的なプロジェクトが表示されます
、最終的なプロジェクトのための仕様です
との提案前のの詳細などがあります。
あなたのティーチング·フェローへの電子メールにこれはかなりつまるところ
ちょうどあなたが何を考えているかについての彼または彼女との会話を始めるために。
projects.cs50.netにキャンパス内の人々からのアイデアの宝庫です
あなたには、いくつかのアイデアを考え出すのに苦労しているならば、
とmanual.cs50.net/APIsは、APIへのリンクのリポジトリです。
>> しかし、APIは何ですか？
APIとは何ですか？私は、少なくとも二度それを言ってきました
過去数週間の成績証明書によると。
それは何？ [学生、不明朗]
>>さて、良い。だから何かのプログラミングインターフェイス。
アプリケーション·プログラミング·インターフェース、そして、これはいくつかの形態をとることができ、
しかしこれが何を本当に沸騰ダウンにするコードです。
そのHSが書かれた他の誰かと、または他の誰かが収集したデータ
いくつかのプログラム的な方法であなたに提供されている。
あなたは、CやPHP、Python、Rubyなどのコードを書くことができます
選択した言語は、一般的であるものは何でも、
とあなたは何とか他の誰かの機能の上に構築することができます
または他の誰かのデータが設定されます。
例えば、私がここにこのリンクに行けば、
そしてあなたは、後続のページでリンクのペアが表示されます
それによって我々は、その後CS50自身の非常にハーバード大学を中心としたAPI、およびサードパーティのAPIを持っています。
サードパーティのAPIの中でも本当に便利なものです
人にSMSを送ることができるように、
人からSMSテキストメッセージを受信することができるという。
そして、あなたはどのように自分で実装する見当がつかないかもしれないようなもの、
しかしサービスのおかげで、いくつかの無料のといくつかの商業、
あなたはそれらの上に構築し、あなたに興味の何かを行うことができます。
CS50のAPIの中でのように、これらのキャンパスを中心としたものがあります
ハーバードコース、エネルギー、イベント、食べ物、地図、ニュース、つぶやきとShuttleboy自身、
そしてこれらは、このような少し何かを見てAPIです。
>> 私はHarvardFood APIを引き上げましょう。
あなたがこれまでにHUDのウェブサイトに行った場合は、おそらくそこにしてきた
ちょうど夕食のために何を参照したり、時間がいくつかのD-ホールのために何であるか確認する。
まあ、それは、ナビゲートするために特に簡単ではありません
それで我々はいくつかの時間前、私たちは、ソフトウェアを書いていたなかったもの
それが実際に画面がHUDのウェブサイトの全体を掻き取ることが、PHPであることを起こる。
スクレープ何かをスクリーニングすることにより、PHPのような言語でプログラムを書くことを意味します
それは、コマンド·プロンプトでそれを実行するかもしれませんが、ブラウザのふりをする
ブラウザのふりをする、つまり、Webサイトに接続
ダウンロードはHTML、それが書かれている言語、
し、それを読み取るか、より具体的には、それを解析して
上から下へ、左から右へ。
そして、我々は何だった我々はそのような方法で私たちのコードを書きました
我々はメニューの何かのように見えたそのHTMLで何かを見た、いつ、
ハンバーガーのように、我々は、その私たち自身のデータベースにインポートします。
そして、我々は栄養成分を見て、いつでも、我々は我々自身のデータベースにそれをインポートします。
と、私たちがしたことは事実だったレバレッジHUDのウェブサイト、
それは私たち人間が移動するための挑戦のビットかもしれないにもかかわらず、
フードの下に、HTMLのすべては、独自のコンピュータ·プログラムによって生成されます。
だから、すべてのHTMLの、それは散らかって見えるかもしれませんが、
ボンネットの下にほとんどのWebサイトのようにそれがパターンに従います。
だから我々はまさにそのパターンを考え出すカップルの時間を費やし
だから最後に、我々は厄介なHTMLのすべてを捨てること、
大胆に面し、イタリックなどの美学のすべて、
そして私たちが次に行うことができますと、その同じデータを公開しています。
例えば、このように。
我々だから、ここの資料によると、
あなたがURLを要求した場合ということを世界に伝えている
このように見えるよう、food.cs50.net /何か、
そしてあなたは私たちが今日お話しします特定のパラメータを提供
終了日の時間のような、開始日時、食事など、
何を我々のサーバーは、例えば、あなたに戻ります
CSVファイルで、カンマは、Excelファイルのような値をseparted
昨年の3月にはこの特定の日に朝食のためにすべてを含む
私はこの文書を書き上げるために起こったとき。
>> 精通している人については、CSVは、ファイル形式ではありません。
すべてのより多くの汎用性だ別のフォーマットがあります
JSONは、JavaScriptオブジェクト表記法と呼ばれる。
データがその形式で戻ってくることができます。
だからここに持ち帰りはつまり、あなたがダイビングかどうか、このAPIにある
インターネット上にはCS50のか何かのまたは任意の他、
またはまったく、世界がますます標準化することを開始したことを実現する
マシンがどのように相互通信。
我々は、CSV形式またはJSONのような標準的なデータ形式を使用します。
そして、何これはあなたのために意味するには、プログラムの興味深い部分を書くことができますです
それはあなたのユーザーは、ダイニングホールのメニューを検索することができます
彼らはそれらがテキストアラートを取得することができ、お気に入りのリストを作成することが出来るように
自分の好きな食事は、いくつかのdホールで提供されようとしているとき
それらのAPIの上に誰かのデータセットや建物を使用することによって。
セミナーの形とあなたがここに持っているオンラインドキュメント内のその上に、より多く。
それらのように、その後、APIがあります。
>> つまり、HTMLに私達を戻す。クイック復習。
HTMLとは何ですか？
[学生、不明朗] >>グッド。ハイパーテキストマークアップ言語。
誰か他の人が、ハイパーテキストマークアップ言語は何ですか？
ハイパーテキストマークアップ言語。
オーケー。だから、HTML、ハイパーテキスト。
ハイパーテキストは、ほとんどの部分のために、ウェブを指します。
マークアップは、それが実際にプログラミング言語は、HTMLではないということを意味します。
それはあなたインチロジックを表現できる言語はありません
これは、ループを持っていません。それは条件を持っていません。
それは関数それ自体を持っていません。
むしろ、それは、要素、またはより正確には、タグと呼ばれるこれらのものを持っています。
そして、それらの要素は、開始タグと終了タグを持つ
または開かれたタグと閉じたタグが、これらのタグは一般的には、ブラウザであるために何を意味する
何かを起動して、それに例外はありますが、何かをやって停止します。
時にはそれだけで例えば '、ここに改行を入れて'だ。
そして、我々は、大胆に面し間、その先日の例を見ました
改行してから、他のタグのカップル。
だから、HTMLは、Webページを記述している言語です。
私はGoogle.comのような何かに行くのであれば
そして、ちょうど彼らのホームページをアップ
あなたが右クリックするか、コントロールしている場合、クリックしたことを思い出し
典型的には、ページのソース表示を見
それは、これらの日はボンネットの下に完全な混乱だが、それはだから
コンピュータは、ホワイトスペースを気にしないので、これはかなり見ている必要はありません。
しかし、我々はそれの一部にズームインした場合、
Chromeは、ちょうどいいようにするには、色分けされたものを持っていることがわかります。
確かに、これは我々がWebページで見てきた一番最初のタグです。
そして再び、HTML 5では、この言語の最新バージョンは、
初めにこの事を持っていませんが、
<！DOCTYPE HTML、小文字または大文字かどうか、
それはちょっと、と言う世界標準のちょうど一種だが、ここにHTMLファイルがバージョン5にしています。
>> 面白い部分はここから始まります。それでは<html、および二人の子供があった
HTML要素の最後の時間。
これら二つの主要な子供は何でしたか？
ちょっと前に入れ墨のある男のように頭と体、。
Webページの2つの部分、頭と体には、あります
とリコールは、その後、おそらく我々は作ることができる最も簡単なWebページには、次のようになっている。
そして私はちょうどきちんとしていて私のコードと整頓の一種であるためにそれを下げてきた
しかし、何ここは本当に重要なのは、これにはいくつかの階層があるということです。
私は閉じている開いて、この対称性は、したがってがあることをしたことと、任意のタグ
私が作成したすべてのマークアップへ。
だから前回、我々は自分のラップトップ上のWebページを書き始めた。
私は、私がhello.htmlとしてファイルを保存し、テキスト編集を開いた
私はその後、私のブラウザにファイルをドラッグして、ほら、私はインターネット上のページを持っていた。
さて、それは非常にそうではない、私は私のハードドライブ上のページを持っていた、
と私は文字通り、ブラウザでそのWebページを参照してくださいと、世界で唯一の人だった。
>> だから、今日、私たちは、実際のWebサーバーを導入
との概念は、インターネット上で実際にコンテンツを提供
とどのようにこのすべてが一緒に収まるように開始します。
だからCS50アプライアンスにそのすべてのこの時間が判明
お使いのコンピュータ上のWebサーバを持っていた。
私たちは、公平に見て、だけに、GDBなどのため、Clangのために、geditのためにそれを使用している
だけでなく、Webサーバであるアプライアンスにあなたのために私達によってインストール
そのWebサーバーは、オープンソースのフリーであることを起こる、
アパッチと呼ばれる、世界で最も人気のあるものの一つ、​​。
その多くの技術的な名前がhttpdであり、dは、ここでデーモンのためである
これは、サーバーのための技術的な単語である。
だからCS50アプライアンスにインストールしたWebサーバーであり、それが何を意味するのか？
さて、Webサーバーは、概念的には、ウェブコンテンツを提供し、インターネット上でいくつかのサーバである。
ファイルを要求され​​ると、そのファイルを構成するHTMLを吐き出して、ほら。
あなたには、いくつかのWebサイトのホーム·ページを参照してください。
しかし、サーバーは、より正確には、ソフトウェアの一部です。
それは、物理マシン上にある必要はありません、それはただのソフトウェアランニングの一部でなければなりません。
だからCS50アプライアンスは、もちろん、ソフトウェアの一部です
にもかかわらず、それはマシンのふりのようなものだ。
それは、コンピュータのコンピュータ内部のふりをしている
それはただのアプライアンスは確かにWebサーバのようなものを実行できることを意味します。
これは、実際にメールサーバを実行できます。
我々がしたい場合、我々は、アプライアンス内のインスタントメッセージングサーバーを実行することができます
そして実際に、我々は、データベース·サーバーとして知られているサーバの一つの他のタイプは、MySQLを実行するのですか。
その次の週ではなく、もっと。
これは私が実際にWebページを訪問することができることを意味し
アプライアンスの内部ブラウ​​ザを使用して私のアプライアンスの内側
あるいは私自身のラップトップ上で、私のMacまたは私のPC。
だから、これは何を意味するのですか？それは、いつでもあなたがLinuxコンピュータを実行していることが判明
そのニックネームは "ローカルホスト"です。
我々は、ドメイン名を購入していないので、それはドメイン名を持っていません
アプライアンスのようなもののためなので、そのデフォルト名はローカルホストです。
>> しかし、Webページを提供開始するようにアプライアンスを得るために、
我々は、それらを最初に作成する必要があります。
ですからそういうことをしてみましょう。私はここにターミナルウィンドウに行こう
と私は私の典型的なジョン·ハーバードプロンプトだと気付く。
私が先に行くと、lsコマンドを入力して、我々はこの学期からいくつかの見慣れたものを見てみましょう、
デスクトップ、ダウンロード、Dropboxのなど、
しかし、今、私たちはその夫婦に我々の注意を回し始める。
多くのLinuxのWebサーバ上で公開HTMLと呼ばれるこのフォルダには、そこだ
しかし、我々は今のところその1をスキップして、この、バーチャルホストに集中するつもりだ。
誰もがバーチャルホストとは何かを知っていますか？
仮想ホストに対してだけ愚かな専門用語、
そしてこれが何を意味するが、それは典型的なサーバー上にある
あなたは実際に複数のWebサイトをホストすることができます。
あなたはfoo.comのようなドメイン名を購入したり、サーバー上でホストすることができます。
しかし、あなたはまた、bar.comを購入し、同じサーバー上でホストすることができます。
その理由は、ブラウザがサーバーに通知するのに十分スマートです
ユーザーはいくつかのWebページを要求しているとき、どのようなドメイン名は、ユーザーがホームページを望んでいる。
それでは、これについての良いのは、あなたは、1つの物理サーバーを必要としないさ
作成する可能性があるすべてのウェブサイトのためのまたは1 CS50アプライアンス。
同じサーバーを使用して、百種類のウェブサイトを開発することができます。
そして実際に、あなたがウェブサイトを起動しようとして人なら、
楽しみのために、またはビジネスのためかどうか、一般的には、インターネットに出て行くよ
とあなたは100ドル、月誰か10ドルをお支払いします
あなたのためのあなたのウェブサイトをホストします。
と働き方には、他の人に充電されている
10ドル毎月または数百ドル月
自分たちと同じサーバー上の他の人々のウェブサイトをホストします。
この機能のためbhostsと呼ばれる彼らが行うことができます理由は、
それは最終的なプロジェクトのための時間が来るとき、その上にもっと。
>> 今のところ、ちょうどそこに飛び込むみましょう。 CDのバーチャルホスト、そして、そうだとすれば私は今、lsを入力
ローカルホストと呼び、そこにフォルダがあることに気づく。
それがあるため、デフォルトでは、アプライアンスの数字だ
あなたは今までアプライアンス上の1つのウェブサイトを実行するつもりだ。
これは本当に現実の世界ではなく、実際のWebサーバではありません。
だから私は、ローカルホストに行かせて、そして、今、私たちはそこに表示されます
1最後のディレクトリには、HTMLと呼ばれる。
だから、少し深い階層だが、時と場合
あなたは次のn個の数ヶ月または数年にわたって複数のWebサイトの開発を開始することを決定、
フォルダ構造のこの種は参考にする傾向がある。
今、私はちょうど同じようのHTMLに手放す
lsと入力し、何もありません。
それでは先に進み、これを行うことができます。私はChromeを開いてみましょう
アプライアンスの内側に、と私はhttp://localhostに行くことができます。
だから、文字通り私のアプライアンスの名前は、次のように入力して、私は/のインデックスを取得します。
これは本当に私に興味の何も表示されなくなり、
しかし、それは私たちが見ていると、そのフォルダ、HTMLであることが判明した。
そのフォルダ内の何も、今はありません
ので、代わりに、私は何をする必要がありますするつもりは、最初のファイルを作成されています。
我々は月曜日にやったようにHTMLファイルを作成しますが、今回は、アプライアンスの中に置く。
現在、ノートパソコンと一緒に従うしようとしている人のために、
、私は、Webベースのpsetでカバーされるだろう脇いずれかの操作を実行してみましょう
しかし、これは非常に最初の時間のために働くことを得るために、
sudoのサービスのhttpdの開始：このコマンドを実行する必要があるとしている。
そしてこれは、再び、最後のpsetで繰り返される
しかし、あなたは今、自宅で一緒にプレーしている場合は、Webサーバ
アプライアンスでオフになって、そして、それはそれはRAMを樹液ないようださ
学期のうち7週間とメモリ我々はそれを必要としない。
だから、一度このコマンドを実行する必要があり、そのような出力が得られます。
次に、ここで一緒に演奏することができるはずです。
それでは、このフォルダに戻りましょう。
このフォルダは空なので、私はファイルの作成を開始しましょう
geditのhello.html。
>> かしこまりました。 Geditはいつものように、開いています。私は、doctypeやhtmlを、やってみましょう
HTML、私は先に自分の取得し、事前に私の終了タグを始めましょう。
今、私は頭が付いています。 、私が先に行くと、頭を閉じてみましょう
私は今ではページのタイトルをやらせる、こんにちは前回のような世界では、
近いタイトルは、今の私は、体を行うことができます。
ここでは、私はいくつかのexclamsと、Hello Worldを言うよ
それは別の文字列であることを明確にします。
閉じるボディ、そして今私が先に行くし、ファイルを保存しましょう​​。
私は私の端末ウィンドウに戻りましょう、と私はlsを入力した場合、
私は、おそらく、hello.htmlが表示されるはずです。と私はありません。
だから今度は戻って私のブラウザに行かせ、リロード]をクリックし、
そしてあなたは私たちが実際に内部でこのHTMLフォルダのあることがわかります。
私はまだ、Webページを見ていないが、これはApacheのWebサーバであり、
ただ私は、このディレクトリのリスト内容を示す。
ちょうどMac OSやWindowsのように、通常、独自のローカルのハードディスクドライブに行うだろう。
私はこのWebページを見たいのであれば、私はここで、この小さなリンク、hello.htmlをクリックすることもできます
そして実際に、それは私が見たいと期待していたものだ。
さて、再び、これは、あなたがたのうち、現在訪れることができるURLではありません
なぜならあなたのために、ローカルホストは、ここでラップトップを持っている場合は、
それは、アプライアンスの独自のインスタンスを参照しています。
これは、私自身の個人的なアプライアンスである
しかし、これは持っている、私が持つにはダムの一種である
私のようなユーザーは、実際には、このページの内容を表示するにはhello.htmlをクリックしてください。
これは、ApacheなどのWebサーバーを使用すると、任意のWebサーバーのデフォルトのファイルを持たせていることが判明した。
我々はhello.htmlを持ってここに注目してください。
ファイルの名前を変更するには、Linuxのコマンドは何ですか？
>> MV、移動のため。だから、私はそれをやらせる
と私はindex.htmlにhello.htmlの名前を変更してみましょう。
私はそれが今では名前が変更されているのを確認するには、lsを入力してみましょう。
さて、これはに起こっている - 私はローカルホストに戻ってしまったら、
私は自動的にそのWebページを見ていることを今気付く。
これは、私の実際にやって/ index.htmlのと同じです
しかし良い点は、今、Webサーバーが考え出すているということです
ああ、あなたはindex.htmlと呼ばれ、人間の慣習によって、ファイルがある場合、
私は、デフォルトではユーザーにそのファイルをお見せしましょう
むしろユーザーフレンドリーなすべてではないいくつかの愚かなディレクトリのリストより。
確かに、あなたがインターネット上でアクセスほとんどのウェブサイトは、をクリックしてファイルのリストを持っていない
彼らはただあなたに内容を示します。だから我々はindex.htmlに、それを行うことができる方法です。
だから、これは、すべての楽しさと良いですが、これは非常に単純なWebページです。
私が先に行くと私のバーチャルホストでindex.htmlを開いてみましょう、
ローカルホスト、htmlディレクトリと、レッツは大きい興味のあるものを追加します。
だからこんにちは世界はあり、これは、ハーバード大学のCS50である "と言う代わりにしてみましょう。 。 。 '
だから、そこにある種のコースのカタログの説明の始まり。
私はリロードすれば、今、私は私のホームページで確認する必要があります。
さて、私はそれを参照してください、しかし、私は今、このファイルにいくつかのより多くのコンテンツを一覧表示したいと仮定しないでください。
私は、ここに行かないと言う、前提条件なしでした
あなたのいくつかは、おそらく似ているものの、 "ハッハッハ、前提条件なし。 '
しかし - 公式。だからリロード、そして今我々は、我々は最後の時間を見ているのと同じ癖を持っています。
しかし、なぜそれは何ですか？それは、簡単な修正であった。
なぜ、このページが壊れている？
[学生、不明朗] >>うん、我々は前にこれを解決しました
明示的に伝えることで、ブラウザは "ここに改行を入れた。"
そして、それは再び、ブラウザだけでやろうとしているのは、ため
明示的にどのようなマークアップ言語が行うように指示し、
一度か二度、あるいは10回入力を直撃しているかもしれないので、あっても、
それだけでは慣例により、1つの空白に、そのすべてを結合するために起こっている。
あなたが本当に改行するのであれば、あなたは、BRタグを使用する必要があります
そして今、月曜日のように、私は、このタグの/内側を入れ、気付く
これはちょうどいい感じがしないという理由だけで
改行を開始すると、その後、間に何もないとそれを止める。
>> だから、HTMLの慣例では同時にタグを開いたり閉じたりすることである。
余談ですが、あなたはそれをやっていない書籍に多くのウェブサイトが表示されます。
それが行うのか、それをしないように正しいですが、私たちは主張するだろう
その設計単位と文体、これはちょうど良いです
その後、すべてのタグは両方何とか開閉されるためです。
だから今の保存してリロードしましょう​​。大丈夫、ブラウザに戻ります。
今我々はいくつかの進歩しているが、それは非常に十分ではありません。
先に進み、テキストの一部が長く体内に入力を開始しましょう​​。
それでは言わせて、 "The quick brown foxは、のろまなイヌにジャンプします。 '
そして今、私はちょうどこの数回のコピーと貼り付けましょう
私たちはテキストの段落を持っていること。
私がこっちに戻ってみましょう。だから、それは非常に格好良いわけではありません。
私は、改行を持っているので、それは大丈夫です
しかし今では、かつて我々は、Webページを持っていることのポイントになっている
それは多数のコンテンツではなく、HTMLを実証するだけで一本の線があり、
我々は実際の段落としてこれらの事を考え始めることができます。
そして、我々はもう少しきれいに弊社のWebページを構築するために始めることができます。
そして実際に、私は何をすることができますことは、私のbodyタグの内部にここに上がっている、
そしてこれはCS50である "場合はどうでしょう、知っている。 。 。 '実際には、段落の先頭をdemarks
まあ、それのようなタグを付けてみましょう。
単に慣例により、私に言わせて、私はテキストをインデントしましょう
この段落はここで終了していること、
その後ではなく、この改行は、私だけ言わせてください
これは、そこに、新しい段落として所属している
と私はちょうど素早くちょうどこのようなもののすべてを追い払ってくれることでインデントします。
>> だから今我々は、そこにインデントされた段落を持っている
そして今、私たちのマークアップはもう少しを得るために始めている
我々がやろうとしているとの意味的に一致している。
我々は、そのためのpタグ付き段落呼び出すの段落を聞かせています。
我々は、第二​​段落を持っているので、pタグ付き段落と呼びましょう。
そして今、ブラウザは一般的に何をするか
ちょうど英語の本やエッセイのようにされ、
場所は、通常の段落の間にいくつかの改行を参照してください。
ブラウザは自動的にあなたのために、その処理を行います。
だから今我々は2つ​​の段落を持っていると我々はこれを継続することができます。
しかし、もちろん、あなたがテキストのボディを持っている、Web上
それは通常はテキストのちょうど巨大な塊ではありません。
そこにハイパーリンクされることがしばしばあります。
我々のような場合には、そのため、たとえば、そこにいくつかのリンクが含まれて
私はここで作成しているWebページが何であれで興味があるかもしれないものとします -
、私はGoogle.comに行こう
と私の速い茶色のキツネを​​検索しましょう​​。
Googleの画像に移動して、、方法について - これはかわいいです。
我々はこれで行くよ。そこでここでは、怠惰な犬の速い茶色のキツネは、ジャンプを持っている。
だから、僕はデモのために、ここでやろうとしているもの、
、この画像は自分のサーバー上にあったと仮定している
と私は、これらの画像を作成していた。
私はちょうど右クリックするか、画像をクリックしてコントロールしていたなかったもの
と何がほとんどのブラウザで表示されますと、小さなメニューです -
それをやって停止する - あなたはリンクのURLをコピーまたはコピーされたURLを選択することができます小さなメニュー。
だから私は私のHTMLにすぐに戻って行き、私が欲しいと仮定してみましょう
ハイパーリンクには、この別のWebページへ。
>> そのために呼ばれるタグは何でしたか？
[学生、不明朗] >>うん。ハイパーリファレンスのhrefそう。
私が先に行くと、そのインチ貼り付けてみましょう
それはかなり長いURLですので、私は戻ってズームアウトしてみましょう。
閉じる括弧は、今、私はこっちの方法だ気付く
そのURLがかなり長いことが起こったので。
、私はここの速い茶色のキツネの最後までスクロールしてみましょう
その後、私は</でこのタグを閉じさせる
私はタグの名前をどこで引けた。
さて、私が先に行くと、そのファイルを保存し、Webページをリロードせ
そして今では、デフォルトで、それは私のために青色で下線付きになるだろう、
しかし確かに、私は今、これをクリックすると出来上がりができます。そのイメージがある。
そして、それはイメージである必要はありませんでした、それはリンクされている可能性が
インターネット上の他のいくつかのランダムなウェブサイトへ。
私はここ1最後の例ので、CS50と、例えば、これを行うことができます。
'これはCS50 "は、href =、行くことに意味があります
http://www.cs50.net、閉じ引用符、近くにアンカー。
だから今でも短いURL、およびこの時間だと私たちはイメージにリンクするつもりはない。
我々はその代わりに別のページにリンクしようとしている。
今、私たちはここにイメージを持っている。
我々だけで画像にリンクしてより少し良く行うことができるような気がします。
私たちは実際に私たち自身のWebページでそれを具現化したい場合はどうなりますか？
>> さて、私はここで出来ることはなく、このグラフィックへのリンクではなく、ですが、
私が代わりにURLをカットし、我々はそのハイパーリンクを取り除くとこれをクリーンアップしますしましょう​​。
そして、我々はここに行くとこれを取り除くでしょう。
我々は今、すべてのこれらの文章を本当に必要としないので、私はページを少し短くしてみましょう。
そして、ダウンここで、私は、新しい段落で先に行かせて
私は今、文章を望んでいないというが、それでも私は、ソースがそのURLであることを行っている画像が欲しい。
改行のようなイメージは、そこにあるか、またはそうではありません。
だから私はすぐにそのタグを閉じてみましょう。
私は今、先に行くと、私の中だと段落を閉じてみましょう、
そして私は今、リロードする場合、すべてのこんにちは、世界とは、うまくいけば、
私は、確かに、私自身のWebページ内の画像を右にしてください。
だから今我々は、イメージタグ、アンカータグなどを持っている
そしてついでに、私はしばしば無視だ1つの他のことをやらせる
ウェブサイト上でこれらの日：このイメージの説明文を提供してみましょう
モバイルデバイス上にある人々のための
そのため、非常に迅速にこのイメージをダウンロードすることができない場合があり
盲目であり、画像を見ることができないかもしれない人々のために
しかし、彼らはこのイメージがあるか、それらを伝えることができるスクリーンリーダーを持っているかもしれません。
そしてそれを行うためには、画像タグに別の属性がある
代替テキストには、altと呼ばれる。
と私はここで出来ることは、言っている "これは速い茶色のキツネです。 '
だから、人間が画面上に画像を見ることができない場合でも、その、
彼または彼女は、少なくとも、ソフトウェアのいくつかの作品と同様に、聞くことができます
実際に画面上で、そこに何があるか。
>> つまり、ページの美学を変更することはありません
それは確かにユーザーにとっては良い習慣です。
すべての権利は​​、のは、現在の形でこのWebページを残しましょう
しかし、我々は今、導入しないことができるかどうか見てみましょう
これらのWebページを記述するためのいくつかのより良いアプローチは、
私達のページがますます複雑になるとしても私たちに奉仕しようとしているいくつかの教訓。
我々は今後数週間にわたって行うつもりはない
があることを数十HTMLタグのすべてを追っている。
ずっと0週に戻って傷のように、それはおそらく十分でしょう
概念のいくつかの高レベルの概要を与えるために、
あなたはおそらくできたブロックのいくつかのクイックツアー
かなり快適に、自分で様々なパズルのピースを移動します。
そして、それは、HTML、最も可能性が高い、で再び起こるだろう
十分なリソースは、私たちがあなたを指すだろうと、Web上であり、それによって
様々な教科書は、教科書を読むことを好む場合には、
それは、HTMLを使用して実行できる様々な物事のすべてを見ていきます、
しかし実際には、我々はHTMLで、これまでの基本的な概念のほとんどを見てきました。
私たちは、開かれているタグの概念があり、タグが閉じられている。
両方開閉されるいくつかのタグ
彼らは空になっているという意味で、それらの内部に何があってはならない
イメージタグまたは単にある改行、のような。
我々はまた、altやソースのように、属性の概念で既に見ました。
これらの言葉は短く、簡潔であることが、慣例により、傾向があることに注意してください。
>> 我々は、これらのものは何と呼ばれる上の裁量権を持っていない
HTMLを考案し、他の誰かは、これらの名前を思い付いた。
だから、あなただけの、あなたがそれらを必要とする任意の時間を知っているか、ルックアップするために開始する必要があります
どのような名前は、これらのタグと属性のためのものです。
これらの属性の場合、一般属性
いくつかのタグの動作を変更します。
この場合、ソース属性は、画像タグに指示
画像のソースはどうあるべきか。
href属性は、それが実際にリンクすべきかをアンカータグに指示します。
しかし、Webページの構造の面で、Facebookにもかかわらず、
Googleおよび完全な混乱のようにのように見える
あなたがそれを読んで始めた場合、一見するとボンネット、下
もっと念入りに、それらはすべて、この基本的な、基本的な構造になっています。
しかし、我々はこれらの事の様式を改善することができます。
だから私は、私が事前に用意したいくつかの例に行こう。
私が先に行くと、ここで別のフォルダからコピーしてみましょう
して、このディレクトリに入れます。
事前に、私がやったことは、いくつかのファイルを準備しました：
sea​​rch0、がsearch1、search2、そしてsearch3と4。
私が先に行くと、それらのファイルの最初を開いてみましょう、
そして我々は独自の検索エンジンを作成し始めることはできませんかどうかを確認してみましょう。
このファイルの先頭に、コメントとしてのちょうど束、クラスで通常のケースです。
HTMLは、しかし、あなたがコメントを開始するための手段で
！<です - そして、あなたの中にコメント、複数行コメントのだ。
あなたがそのコメントを停止する準備ができたら、あなたが行うことができます - >を。
だから青の一番上にあるすべてのものはただのコメントです。
>> これは、これもまた、私のDOCTYPE宣言である
あなただけの、今のところ、信仰にコピーして貼り付けることができます。
これは単なるブラウザに指示 'ここではいくつかのHTML 5が来ています。'
下記の14行目に、私の実際のタグの最初のものである、という
、ここでいくつかのHTMLが、来る前と同じように、これはちょうど、言う
ここに私のページの頭には、ここにタイトルが来る、来る
その後、逆に、タイトルのそれだ、それは頭のためのそれだ。
今ここに私のページの本体を付属しています。
今やカップルの新しいタグはだから：h1は見出し1の略です。
長年にわたり、HTML内の伝統が戻ってあります
テキストのサイズが異なるの。
と戻って一日で、それぞれが大きいだけで、大胆な、一般的に意味した。
しかし、大きなではなく、かなりのように大きくて大胆だh2は、もあります。
ビッグではなく、ほぼ同じ大きさと大胆の一種であるH3は、あります
など、H6に至るまで。
これらの日は、しかし、H1、H2及びH3は本当に意図してい
彼らにもっと意味を持つため、
それによってh1は本当に向かっている：Webページの見出し、
テキストのような列か何かの見出し。
だから私は意図的にH1 CS50検索> h1を言ってきました
これは、本当に私のページのタイトルの見出しであることを指定するために。
タイトルバーの意味ではないタイトル、
しかし、あなたが実際に体内で、Webページ自体に表示されるタイトルです。
さて、これは、おそらく、それが何であるかを推測することができます
私たちは、構文のいくつかの新しいピースを持っているにもかかわらず。
これは、フォームです。だからウェブは本当に面白い
ウェブサイトは、ユーザーからの入力を取るとき。
このクラスでは、Webプログラミング上の問題セットで、
我々はウェブサイトを作るつもりはない、それ自体が、
あなたが撮影した写真を示す静的コンテンツと、
あるいはこれは、私の履歴書、そして私についてのことです
それらのものは一緒に置くことは比較的容易であるためです。
これは、Web上で物事を美しくするのは難しい
しかし、少なくともコンテンツを置くことは非常に簡単です。
誰かがあなたのウェブサイトを訪問することができたときにしかし、物事は本当に面白くなる
と、入力を提供し、フォームに必要事項を記入することができます
チェックボックスをオフにチェックすることができますし、あなたのウェブサイトと対話することができます。
あなたが気にして実際には、おそらくすべてのウェブサイト
これらの日、どんな詳細に、何らかの形で対話型です。
ユーザー入力を受け取るには、フェイスブック、グーグル、などが挙げられ、
およびカスタマイズされた出力を生成します。
>> だから今はそんなことを始めてみましょう。今レッツトランジション
単に静的コンテンツのマークアップのためにHTMLを使用してから
としてではなく、動的なコンテンツの配信メカニズム。
そしてその終わりに向かって、私たち自身の検索エンジンを実装してみましょう。
Let 'sは、次のようにそれをする。ここではフォームタグです。
action属性は、指定するユーザーは、このフォームに記入する際に
彼らのキーボードで、それはここに、このURLに提出される予定である。
だから私は浮気のようなものだ。それはやや長い私たちを取るために起こっている
全体の検索エンジンを実装する複数のクラス、
そう私達はちょうど、いわばフロントエンドをやる。
我々は、ユーザーを検索することができます部分をやる、と我々はGoogleにパントの並べ替えがあります
検索結果を見つけることの難しい部分、
しかし、具体的には、Googleのウェブサーバーに話をするつもりです
2非常に人気のある方法のいずれかを使用して。
一つは、我々は最終的にポストされ、表示されますことを、別の、取得された
あまり頻繁に使用されている他のものはありますが。
だから私は、いくつかのコンテンツを取得したい、ただのアイデアを想起させる得る、いくつかの検索結果を得ることができます。
これは、あなたはおそらくこれが何をするかを推測することができます。
これは、入力のいくつかの種類である、それは、実際には、テキストフ​​ィールドのように見えるようになるだろう、
その入力の名前は、その変数の名前は、いわば、
慣例により、クエリのqになるだろう。
そして再び、この入力の型はチェックボックスであることを行っていない;
それがメニューであることを行っていない、それはテキストフ​​ィールドになるだろう
ここでは、この属性、このテキストボックスで示すように、
改行のように、そこにないかのどちらかです。
だから我々は、そのタグの内側にスラッシュが付いた空の要素を持っています。
それから私は、改行を置くつもりですが、あなたは、おそらく、これは何をするつもりなのか推測することができます。
これは、フォーム入力の別の一種である。
>> この1つは、フォームを送信するために使用されるだろう。
だから、これは、ユーザーがフォームを送信するためにクリックできる大きなボタンであることを行っている
そのボタンのラベルはあることを行っている 'CS50検索。'
閉じるフォーム、近いボディ、近くのHTML。
我々はこのWebページの形で持っているのか見てみましょう。
だから、私は私のブラウザに行こう
ローカルホストには、まだ、私は行くことができます。
これは、私がsearch0と呼ばれるこのファイルを見たいと思っていますので、もしまだindex.htmlです
私は単純に入力して、/ search0.htmlを行うことができます -
そして私のミスの第一。
どうなってるの？私ははっきりと権限を持っていません
このファイルにアクセスするには、いくつかの理由がある。
仕事とは違って、我々はこれまでやったので、しかし、それは、C言語での
あなたが書くプログラムはあなたによってにおける、実行可能であると想定される場合、
あなたによって実行可能な、実際にWeb上の場合ではない、
それによって、時にはあなたは、サーバー上のファイルを作成することもできます
しかし、あなたは全世界がそれらを見ることができないようにする。
むしろ、あなたは世界がいくつかのファイルを見てみたい
他のものではなく、単にプライバシーのために。
だから、あなたがWeb上で物事をやっているときにオプトイン基盤のより多くのです。
それで、私は実際にここにlsを入力しましょう
そしてあなたは、私が持っているファイルを参照してくださいが、私は長い間、ls-lを実行した場合ことを思い出して、
私は私にこれらのファイルのいくつかのより多くの詳細を与える長いリストを取得します
それは私たちに関連する初めて、本当になりました。
右端に私のファイルの名前があ​​ることに注意してください、
その後、彼らが最後に変更され、またはコピーされた時刻。
ここではこの番号は何ですか？あなたは思い出すでしょうか？
バイト単位のサイズは、ファイルの大きさはどのくらいか。
>> だから私は他のすべてのファイルよりも大きいですここでロゴのいくつかの種類を持っているように思われる。
これは私が誰である、これは私が何か、私の出番だどのグループ
しかし、その後、こっちに左に不可解なシーケンスのビットですが、
そして我々は、過去にこのことについて簡潔に、私が思うに、話しました
しかし、これは権限に関係しています。
そして、それは少しかすんであっても、
RWは、おそらく読ん＆書くことを意味します。
だから、これらのダッシュが異なる人々のための異なる権限セットを示すことが判明した。
次のように、パターンは、本質的に、です。
ここでダッシュの系列を見るとき、彼らは次のように見える。
ダッシュがあり、その後、それ以上の3つのダッシュあり
その後、別の3つがあり、その後、別の3つがあります。
最初のものは、いずれかのディレクトリのダッシュまたはそれの広告です。
だから、その人は非常に簡単です。それがフォルダなら、それはdと言い、それ以外の場合はハイフンです。
そこにカップル他の例ですが、今の我々だけで、ファイルやディレクトリを気にします。
これらの次の3つのダッシュ - と私は人工的にスペースを挿入した。
我々は少し前にそれらを見たとき、彼らはそこに、明らかではありませんでした。
これらは、ファイル所有者の権限です
そして第二前にそれが読ま＆書き込みされたことを思い出して。
それは、少し前にこのファイルを作成した人として、私だったので、
私は、単にデフォルトでは、Linuxコンピュータ上で、
そのファイルの読み取りと書き込みを継続する能力を持っています。
>> だから、オペレーティングシステムがちょうどRWを自動的に私を与える。
真ん中のものは、学生のことを、私のグループに関連
私は、アプライアンスを使用している唯一の人だからこれは、アプライアンス上の無意味のようなものです。
だから私はちょうど今のその時点で私の手を振ってみましょう。
しかし、最後のものは、Web用に最も重要です。
これは世界の皆であり、実際
---のことを意味していることが、世界で他に誰もいません
このファイルへのすべてのアクセス許可を持っています。
明らかに問題なので、私はこの問題を解決する必要があります
何とか世界に何を与えることによって？読む＆書くのか？
それは右、おそらくダムですか？私は、Web上で誰を望んでいない
私のページを訪問に行くと、どういうわけか、そのファイルを変更するには、
にもかかわらず、彼らは本当に、HTMLファイルではできませんでした
しかし、ただ原理的には、おそらく彼らはそれを読むことができるようにしたい。
何がそれを読むことを意味するのでしょうか？それは、彼らは、実際のHTMLを気にするつもりだという意味ではありません
しかし、ブラウザは、そのマークアップ言語を解析できるようにする必要があります
上から下へ、左から右へ。
だからWeb上の誰かがそれを読むことができるようにする必要があるので、私はそれを最小限にrを与える必要があります。
私は、おそらく、いくつかの異なる方法でこれを行うことができますが、
最も簡単なのは、ここに、このコマンドを実行することです。
その後chmodコマンド、変更モード、+ Rの世界では非常にすべての、誰も読み込み+、
ファイルの、名前、search0.html。
>> そのファイルが変更されたことを今、私は再び、ls-lを実行した場合、通知、
そして実際に、私は皆のためrになってきました。
、私も自分のグループのためにそれをオンにしましたが、それは大丈夫です
私は皆のために中にオンにした場合、私のグループはそれのサブセットであるため。
だから、それはあまりにも大丈夫です。これはちょうどコンピュータが、今では読みやすくしていることを意味します。
今私は戻って私のブラウザに行かせて、リロードをクリックします。
ああヘクタール。現在CS50検索を持っている。
かなり恐ろしい検索エンジン - 私は少し人工的に拡大しました。
しかし、それは実際に動作するかどうかを見てみましょう。
まず、私がクリックして、ページのソースを表示を制御できるように、私は迅速な健全性チェックを行うことができます。
クローム以内に私達が今​​、私自身が作成したものと同じHTMLを見ていることに注意してください。
しかし、ここで混乱しないでください。私は、ここにコードを変更し起動することはできません
ブラウザは、このコードの読み取り専用ビューを持っているので。
ブラウザだけでsearch0.htmlというファイルをローカルホストに依頼しました。
それが今では純粋な偶然の一致では、そのアプライアンス
私のブラウザと同じコンピュータ上にあることを起こる。
私はちょうど、等価的に、www.facebook.com/search0.htmlに入力したかもしれない
Facebookはという名前のファイルを持っていたならば、私はその後、そのHTMLをご覧になることでしょう。
そして、もちろん、私はどちらか、Facebookから戻ってきたファイルを変更することはできません。
だから今我々はラインをぼかすの一種だ。
アプライアンスは、Webページを提供し、両方のサーバで
それは私がブラウザを使用しているという意味では、クライアントの
実際にそのサーバーに話をする。
だから、私は、Googleの検索エンジンが動作するかどうか見てみましょう。
私が先に行くと速い茶色のキツネの検索は、次のように入力してみましょう。
と出来上がり、私は今私の独自の検索エンジンを持っています。
>> しかし、これはどのように動作しますか？
ストレッチのビットが、 - 今、あなたは、正確には、関心の一つだ部分を見ることができません。
何が起こるかに注目してください。
URLを確認。それは、そのメソッドが判明
取得と呼ばれる、超簡単です。
あなたはいくつかのサーバーから結果を "取得"したいという形で指定すると、
何それが何をするつもりなのは、フォームに入力されたものは何でも取ることです
とURLに入れて。
それは次のようにURLに入れれる方法を標準化するだろう。
これは私のaction属性の値であったURLであることに注意してください。
私はフォームが終わるしたいところです。
しかし、その後、この疑問符に気づく。
これは、それによって、ユーザーの入力を提供するために、Web上の慣習です
ウェブサイトには、URLに疑問符に追加、
そしてその後は、キーと値のペアの全体の束を持っています。
そうでなければ、Webでパラメータとして知られているキーの名前、
その後、等号を持って、あなたは、そのパラメータの値を持っています。
だから、本質的には変数名と変数の値です
しかし、それらの変数の名前と値は、HTMLフォームから来ました。
なぜプラスがあると、あなたは思いますか？
私は私の言葉の間に+を入力しなかったため。
[学生、不明朗]
>>うん、それだけで間隔のためだ。オッズでは、URLを見てきたときはいつでも、アール、
なぜなら場合にのみ、その中の任意のスペースは、決してありません
があったとしたら、あなたは本当にそれをコピーして貼り付けることができませんでした
IMにまたは電子メールにそれが壊れるからです。
あなたが全部の文字の1連続した文字列になりたい。
>> だからブラウザはウウン、実現するのに十分スマートです。
ちょうどそこにスペースを入れないでください。私はいくつかの標準的な方法でスペースをエンコードしてみましょう。
そうするための規則の一つは、ブラウザを持つことである
自動的にあなたがそうでなければスペースを持っているでしょう+を置く。
だから今は、予告Googleはユーザーフレンドリーの一種となっています。
私は確かに、このWebページを作成しなかった
しかし、彼らは自分のテキストフ​​ィールドを事前に入力した
正確には、私が入って入力した内容と
私は怠惰な犬のように、何か他のものを検索するとします。
私はちょうど再検索、ここにこれを入力することができます。
URLはここまで変化することに注意してください、
しかし、私は実際に私が欲しいものを検索することができ、次に気付く
どれだけのURLの仕事を理解すること。
私は、次のように入力し、怠惰な猫を行うことができます
と今気づく私は非常に手抜きをしているんだ - すべき私たちは？私は私達があるべきであるように感じる。
私は非常に怠惰な猫を取得します。
かしこまりました。これは、我々がやった愚かなものの一つです。
しかし、それは怠惰な猫です。
とにかく、ここで重要なテイクアウトは何ですか？
今、私たちは、HTTPの世界で遊んでいる一種のだ。
HTMLは、ちょうどこのマークアップ言語で、開始タグ、終了タグ、です
それは、Webページ上のコンテンツをレンダリングする方法をブラウザに指示します。
しかし、あなたは、インターネットを介してデータ送信を開始するとき
どこでこのプロトコル、Webブラウザとサーバーとの間で、それはだ
ハイパーテキスト転送プロトコルが引き継ぐとしても知られています。
これは人間の慣習のようなものです。サムと私は月曜日に握手をしたときに、
接続を開始してから、ここの接続は、同じアイデアを閉じる。
どのようにGoogleの結果は私に戻って来ている？
私のフォームの送信は、Googleにどのように起こっている？
さて、何が実際に起こっていることを他の日からリコール
Webページが要求ボンネットの下に、
お使いのブラウザはやや似、不可解なメッセージを送っている
デフォルト·ホーム·ページには、/ HTTP/1.1を​​GET。
>> または、この場合には、私は具体的に要求したので、それ以前の
sea​​rch0.html、これはその後幾分-不可解なメッセージでしょう
私のブラウザでは、アプライアンスに送信する。
または、Googleのこのケースでは、どのような実際に送信される
次に/検索への要求である、と？Q =怠惰な猫は、そこにプラスして。
したがって、このメッセージは、私は、人間は、入力したことがないているということ、
しかし、私のブラウザから送信されており、これはHTTPが起こるかということです。
これは、我々の振とうした手のと同等です。
これはリクエストであって、サーバは応答を送信しようとしてだ。
それでは、ボンネットの下にこれを見てみましょう。
前に述べたように、ブラウザでこの特別なフィールドを開くことができます。
、ページを表示する要素を検査します。
要素を検査しそうで、Chromeで何が起こっていることがわかり
とIEとFirefoxは、同様のメカニズムを持っている
私たちは私たちにアクセス可能なこれらの開発ツ​​ールを持っています。
普通の人々は、これらのタブを使用しないでください。
しかし、我々は、今、何が起こっているのかに興味を持っている
ネットワークレベルでのフードの下に。
私はここで、ネットワーク·レベルを引き上げるのであれば、
、私が先に行くと、このウィンドウを展開してみましょう
ここにこのエントリを開くと、ヘッダーを見てみましょう。
私は、Webサーバーからファイルを要求したときにどうなるでしょう
私のブラウザは、物事の全体の束を送ることです。
そして、私は、ソースを表示してみましょう。だから、要求ヘッダーの下で、
そしてこれは、私にいくつかの診断出力を示すだけクローム
何らかのデバッガのような一種の、
私がここで強調したことは正確に何であることに注目してください
Chromeはsearch0.htmlという名前のファイルを要求するためにサーバーに送信されます。
それがどう思うか、その名前が、あるサーバーを語っている
このホストコロンフィールドのおかげで、その後いくつかあり
ここではかなり難解なもの、日付と時間とは何かのように、
ブラウザが理解できる言語とは何か、
しかし本当に重要な行は、ここで、これらの最初の2つです。
>> サーバーは何をして応答しますか？さて、私たちはここで下にスクロールした場合
そしてこの事のソースを表示し、そのサーバーに気付く
同様にやや不可解なメッセージで応答しました、304は修正されません。
それはちょっと奇妙だ、わたしが実際にこれを修正してみましょう。
私は、Shiftキーを押してここを上ってリロードをクリックしてみましょう
実際に初めてこの要求を行うためにブラウザを強制します。
その後、私がズームインさせ、我々は、そのサーバーの応答今わかり、
私はシフトを開催しましたので、200はOKです。
だから、あなたはおそらく200番を見たことがない
Webのコンテキストが、どのような数字で
あなたは時々サーバーから予期せず見ている？
404ファイルが見つかりません; 403、禁断、500、サーバーエラー。
だから世界はWebで使用されるこれらの数字のコードがあります
ちょうどC言語の関数のようなエラーを示すために
エラーを戻すことができますし、メインは、終了コードを返すことができます。
それはすべてが順調であることを意味しますので、200が、しかし、あなたはめったに見ません。
それが何を意味されているため、および304は、おそらく見ることはない？
つまり、何も持って - 私たちは再びこれをシミュレートすることができるかどうかを確認してみましょう -
ああ、今は協力していないのです。 304は、変更されていないと述べた
なぜサーバーがあっても応答していた？
まあ、効率のために、Webサーバが自動的にあなたのために、
ファイルが変更されていない場合、それは全体のHTMLファイルを再送しません。
それはちょうどそれが変更されていないブラウザを教えてあげましょう。
ちょうどあなたがすでに持っているコピーを使用します。
だからキャッシングのこの概念は、Web上にあり
パフォーマンスのためなので、時間と帯域幅を無駄に浪費しないこと
不必要に何度も何度もファイルをダウンロードする。
>> しかし今、このWebページには、、、超簡単だった
そして、それは私だけに戻ってきたHTMLを示した。
実際に速い茶色のキツネのようなGoogleの検索を行うようになりましネットワーク]タブを使用してみましょう。
、CS50、[検索]をクリックして私にしてみましょう
そして今、ものの全体の束が戻ってきたここで底に気付く
私はGoogle.comのように本物のウェブサイトを訪問したときにため、
彼らはイメージを持って、彼らはテキストを持って、彼らはそこのJavaScriptと呼ばれる言語を持っています。
ここに、このテーブルのため、各行
Googleは私のただ一つの要求に応答して吐き出すことが何かを表しています。
私は気に1は、しかし、この最初のものです。
私が検索している場合と、要求は、ここでソースを表示]をクリックします
、確かに、私のブラウザは不可解なメッセージを送っていることに気付く
Googleにここにこれら二つのラインであった、
我々は今のところ無視していますここにいくつかの不可解な情報が続く。
しかし、通知は、あまりにも、何のChromeは、とかなり便利です
それはまた私にインチ送られたクエリ文字列を見せている
そうではなく、これは、文字通り送られてきた、私を見る
私はそれは、単にデバッグ目的で、Chromeをデコードして表示する場合
私たちのような開発者のために、それはちょうど私の人間に優しいバージョンを見せている -
それは明らかに、あなたはキツネを綴る方法ではありません。
私はちょうど今、このことを気づいている - しかし、それは、私は、明らかに、入力した内容を見せている。
一方、サーバから帰ってきた応答が再び200 OKです。
しかし、もちろん、その応答に含まれて
私たちは実際にページのHTMLを表示した場合 -
申し訳ありませんが、これは今日ゆがん少しキーボードショートカットです。
>> 私はこの後に対処します。私たちは実際にページのソースを表示するのであれば、
私は応答をクリックして、ここでダウンを行うことができ、
これは実際にはサーバからその謎めいた200 OKメッセージに加えて、戻って吐き出すされたものです。
ちょっと不可解ですが、どこにこのすべてはから来ている？
さて、ここでもう一つの事をしてみましょう。別の幾分-不可解なコマンド、
それはフードの下で起こっているのかを正確に私たちに明らかにするという点できちんとしたのが、この親切な。
だから私はここに私のMacに戻ってきた、私が接続している
別のサーバへのSSH、セキュア·シェルと呼ばれるプログラムを介して
ハーバード大学のコンピュータのほとんどは、我々が実行されようとしているコマンドをブロックするので、
トレースルートと呼ばれるいくつかのサーバ上では、このコマンドはそこだから
それはあなたが、点aとbの間のルートをトレースすることができます
そして、これまで私たちは当たり前の完全に取ってきた
私は、Google.comと入力して、何らかの形で戻ってきたデータを得ることができる
中途半端に全国または途中で、世界中から。
tracerouteを使用すると、我々は実際に少し深くに潜ることができる
インターネットがどのように動作するかのように、そしてフードの下で何が起こっているかを参照してください。
それでは、先に行くと、勝手にへのルートをトレースする、言う、Stanford.eduう
これは、全国で、エンターキーを押します。
このコマンドでは、超高速または超遅くなることがあります
しかし、我々は、現在行ずつ何を見ている
、私たちとパロアルト、またはスタンフォード間のステップまたはホップの一人一人である
彼らは彼らのウェブサーバーを使用している場所。
だから、これらの各行は、しかし、より具体的に何を表すのでしょうか？
インターネットから専門用語を追加しましたか？ [学生、不明朗]
>>あれは、何ですか。 [学生、不明朗]
>>ああ、そうそこに時間はありますが、それぞれの行をするのでしょう - 私はホップとはどういう意味ですか？
>> まあ、ルータと呼ばれるインターネット上でこれらの事がある。
とルーター、その名が示すように、点からの経路情報がbを指すようにします。
しかし、AとBを超えた点がいくつかあります。
1行目の間にcとdとeとfがあります
それは私のコンピュータのIPアドレスであることを起こる、
一意的に自分のコンピュータを識別するか、私の数値アドレス、
実際に第六のWebサーバーであり、ステップ15、
明らかに、これは私は、このことから推測して、またはスタンフォード大学の自分のWebサーバーのバージョン6よ。
しかし、きちんとしたの一種であるが、何を、私たちはパスを見ることができます
私の0と1は、スタンフォードに私のコンピュータから取っていること。
だからステップ1は自分のコンピュータのアドレスを指定します。
インターネット上のすべてのコンピュータは、このように見えるユニークな識別子を持っています。
Number.number.number.number。
どこかにこのキャンパスでは、おそらく科学センターで、
コアゲートウェイ2-te83と呼ばれるルータですが、どんなことを意味し、
ので、これは彼らの多くのトラフィックをルーティングし、ハーバード大学の大きな空想ルータの一つです。
ここにハーバード大学のルータの、他人の、この1つは、ボーダーゲートウェイです
国境の意味は、それがどこかにキャンパスの周囲にはおそらくです。
その後、ノーザンクロスロードされるNOx 1、4行目は、そこ
大きなISP、インターネットサービスプロバイダーは、これです
ハーバード大学のような場所には、最大接続すること。
しかし、その後、物事が6行目で少し面白くなる。
私のビットは、すべての突然のどこにありますか？カンザス州。
世界は、これらの多くのものに空港コードを使用しての習慣を持っている
州や都市のためのまたは少なくとも略語、
ので、それは、わずか60ミリ秒で、ように見えます
情報のパケットは、0と1の私のラップトップから
60ミリ秒で、再びカンザスへのすべての方法を持って、そして。
>> また、カンザス後、彼らは、おそらく、ヒューストンを通じてツアーに参加
としては、このサーバーの名前が示唆された。
インターネット上のサーバは、数値アドレスを持っている必要がありますので、同じように、
それはまた、必要に応じて、人間が思いついたことを、もう少し人間に優しいアドレスを持つことができます。
さて、ステップ8で、私たちは、これが何であるかを知らない。
たまにルータがちょうど種類のもので、あなたを無視する
そして、彼らはただ質問に答えていない、それは大丈夫ですので。
ステップ8後の1は、明らかにどこにあるのでしょうか？ L.A.
物理的に行うために6時間以上のように私たち人間に必要なものだけで78ミリ、で予告
そこまで移動するには、インターネット上で78 msの情報のパケットを受け取ります。
ステップ10は、同様にLAであり、ステップ11は、スタンフォード大学の近くで、北行っているようだ。
これは彼らの境界ルータ、または境界ルータです。
私たちを無視しているスタンフォード大学のカップルのステップ、
そして最後に、私達はちょうど87ミリ秒でWebサーバに到達する。
さて、余談として、これらの数字はすべて、
データだけが私から取得するためにどのくらい時間がかかることを伝える
これらのルータのそれぞれに、それは累積ではありません。
このプログラムは何をするか、それがまず最初のルータに、本質的に、メッセージを送信します。
次に、第二のルータに1、次に第3のルータへの1つは、
それぞれの時間を測定します。だから理論的には、これらの時間は成長する
または少なくともかなり近いお互いに、
そして、確かに、キャンパス上で右ここであるものは、超小型である。
あなたが国を渡って行く始めるとすぐに、それは、データを取り
少し長く、旅行100ミリに近い、与えるか、または取る。
しかし、今度は、他の方向に行くことができます。どのように英国のケンブリッジ大学はどうですか？
私が代わりにケンブリッジのwww.camのtracerouteを実行してみましょう、
学術用のAC、。英国、ここでエンターキーを押します。
これはかなり気に速かった。
私のデータは文字通り時間のその瞬間、ケンブリッジ、イギリスに行ってきました。
>> だからそれが取った道を見てみましょう。
ハーバード大学、ハーバード大学、ハーバード大学、ノーザンクロス、
BAM次にこれは、ISPであり、これはノーザンクロスであり、。
手順6と7、ルータ6と7の間には何ですか？
大西洋。そして、我々はその事実からこれを推論している
我々はここで20ミリから80ミリここに行く。
だから何かが乗り越えるために、与えるか、または取る、60ミリ秒かかります。
そして、それはおそらく水の大きな体だった。
何がその後に行きますか？さて、ここで我々は、ロンドンにあり、
後でちょうど88ミリ。ロンドン、ロンドンより、もっと
これは、しかし、我々はそれがロンドン以外だと仮定します場所がわからない、
ここケンブリッジ、最終的に我々 - 文字通り、ケンブリッジ大学
次に。something.net、そして、最後に、16行目で、
自分のWebサーバは、明らかにさそり座と呼ばれ
我々はwwwとしてそれを知っているにもかかわらず、ボンネットの下に。
一種の心を吹いて、私は思う。私が今までにこれをした最初の時間は、それは完全に私の心を吹いた。
残念なことに、ハーバード大学は、ネットワーク上で、一般的に、この種のトラフィックをブロックします。
だから、簡単にスーパーにそれを行うことはできません。
実現する、しかし、ここでこれは可能です。
かしこまりました。のは、ここで我々の5分間の休憩を取りましょう。我々は戻ってきて、より深くに飛び込むでしょう。
だから我々は戻ってきた、と我々は同じ種類ではここではいくつかの異なる方向に約のんびり歩いてきました。
それでは、まさにここで起こってきていることをまとめてみましょう。
我々は、HTMLと呼ばれるこの言語について話して会話を始めた。
繰り返しになりますが、必ずしもプログラミング言語。それはただのマークアップ言語です
それが美学とWebページの形でコンテンツの構造化について主としてある。
しかし、HTMLのため、機構のいくつかの種類を必要とします
Webブラウザとサーバー間を移動するための。
HTMLのため、この他の言語の上に乗っての並べ替え、
HTTPとして知られているか、またはより正確には、プロトコル、。
>> そして、我々はこれまでそれを見てきたように、HTTP、
握手をして、この人間の慣習に類似種類のものである。
ブラウザはサーバからページを要求したがっているとき、
それは、ブラウザからサーバーへのリクエストを "獲得"している送信
その後、サーバが200のような番号で応答し、すべてが、大丈夫です
同様に404のようなHTMLまたはいくつかの悪い数字のように、ファイルが見つかりません。
しかし、一方では、HTTP自体は、それ自体が、インターネットではありません。
HTTPは、単にサービス、インターネットの特徴である
ずっとGのチャットのようなメールは別のサービスであるのと同じように、別のサービスです。
我々はインターネット上で行うことができるもののすべての種類があります。
HTTPはちょうどそれらのアプリケーションの一つです。
そうの上に - HTTPは何か他のものの上にあります
我々は名前で言及しなかった、名前では、TCP / IPの聞いたことがあるかもしれません。
だから我々はそこに語った話はすべてに約ある
どのようにデータがbを指すようにポイントから移動する。
そして、この場合には、我々は非常に低いレベルで見た
ルータは、ルータへのルータにルータに
どのようにデータが実際に送信されます。
しかし、道に沿って、それが様々な障害が発生したために起こっている。
これらのルータのほかに、インターネット上でのファイアウォールと呼ばれるものがあります
我々だけで送信されたされているようなので、データ、
私からスタンフォードへ、私からケンブリッジへ、
このレベルでは、に送信されますが、何かは、IPアドレスと呼ばれる。
私たちは、少し前、これを見て、IPアドレス
、単にフォームw.x.y.zの数値アドレスです
これらの各々は、間にある場合に、与えるか、または、0〜255の範囲を取る
あなたは非常にそれらの数のすべてを使用することはできませんけれども。
しかし、これらのプレースホルダはそれぞれ0から255までの数値です。
だからIPアドレスは、これらの日は32ビットです。
>> さて、それは私たちの世界でどのように多くの可能なIPアドレスを与えますか？
約4億円となり、いつでも我々は2の累乗でカウントしているので、
何かの32までのすべての方法は、それは通常私達40億を与える。
だから、IPアドレスがたくさんですが、あなたは読んだことがあるかもしれませんが、
またはあなたが今、大衆紙に気づくかもしれません
IPと呼ばれるIPv6の新しいバージョンに向けてプッシュ。
今、私たちはバージョン4を使用している。
本当にバージョン5がありませんでした、私達はちょうど6に右ジャンプしている。
バージョン6は巨大なおかしくされているIPアドレスのために128ビットを使おうとしている。
我々は、今やかなりの時間が不足してはいけません
しかし、我々は、バージョン4のIPアドレスが不足し始めている
すべての私たちのラップトップとデスクトップのようなものだけでなく、持っているので、
私たちの多くは携帯電話を持って、私たちの多くは、他のデバイスを持っている
TiVoのような、自分自身のIPアドレスを持っているような。
ハーバード自体はコンピュータの数万人を持っています。
だから世界は純粋に、このフォームの、少なくともIPアドレスが不足しています。
だから、今後数年間は、アドレスを参照しようとしている
自分のコンピュータ上で、おそらく徐々に変更
より多くの企業や大学が新しいバージョンをサポートし始めると。
しかし、IPアドレスは、コンピュータ、コンピュータBからのデータを要求するためには十分ではない。
コンピュータBがサーバーになる可能性があるため、
そして、サーバは、前述のように、物事の束を行うことができます。
それは、それが電子メールサーバーにすることができ、Webページをホストすることができます
それはSkypeのサーバーにすることができ、それはGのチャットサーバにすることができます。
>> サーバー上で提供することができますすべてのこれらの異なるサービス
すべて、物理的に同じマシン上に置くことができます。
だから、IPアドレスに加えて、
世界は、インターネット上のポートと呼ばれるものを持っています。
ポートは数字だけです。ので、HTTPのための固有の番号があります。
その数は80です。
HTTPはまた、暗号化されたHTTPSのために、より具体的には番号443を使用していますが、。
あなたは、sを見るたびに、安全のために、それは別の番号を使用している。
そうでなければ電子メールとも呼ばれ、SMTPと呼ばれる何かのために使用されている25のような他の数字は、、、あります。
SSHのために22と呼ばれるものは、あります
し、他のポートの全体の束がそこそこだ。
今、私たち人間はめったにこれらの数字を見ない。
ただし、http://www.facebook.comようなアドレスを入力するときに、
HTTPを使用しているので、ブラウザは密かに、80を挿入しています。
あなた場合は、代わりに、タイプHTTPSは、それが密かに443を挿入している。
私はブラウワーをプルアップした場合、我々はこの種の手動でこれを見ることができます
とhttp://www.facebook.com:80に行く。
したがって、明示的にWebサイトの名前だけではない理由
しかし私が話をしたいポート、そしてエンターキーを押します。
ブラウザが想定しているので、それが消え、気付く
ああ、80、私もあなたにそのを示す気にするつもりはない。
しかし、この理由は、私が実際に誰かがメールを送信したい場合、つまり、
私は本当に、SMTPであることを、ポート25上で彼らにそれを送るでしょう。
単純化し過ぎのビットですが、あなた方のうちの何人かは友人がいる
誰が実際にフェイスブックで働き、彼らは、同様に、電子メールを受信するサーバーを持っています。
>> あなたがメールを送信するたびに、Gmailがあなたのために何をやっている
またはOutlookまたはあなたが使用するプログラム、
それは密かに、その場合には、だけでなく、25という数字を挿入するようなものだ。
それはIPアドレスと一意に識別する番号の組み合わせだ
インターネット上のコンピュータとそのコンピュータ上の特定のサービスを提供しています。
今、もちろん、私たちのほとんどは、おそらくIPアドレスを手動で入力したことがありません。
たぶん、あなたはあまりないので、アプライアンスで、しかし現実の世界で持っている。
なぜ我々は、ブラウザにIPアドレスを入力しませんか？
それは動作しますが、実際には、我々はこれを見ることができるだろう。私がお見せしましょう
MacまたはPCで、ハーバード大学のキャンパス内で最もどこでも動作するはずですもう一つのコマンド。
nslookupコマンドは、ネームサーバのルックアップと呼ばれるこのコマンドがあります。
ああ、面白い - 私はwww.cnn.com見上げると、それはCNNが持っていることが判明した。
CNNはAmazonウェブサービスを使用して開始しました。
あなたはクラウドコンピューティング、クラウドコンピューティングのビッグプレーヤーAmazonのいずれかの知っているかもしれません。
私だけだったのですか、私は言った、 "私にCNNのWebサーバーのアドレスを進呈
それは、CNNのWebサーバーがAmazonによって管理されていることが判明
Amazon Web Servicesは、これが示唆している。
と、そのサーバのアドレスは、こここれです。
彼らはアマゾンを使用するために使用しなかったので、だから私は、これがうまくいくかどうかわからない。
入力は、http://、IPアドレス、および - ;しかし、ここではこれを試してみましょう
それが仕事に行くのですか？
はい。それが仕事に行くのです。インターネットは超遅い今日です。
しかし、一瞬にして、あなたには、いくつかのニュース記事を見ることができます。
そうしよう。アメリカの銀行は、訴えられている。かしこまりました。
>> このIPアドレスは単なるwww.cnn.comと同義であることを起こるためです。
もちろん、それは、言う50.112.94.127で、Web上で私たちを訪問する恐ろしいマーケティングでしょう。
あなたは覚えていないと思います。そうであっても、これらの日あなたは、物事を思い出すかもしれない
1-800-COLLECTまたはニーモニックのような世界では、電話番号のを思い付いた。
携帯電話の前ではなく、覚えにくいそのうち、
あなたはそれを入力すれば、忘れることができるまで。
だからWebは、あまりにも、名前とIPアドレスのこの規約を持っています
DNSサーバがアウトと呼ばれるこれらのものがあります、
ドメインネームシステムサーバ名に、またはその逆にIPアドレスを変換する。
だからそれはフードの下で何が起こっているのです。
最後に、我々はこの非常に低レベルのプロトコルであるTCP / IPを持っている
つまり、実際には、ちょうど、0と1のインターネットの向こう側を取得
そして、それは仮想封筒にそれらを置くことによって、そうします、
可能ならば、エンベロープの外側に書き込み
宛先のIPアドレスと同様に、数値のポート番号
それが話をしたいと、その宛先上のサービスの。
一方、封筒にリターンアドレスとして知られているものもあり、
、あなたのIPアドレスはどちらになるように、CNNはあなたからの情報のパケットを取得したときに、
、この仮想封筒を開き、あなたはホームページを見たい
それは背中にHTMLを送信するには、この仮想エンベロープの送信者の部分から知っている。
それでは、もう少し詳細にこのを見てみましょう。
数年前からこのことは、エリクソンという会社からです。
そして、彼らは、インターネットは実際にどのように動作するかをいくつかの自由を取った
しかし、それはここで単なるチョークアップするよりもはるかに多くの視覚映像を塗る。
だから私は、 "インターネットのビットを"あなたを与える
>> 史上初めて、[ナレータ]
人と機械は夢を​​実現し、一緒に働いている。
地理的な境界を知らない団結力。
人種、信条、または色を気にせずに。
コミュニケーションは本当に人々を結び付ける新たな時代。
これは
ネットの夜明け。
それがどのように動作するかを知りたいですか？ネットにあなたの旅を開始するにはここをクリックしてください。
あなたがそのリンクをクリックしたとき、今、正確に何が起こったのか？
あなたは、情報の流れを開始しました。
この情報は、あなた自身の個人的なメールルームにダウン移動
どこミスターIPパッケージには、それをラベル付けし、その途中で送信します。
各パケットは、そのサイズが限られています。
メールルームでは、情報を分割する方法を決定する必要があります
そしてそれをパッケージ化する方法について説明します。
さて、パッケージには重要な情報を含むラベルを必要と
送信者のアドレス、受信者のアドレス、それはパケットの種類など。
この特定のパケットがインターネット上に外出されているので、
それはまた、プロキシサーバーのアドレスを取得
我々は後で見るようにこれは、特殊な機能を持っています。
パケットはこれで、ローカルエリアネットワーク、またはLANに起動されます。
このネットワークは、すべてのローカルコンピュータを接続するために使用されている '
建物の物理的な壁内の情報交換のためのルータ、プリンタ、エトセトラ。
LANは、残念ながら、かなり制御されていない場所であり、
事故が起こる可能性があります。
LANの高速道路はすべての種類の情報が満載されています。
これらは、IPパケット、Novellパケットは、AppleTalkパケットです。
彼らはいつものように、トラフィックに逆行している。
ローカルルータは、必要に応じてアドレスを読み取り、
別のネットワークにパケットを持ち上げる。
ああ、ルータ。一見無秩序な世界でのコントロールのシンボル。
[ルータは自分自身にぶつぶつと話し]
>> [ナレータ]そこに彼は、思いやりのない、整然とした、体系的である
保守的な、そして時にはなく、かなりスピードアップする。
しかし、少なくとも彼は、ほとんどの部分は、正確です。
パケットがルータを残すように、彼らは企業のインターネットへの道を作る
ルータスイッチ用と頭。
ルータよりも効率的にビットが、ルータ·スイッチは、高速で、IPパケットと緩やか果たす
巧みに自分の道に沿ってそれらをルーティング。
デジタル "ピンボールの魔術師、"可能ならば。
[自分自身に話しルータースイッチ]
パケットが宛先に到着するように、[ナレータ]
それらは、ネットワーク·インターフェースによってピックアップしています
次のレベルに送信する準備ができました。
この場合、プロキシ。
プロキシは中央の男性のようなものとして、多くの企業で使用されている
インターネット接続の負荷を軽減するために、
と、セキュリティ上の理由だけでなく、。
あなたが見ることができるように、パケットは、その内容に応じて様々な大きさのすべてである。
プロキシはパケットを開き、WebアドレスやURLを検索します。
アドレスが許容できるかどうかに応じて、
パケットがインターネットに送信されます。
プロキシの承認を得て、満たしていないいくつかのアドレスは、しかし、があります。
つまり、企業や管理のガイドラインを言うことです。
これらは、即決を取り扱っております。
我々はそのどれもありませんよ。
それを作る人のために、それは再び道路上です。
>> 次は、ファイアウォール。
企業のファイアウォールは2つの目的があります。
それは、イントラネットに来てから、インターネットからいくつかのかなり嫌なことを防ぐことができ
そしてそれはまた、インターネット上から発信され、企業の機密情報を防ぐことができます。
一度ファイアウォールを経由し、ルータはパケットをピックアップ
我々が言うようにと、はるかに狭い道路、または帯域幅の上に置きます。
明らかに、道路はそれらすべてを取るのに十分広くない。
さて、あなたは、道に沿ってそれを作るていないすべてのそれらのパケットに何が起こるのか不思議に思うかもしれません。
さて、氏のIPは確認応答を受信しない場合
パケットは、期​​限内に受信されたこと
彼は単に交換パケットを送信します。
我々は今、インターネットの世界を入力する準備が整いました。
私たちの地球全体にまたがる相互接続されたネットワークのクモの巣。
ここでは、ルータとスイッチは、ネットワーク間のリンクを確​​立します。
今や、ネットはあなたが見つけるとはまったく異なる環境です
あなたのLANの保護壁内。
ここに、それは野生の西です。
十分なスペース、機会をたくさん、
探索することや行く場所がたくさん。
ほとんど制御と規制のおかげで、
新しいアイデアは、彼らの可能性の限界に挑戦するために肥沃な土壌を見つける。
しかし、このために自由を、一定の危険も潜んでいる。
あなたは死の恐怖のpingを満たすでしょうときにあなたが知っていることは決してないだろう、
通常のリクエストのpingの特別バージョン、
そのいくつかの馬鹿は疑うことを知らないホストを台無しに思いついた。
私たちのパケットがたどるパスは、衛星を介してもよい
電話回線、無線、あるいは大洋横断ケーブル。
彼らは常に、最速または最短ルートが可能になりません
しかし、彼らは最終的にそこに着くでしょう。
それが時々呼ばれる理由たぶんそれはだ "ワールドワイドを待ちます。"
しかし、すべてが順調に動作しているときに、
あなたは文字通り、帽子のドロップで5回以上地球を回避することができます。
そして、すべてのローカル呼び出し以下の費用のため。
私たちの目的地の終わり近くに、私たちは別のファイアウォールを見つけることができます。
>> 、データパケットとしてあなたの視点に応じて
ファイアウォールは、セキュリティや恐ろしい敵の砦である可能性があります。
それはすべてあなたが使っていて、自分の意図が何であるかどちら側に依存します。
ファイアウォールは、その基準を満たすパケットだけが入れるように設計されています。
このファイアウォールは、ポート80とポート25で動作しています。
他のポートを介して入力するすべての試みは、ビジネスのため閉鎖されています。
ポート25のメールパケットに使用される、
一方、ポート80は、インターネットからWebサーバへのパケットのための入り口です。
ファイアウォールの内側に、パケットはより徹底的にスクリーニングされる。
パケットによっては、税関を通る簡単に作る
他の人が少し怪しげな見ながら。
さて、ファイアウォールの役員は簡単にだまされていない、
このような死パケットのpingが正常なpingパケットとして自身を偽装しようとしたときのように。
[パケットに話しファイアウォール役員]
[ナレータ]これまでのところ、それを作るには十分に幸運それらのパケットに関しては、
旅はもうすぐ終わりだ。
それだけで、Webサーバに取り込まれるインターフェイスのラインアップです。
今日では、Webサーバは、多くのことで実行することができます
メインフレームからWebカムにあなたの机の上のコンピュータに接続します。
なぜあなたの冷蔵庫？
あなたは素質があれば適切にセットアップされて、あなたは見つけることができます
チキンカッチため、またはあなたが買い物に行かなければならない場合。
覚えておいて、これはネットの夜明けです。
ほとんど何でも可能です。
一つ一つは、パケットが受信され、
開かれ、アンパックされます。
それに含まれる情報、すなわち、情報のためのあなたの要求、
Webサーバー·アプリケーションに送信されます。
パケット自体がリサイクルされ、
、再び使用する準備ができて、あなたの要求された情報でいっぱい
対処し、あなたに戻って、その途中で送った。
戻る過去のファイアウォール、ルータ、インターネットに至るまでに。
戻ってあなたの会社のファイアウォールを介して
と、インターフェイス上に、
あなたが要求した情報を使用して、Webブラウザを提供する準備が整いました。
つまり、この映画である。
彼らの努力に満足して、よりよい世界を信頼して、
私たちの信頼できるデータパケットが、別の日の日没に穏やかにオフに乗る
彼らはよく、彼らの主人に仕えてきた完全に知っている。
さて、そのハッピーエンドではないですか？
[マラン]よし、十分だ。我々は、来週お会いしましょう​​。
[CS50.TV]