[音楽再生] DAVIDマラン:これはCS 50であり、そして これは週9の始まりです。 そして、何私たちが今日やるだろうと思ってすることはありません 唯一先週の章を閉じる 我々は、サーバーに焦点を当てた材料 PHPとSQLを使用したサイドのWebプログラミング、 一部のデータベースのもの。 我々は少しの話だろう セキュリティ今日その後 クライアント側のプログラミングへの移行 JavaScriptの言語として知られている。 しかし、最初に、いくつかの償還。 あなたはそれを上に思い出すかもしれ 水曜日、私が着手 そのウェブサイトを書き込む ユーザの入力にかかった その後格納されているHTMLフォームによる そのユーザ入力名前、電話 数字、および携帯電話 データベース内のキャリア。 そして私は少しのコマンドを持っていた PHPで書かれた行のスクリプト そのは反復処理になっていた データベース内の行の上 テキストメッセージを送信します。 いくつかの、いくつかの試みにもかかわらず、私たち 年末までにその作業を取得しませんでした。 だから私は働いて、この週全体費やし そのコード上のポイントを過ぎて私たちを取得する 我々は中断したところ、それによってすべて 私は水曜日の終わりまでになった このテキスト·メッセージはなかった 私は苦労したようマーゴから、 別のテキストメッセージに続いて 同級生、あなたはこのデビッドを持っている。 このいずれかが続く、 素晴らしく心強い。 行くに保たれ、非常に心強い。 私はほとんどthen--までそれを持って、 それは我々が水曜日に終わったノートです。 その後実際に、おそらく私のお気に入り、 一瞬後に、これが入って来た。 くそーストリームライブ。 だから、今日、私たちは迅速にこの問題を解決 私は以来、何をやったかを見てください。 したがって、このコードのすべてが利用可能です オンライン先週の、週8から、 ソースコード。 そして、あなたは、私が経験したことがわかります そして私は実際に少し物事をクリーンアップ。 私は他のカップルを導入 SQLデータベースの特徴。 例えば、よりもむしろ ただのvar char型のキャリアを作る 私は先週、その場でやったと思うように。 私の代わりとしてそれを定義した 列挙何と呼ばれています。 そして、あなたのいくつかはこれを見たかもしれない 私たちは探求としてC.列挙型は、実際にはある Cの機能のことができます。 定数の全体の束を列挙 自動の値を割り当てる、 一つ、二つ、三つ、四つのような ハードコード番号しなくても。 だから、SQLがあればそれによって、同じことをサポートしています あなたが唯一のデータベースフィールドを持っている 有限の1に撮りたい 値は、あなたは文字通りそれを指定することができます 私は4のためにそこに行ったように 米国の人気携帯電話キャリア。 だから私はそれをした。 そして、私は、変更の数を作った よく、最も重要なの メールがリコールための作業を取得することでした、 このプログラムは、どの頼っていること 一般的に電子メールに呼ばれる ただでSMSゲートウェイ、 そのベライゾンを言うの空想の方法、および AT&T、およびその他の人々は、サーバーをサポート これにより、それが受信した場合 電子メールは、SMSに変換 とテキストを送信します 誰かの携帯電話へのメッセージ。 だから私はこれを正しく行った場合、 ここに新しく改良されたフォームがある それは話をする予定です 新規で改良されたコードを、それ あなたがオンラインで遊ぶことができます。 そして、それはうまくいけば、私を行います 一瞬で電話ビープ音。 だから最初、私は自分の名前を入力するつもりです。 第二に、私はつもりはない この今回行う。 私は、Elementを点検するつもりです。 そして、これはただです 小さな事ので、私にはありません ポストプロダクションの時間を作る 私は前回と同じように働く。 今、私の電話番号があります。 私はベライゾンを選択します。 そしてここで、それでは、このマイクをオンにしてみましょう ここで、ここで自分の携帯電話でこれを目指しています。 私は、[登録]をクリックするつもりです これうまくいけべき データベースにそれを置く。 今私はに行くつもりです コマンドラインプログラム、その リコールは、ドットスラッシュと呼ばれていた テキスト、およびあなたの指を渡ります。 ここに私達は行く。 [フォンへこみ] [拍手] DAVIDマラン:this--よりだからもっと楽しく 私はそれに入る場合には、もちろん、楽しい。 我々しかし、もしそれが、私が考えた、より楽しい これらの映画の瞬間の一つを作成 ここで何かのように本当に 悪いが、世界で起こっている そして、すべてのNSAの人々のような 携帯電話は、ビープ音を開始 テキストメッセージ付き この事実にそれらを警告する。 だから私は、私たちがしようと思った ここで同じことを再現する、 データベースを使用しないことにより、 私の代わりに事前に このようになりますプログラムを書いた。 これはindex.php--です と私はオンラインこのコードを置く well--と明らかに ただ、指定すれレンダリング 我々のMVCスタイルのパラダイムを使用して 問題のあるセットで詳しくについて話す 7。 そのフォームは非常に単純です。 それは、に提出するだろう 郵送here.phpと呼ばれるファイル。 そして、それは明らかに尋ねるために起こっている 名前、電話番号のために、 その後の、いわゆるビア それはだ、メニューを選択 あなたには、少なくとも4つを提供するつもり 米国の人気携帯電話のキャリア、 そして、あなたが効果的にできるようにする こちらをクリックして出席を取る。 そしてここで、その間に起こっている 前回からのコードの一部を借りる。 そして、あなたはちょうどこの脱脂した場合、 あなたはそこだということがわかります エラーチェックの全体の束。 しかし、末尾の美しさはということです 今日は、データベースへの書き込みをしていない。 私たちは、それをシンプルに保つことだと ただ、うまくいけば、発送 関数Iを介してテキストメッセージ ここ数日のコールにわたって書いた 関数内のテキスト、。 PHP、 どのオンライン再び使用可能になった。 ので、もしあなたがこの中では参加したいと思います。 私たちは何を格納するつもりはない。 リアルタイムでここに次のURLを参照してください。 まだそれを提出したが、してみましょうしないでください 我々はこれらの映画のいずれかを持つことができる場合を参照してください。 瞬間、みんなの携帯電話 ただ、うまくいけば、ビープ音開始 2011年とは異なり、この年に一度 どこにこれが恐ろしくゆがんで行きました。 そして、あなたはそのアドレスに行く一度、 あなたは、スーパー簡単なフォームが表示されるはずです その名前を持っている場合、携帯電話 番号、携帯電話キャリア そこにリストに一致する、行く 先に、フォームに必要事項を記入。 しかし、単にまだ提出ヒットしない。 フォームはこのように見えるだろう。 先に行くと入力 お名前、電話番号。 OOPは、誰かが先にカーブのだろう。 それはOKです。 [OK]を、誰もがフォームを記入だ。 これは上で動作するはずです あまりに電話、あなたがしたい場合。 すべての権利、あなたのマークに、行く、セットされます。 ここにヒット。 何? いいえ。 私は、私がテストし、神に誓う この複数回、今日。 あなたはそれを得たか。 [VOICESを介在] DAVIDマラン:OK、ユーザーエラー、おそらく。 すなわち、2つのです。 これは、中2のために働いた 4,3、数百。 [OK]を、それは良いことだ。 5人のうち4人用 方法については、正しさ。 だから、トラブル·イン·ハリウッド? だからおそらく、あなたを見ずに 画面、なぜそれがエラーの発生したかもしれません? それは我々がちょうどあったことをおそらく あまりにも多くの接続をしようとし ハーバード大学のメールサーバーへのすべてで 同じIPアドレスからの回。 私はちょうど私がしなかったので推測している テストの贅沢を持っている 一部では、このコード 事前に300人 今のことを実現する 少なくともべきであること 今回仕事を頂いております。 すべての権利、なぜこれが全てです 何が起こっているのかに、より密接に? さて最初に、迅速な 発表のカップル。 だから、1、あなたはチャンに参加したい場合、および ニック、そして昼食時に他人今週の金曜日、 そこにいつものURLでRSVPを行います。 あなたが集中して考えている場合 中またはCSにおける二次をやって、 あなたは二年生だかどうか、または新入生、 あるいはジュニアやシニア、この時点で まだコースを絞ることができ、 実現するエンジニアリングスクール、その 無料でベンのために収集され、 ジェリーのアイスクリームとアドバイス この水曜日直後にクラス CSビルの午後4:00で マクスウェルドーキンで。 これは速すぎる場合 画面上に、ちょうど行く のためcs50.harvard.eduする Facebookのイベントへのリンク あなたはより多くの詳細を見ることができます。 一方、私は修正したいと思った 1他の事は私は水曜日にgoofed。 マルコIDと判明 Facebook上3はありませんでした。 それは4だった。 彼はより多くのテストを持っていたが判明 私が思い出すよりも占めています。 しかし、これは機会のように感じたもの 行うには、このようなURLをプルアップすることです。 だから、Facebookが持っていることが判明 API、アプリケーションプログラミングインターフェイス、 それによってあなたメカニズムはある プログラム的にデータを要求することができます フェイスブックで、マシンを取り戻す 読み取り可能な情報ではなく、ウェブページ ちょうど生のテキスト、何か JavaScriptのオブジェクト表記法と呼ばれる。 そして、私はこれを実際に訪問し、あれば URL、およびデフォルトでは、ズームイン、 これが公にマルコです アクセス可能な情報。 興味深い細部 ここだけという彼のIDです 確かに4番、あるI とすぐに私はこれをしなかったとしても実現。 あなたが知っている場合は、このを自分で行うことができます 自分のFacebookのユーザー名は、1つを持っている場合。 ちょうどそこにトップにそれを入力します。 そして、これのどれもプライベートではない。 私はちょうどさえこれをやっている シークレットモードで。 だから私もログインしていないよ。 そして、あなたはその私を見ている どうやらユーザ番号6454だった ではないFacebookの、上 このごろあまりにも悪い。 だから、とにかく、あなたもわかります そこに追加情報。 かつ有用な側面 そのことをあなたということです 独自のソフトウェアを書くことができ、その 何とかこのようなデータを統合 独自のアプリケーションに変換する。 あなたはユーザーに権限を与えることができます あなたのウェブサイトにログインし、 独自のカスタムユーザー名を使用していないし、 パスワードが、おそらく自分のFacebookのログイン さらには情報を得る 彼らの友人についての、 彼らはそのような、または類似のを承認した場合。 そのため、あまりにも、そのCS50に注意してください 独自のAPIのいくつかを持っています、 コー​​スカタログデータ用1、 ダイニングでの抱擁メニューの一部 ホールの全て 建物や場所 キャンパス内に我々としてもためのAPIを持っている あなたは、同様に照会し、得ることができることを あなたが統合することができ、バックテキストデータ PHP、またはJavaScriptへの、あるいは、 しかしあまり一般的ではないが、 C言語ベースの最終的なプロジェクト。 実際、先に決勝 プロジェクトは、いくつかのマイルストーンである。 あなたは先日弊社からのメールを得た。 提案することを実現する 今度の月曜日原因です。 それは必ずしも拘束力がないですが、あなた あなたの教授仲間を受信する必要がない 作る前に承認 その後何らかの変更。 その後先にある 他のマイルストーンの数。 だからあまりにも、あなたをいじめるために、 いくつかの可能性を、 私達はの束を持っている これらの色相電球。 そして君たちのいくつかは、現在いくつかを持っている あなたの寮の部屋でこれらの同様。 そして、彼らはあまりにも、APIを持っています。 だから、それらのバイナリ電球週間リコール 前のあのダン·ブラッドリーとアンセル ダフは、私たちのために作成しました。 彼らはにソフトウェアインタフェースを使用 現時点ではこの電球、 電気に接続されている その後無線経由 小さなことに接続されている 、ここに橋を下と呼ばれる 少しルータ独自の様 この特定のデバイスに。 私はどのように知っていればそれが判明 我々はすべてが今そうであるように、HTTPメッセージを送信し、 私はこのようなメッセージを送ることができます オンまたはオフにそれを回すためにこの電球 または、任意の数の実行 その上に他の操作。 それが得られないだことに注意してください、それが投稿していない。 プットと呼ばれる別の1があります。 他のいくつかのような動詞が実際にあります。 しかし、パスがあります気づく APIを大幅に削減する、新しい開発者を大幅に削減する、 状態をスラッシュ、1スラッシュ、光を大幅に削減。 それは明らかにちょうどです パスその会社、フィリップス、 あなたがヒットする必要がありました HTTP要求に あなたが状態を変更したい場合 HTTP 1.1を使用して電球の。 その後、空白行に気づく。 その後、最後にどのように見えるか ある種の配列の一種で、 これが再び呼び出されようとしている JavaScriptのオブジェクト表記、またはジェイソン。 そして、何あなたがここで見ることはということです 3キーと値のペアがあります。 つのキーがオンと呼ばれています。 どうやら、その値 真であることを行っている。 明るさは128であり、これ int型のいくつかの種類である。 その後遷移時間はある どうやらゼロ、 それがために起こっているどのくらい この事をオンにするために取る。 だから、今、この電球がオフになっています。 しかし、私は正確にしましょう​​this--行う場合 私は少しチートシートに行く ダンはで設定することを advance--と私は行くよ 先に行くと、コピーする 次のコマンドを実行。 カール、あなたのいくつかのように CS50に集められたかもしれない 話し合うTelnetなどのようなユーティリティである あなたがHTTP要求をシミュレートすることができ、 特に置きます。 私はこのデータを送信することができ、 特に私たちだけ 特に先ほど見ました こっちにこのURLへ。 その後カールは、処理するために起こっている 必要なすべてのヘッダー そこの構文解析。 だから私がしなければならないすべては、このことをコピーしている その後、ターミナルウィンドウとEnterキーを押します。 と電球が点灯します。 そして、これはすべて通過している 私のコンピュータをワイヤレス 何とかダウンブリッジに、どの この電球と話している。 私は他の何かを行うことができます。 私はこの事を行うことができます 例えば赤行く。 私は、インスタンスのために作ることができます この事は緑行く。 私はそれが青に行くことができます。 これらの各々に気付く インスタンスは、私が変わってきたことのすべて いわゆる色相値である 実際にいくつかの色を与える。 だから私は、同様に、この1を貼り付けてみましょう。 今では青です。 あなたも手の込んだ行うことができます 物事がのが緑に行こうwhere--。 そして、私はこれを行うことができ 私自身のコードを持つコース。 しかし、たとえAPI自体 ファンキーな操作をサポートしています このような、今わざわざれる 次の30秒間たち。 だから、あなたがかもしれないの一つ味だ APIとは、これは関係する 電球。 CS50は、カップルを持っていることに注意してください グーグルグラスのペアあなたが希望の場合 に沿って何かに取り組むのが好き これらのライン、ArduinoのUNOS、どの 小さな小さなコンピュータである、 本質的に、少し回路基板上 あなたが接続できる ワイヤーや他のもの へと実際に制御 あなたの本当の世界の環境。 その後いくつかあります 我々が持っているの新しいおもちゃ。 この1つは文字通りちょうど到着 メールで先日、ミオの腕章。 そして、私はそれがへの道だと思った プロジェクトについてのあなたが興奮する あなたが使用する可能性のある このハードウェアだろう この短いクリップを再生することで 彼らは人々をいじめるために使用すること 我々は今、将来に住んでいること。 [音楽再生] DAVIDマラン:だから、わずか数週間で、あなた あまりにCS50フェアで、そのクールなことができます。 我々の別のデバイス 私たちがしていることの束を持っている プロジェクトのために貸し出して幸せ モーションコントローラと呼ばれている。 これは小さなUSBデバイスである あなたがコンピュータに接続すること あなたと対話することができます あなたのラップトップ、MacやPC、 あなたは、XboxのKinectのように持っていたかのように そして実際にははるかに物理的な動きを作る のような私たちは、この中で参照してください。 未来のビジョン。 [音楽再生] DAVIDマラン:だからあなたが持っている場合でも、 どのようにそのようなことは考えていない おそらく発明さや仕事することができた ハードウェアレベルで、どんなに。 でも、CS50のわずか数ヶ月後に、 とプログラミングの理解 より一般的には、ウェブプログラミングより 最近では、その後もAPI、およびHTTP、 あなたが経由でアクセスする必要があります ソフトウェアAPIを使用の場合 これらのいずれかを借りたいです 実際に話をするデバイス と心配する必要はありません 基本となる実装 完全に詳細、 レイヤリングのこの概念と一致 私たちがした抽象化 学期全体で見られる。 だから、また週末に、 ニュースのカップルの部分を見ました。 あなたあればセミナーに行く、最初に行く 何かを学びたい トピックの任意の数の詳細。 そこのURLを参照してください。 この1つはに送信されました あなたが知っているチャン、によって私、 誰が象の私達の軍隊を印刷だ。 次のように、それは見出した。 私は新しいテレビの恐怖だ。 私は怖いなぜこれをオンにする あなたもなるだろうし、上のもの。 だから我々は、今でている 学期内のポイント、 あまりにも、あなたはどこを持っている場合でも、 理解のわずかな ウェブがどのように動作するかの、およびHTTP、 やセキュリティ、このようなこと あなたの目をキャッチする開始する必要があります。 しかし、また、あなたは理解するでしょう これらの事はしているか否か 実際の脅威。 だから私は、いくつか抜粋しました ここにこの記事から。 次のように話がある。 私は今の所有者だ 新しいスマートテレビ、どの ストリーミングを提供することを約束 マルチメディアコンテンツ、ゲーム、アプリ、 ソーシャルメディア、およびインターネット ブラウジング、あまりにもああ、テレビ。 唯一の問題は、私は今だということです それを使用することを恐れて、著者は述べています。 あなたを介して読めば、あなたは、あまりにも、だろう お使いのテレビのための46ページプライバシーポリシー。 このデータの量 事は驚異的である収集します。 それは、どこで、いつ、どのように、そしてログに記録します あなたがテレビを使用してどのくらいの時間のために。 それは、クッキーを追跡設定し、 我々は議論してきたように、 そしてビーコンは、設計された あなたが持っているときを検出する 特定のコンテンツを見たか 特定の電子メールメッセージ あなたのテレビでメールをチェックしたい場合。 これは、アプリを記録します 使用する、あなたが訪問したWebサイト、 そしてあなたがコンテンツと対話する方法、 あなたのスマートテレビを経由してすべてのことをやって。 またそれは、creepier yet-- それは私のaddition--だ カメラに内蔵されています 顔認識を持つ。 目的は、提供することです TV用ジェスチャーコントロール とにログインすることができます あなたの顔を使用してアカウントをパーソナライズ。 逆さまに、イメージがある テレビに保存されている代わりに、アップロードされた 企業のサーバーへ。 下がり気味で、インターネット 接続は全体のテレビを作る 誰がハッカーに対して脆弱 能力を示した マシンの完全な制御を取る。 それではなかったかのように、もっと厄介 十分にスマート、マイクです。 TVは声を誇っています 認識特徴 それは視聴者が制御することができます 音声コマンドで画面。 しかし、サービスが付属しています むしろ不吉な警告。 もしそののでご注意ください あなたの話された言葉は、 個人情報や機密その他 情報は、その情報 キャプチャされたデータの間になります そして第三者に送信​​される。 それを得たか。 個人情報や機密言ってはいけない お使いのテレビの前でもの。 だから、これは本当のために実際にある。 そして、それはあなたかどうかを確認するためではないのは難しい テレビ用ベストバイなどに行く これらの日。 彼らはいくつかの方法で、すべてのスマートだ。 そして、彼らは取得している 賢く、creepier。 そして、彼らは単にデータを収集している 私たちが話をした方法で、 その後、HTTP経由でアップロードするか、 一部のサーバーにいくつかの他のプロトコル。 だから、これは楽しい記事であった このオンラインウェブサイトで ここで、これは話を 特定のバグや誤解コード 私たちは実際に結び付けることができていることを 先週の議論に。 したがって、この見出しのようにだった 以下の、物語はここに、 ジョシュBreckmanはのために働いた 契約を上陸させた会社 コンテンツ管理を開発する システム、またはそれらが呼び出さだとしてCMS、 かなり大規模な政府のウェブサイトのために。 関与プロジェクトの多くは コンテンツ管理システムを開発 従業員がなるように 構築し、維持することができる 刻々と変化する 自分のサイトのコンテンツ。 観光のためにかなりよく行きました ライブ行く数日後。 しかし、6日目に、物事はそれほどうまくいった。 上のコンテンツのすべて ウェブサイトは完全に消えていた。 そして、すべてのページがデフォルトにつながった、 コンテンツのWebページを入力してください。 おっと。 ジョシュはに呼ばれた 調査し、気づいた 特に厄介その1 外部IPアドレスは持っていた になっとのすべてを削除 システム上のコンテンツ。 IPアドレスが属していなかった 一部の海外ハッカー曲がっへ 便利破壊に 政府の情報。 それは、googlebot.comすることを決議 Googleの非常に自身のウェブクロールスパイダー。 おっと。 研究のビットの後にスクランブル 周りnoncorruptバックアップを見つけるために、 ジョシュは、問題を発見した。 ユーザーがコピーしたと 1からいくつかのコンテンツを貼り付ける を含む別のページ、 ハイパーリンクの編集 ページのコンテンツを編集します。 通常、これはではありません 外部ユーザからの問題だろう 名前とパスワードを入力する必要があり、 しかし、CMS認証システム、 ログインシステム、 考慮されていませんでした 洗練されたハッキン​​グ グーグルスパイダーのテクニック。 おっと。 結局のところ、Googleは クモは使用しません それができることを意味し、クッキー、 簡単のためにチェックを回避 falseに設定されたCookieに記録されます。 それはまたに注意を払わない JavaScriptは、これは通常どおり プロンプトとユーザをリダイレクト 誰がログインしていません。 しかし、すべての従うん それが見つかったすべてのページ上のハイパーリンク、 を有するものを含む タイトルにページを削除します。 おっと。 だから、これはそれ以上において何を意味している テクニカルしかし、かなりアクセス可能な用語? それはちょうどことを意味します 彼らのウェブサイトを通じて、 彼らはこの1とは異なり、URLをなかったこと あなたは7を設定し、問題に表示されることがあります。 問題でリコールは7を設定 または問題で知っている7を設定 あなたが挑戦していること、 とりわけ、 ユーザーに代わって株式を売却する。 しかし、方法によって、その機能を実装 のユーザーのハイパーリンクを経由して取得 インターフェース、おそらく しない賢いアイデア あなたのサイトが何らかの形であれば理由 アクセス可能ないずれかの人間による 誰が周りにクリックするか、または買うだ Googleのスパイダーやボットなどの 彼らが呼ばれているようにそれはちょうどだ インデックスにしようとしてウェブをクロール 検索エンジン、ウェブ、 彼らは非常に簡単にできた URLのこの種を取得経由ヒット。 そしてそれは、機能的だ 同等に、この場合には、 グーグルの全株式を売却。 今率直に言って、それは完全だ 愚かな、そのCMS 使用するJavaScriptとクッキー ログイン·システムを実装する として、そのサーバ側をしていない 君たちはPSETでやると意志7-- 现在があります file--いつも、いつも、 常にセキュリティがあるべき サーバ側で行われ、 ないクライアント側で、このためなど 記事は示唆しているとあなた自身かもしれない それは、いくつかの点で参照 、ユーザにとって些細な良いか悪いか、 単にJavaScriptをオフにする クッキーは言うまでもありません。 だから、あなたの毎日WTFです。 1、より多くのものがあります だけの種類の怖いです、 私はあればそれを言及します 人生の教訓としてのみ。 あなたがアプリケーションを使用するたびに Snapchatなどのように呼び出す それはこれらの写真だけ続くと言う 5秒、10秒、またはその他もろもろ。 彼らは、つまり短命だ 絶対にしない場合。 デジタルで、方法はありませんように、 ビデオのいくつかのフォームを実装するために、 または、画像、またはテキストの共有など そのもう一方の端の受け手 何とかデータを保存することはできません。 最も素朴な方法で、誰 自分の携帯電話を取ることができる。 そして、彼らは10秒のウィンドウを持っている いくつかのスナップを見ながら 単にいくつかの他の電話を取るために 明らかに、それを撮影する。 だから、保存することができます デジタルで何かそのように。 皆さんの中に取る方法を知っている お使いの携帯電話上のスクリーンショット。 実際には、あなたがこれを知らない場合は、 、少なくともSnapchatを実現 そして私は他のと思う アプリケーションこれらの日、 少なくとも、もしあなたを伝える 受信者が実際にあります あなたの画像のスクリーンショットを撮影し。 しかし、さらに悪いことに、これはsnappeningだった、 誰かが最近それを造語として、 ここで、約10万 スナップはリリースされていた トレントファイルと呼ばれるもので さまざまなウェブサイト上で、最終的には。 これらは全体の束を含んでいた プライベートメッセージや投稿の。 それは、それらのほとんどは良性判明 あなたが期待するかもしれないものではないので。 しかし、人々は持っていたので、 サードパーティのウェブサイトを使用し、 彼らのSnapchatでログイン ユーザー名とパスワード、次に 彼らのスナップのすべてを保存する この第三者のウェブサイト上で。 そして、それは、その第三者だった ハッキングされたウェブサイト、 これだけで、誰かが方法を考え出した意味 それらの画像のすべて10万プラスを取得するには 自分のハードドライブに その後の共有のため。 率直に言って、ここでも、それはソートだ 愚かなことSnapchatの そのような方法で実装されている 第三者が傍受の並べ替えることができます データとそれはあなたに縛られないことだ 電話機上で動作する独自のアプリケーション。 しかし、ここで、あまりにも、これらのことを実現 物事は、驚きであなたを捕まえるべきではありません または少なくともそこにすべき ここでの人生の教訓である。 あなたが技術的にたい場合 詳細は、そこにそのURLにアクセスしてください。 それは、今日のスライドであります。 すべての権利、上の任意の質問 CSでの今日の人生の教訓? その電源をオフにします。 まったく何? まったく何? 私がチェックする多くの人々を持っている 今ではSnapchatか何か。 すべての権利なので、SQL、 構造化照会言語。 それではこれをラップしてみましょう。 また、たとえ 私達はちょうどスクラッチしている この表面 言語は、私たちはあなたにあげる 言語の十分な PSET 7の形で あなたは、いくつかに取り組むことができるように、 かなり共通の機能。 しかし、いくつかありますが実現 私たちはあなたのことを必要としないもの、 しかし、彼らはするつもりだ 重要な最終的なプロジェクトを来る 確かに実際作る来る 実際のユーザーとウェブサイト この設計上の決定です。 それは内と判明 MySQLデータベース、あなた のような選択肢の束を持っている あなたの列のデータ型 と他のものは、あなたも持っている いわゆるストレージの選択 すべてのデータのためのエンジン、 ファイルシステムの種類、 あなたが精通している場合には、 すべてのデータのために。 どのような形式では、最終的に格納されている? そして、最も一般的なのは、おそらく、されている MyISAMとInnoDBは、技術用語 我々は唯一気だろうと 1が持っている限り 一つは持っていません 以下の機能。 あなたが持っていると仮定し 少し寮の冷蔵庫。 そして、あなたとあなたと仮定する ルームメイト、この冷蔵庫を共有し、 たとえばミルクの本当に好きです。 これは、実際には、どのように 物語は帰り道、私に言われました 私はコースを取った日に CS 161オペレーティングシステムと呼ばれて 同様にこのトピックを探ります。 だから、この冷蔵庫を持っている。 あなたは牛乳の外出。 そして、あなたはあなたのルームメイトの、帰宅 まだクラスまたは何で、 そしてあなたは私が行くよ決める 外に出て、いくつかの牛乳を得る。 あなたは冷蔵庫を閉じるように、ロックアップ 寮の部屋は、通りの向こう側に行く CVSやどこ、とgetへ 行にいくつかの牛乳を購入する。 一方、あなたのルームメイトは家を取得します クラスから、寮の部屋に入った、 、冷蔵庫を開いても実現 ooph、私たちは牛乳の外出。 そこで彼または彼女が閉じ 冷蔵庫とその後起こる 他のCVSに移動するには、 であることを起こるもの 1ブロック先に他のCVSから 広場で、ラインに入った そこにいくつかの牛乳を得るために。 さて、もちろん、数分 後で、あなたの両方が、取り戻す 可能なすべての最悪 成果が起こっている。 あなたの両方は、牛乳を持っている。 そして、あなたは本当にありません 牛乳のような多くのこと。 ので、それらの一つだけである いくつかの点で酸味に行く。 だから今は、過剰な量を持っている 冷蔵庫に牛乳のすべての理由のため? [聞こえない] DAVIDマラン:ええ、あなたはしませんでした 何らかの形で相互に通信する あなたはミルクを得ていたこと。 最も単純な中のSO 人間界での方法、 どのようにこの愚かを避けるかもしれません そのような出来事からシナリオ あなたは一つだけで終わること。 それらをテキスト、はい良い。 しかし、どのように他? ポストイットノート。 DAVIDマラン:付箋。 通信の任意の形式 それはあなたのルームメイトに伝えます ミルク用の冷蔵庫に入っていません。 私は自分自身で補充に行くつもりです。 だから、何とか必要 このリソースをロックします。 だから我々は、我々は一種の缶this--行うことができます 物語を台無しとCSストーリーに変わる それとして同じようにと考える いくつかの値を格納する変数。 そして、今、 牛乳の値は、ゼロである あなたはしたくないもの その変数を検査するルームメイト その後、決定彼または彼女自身を作る その変数の状態に基づいて あなたがの過程にいる場合には その変数の状態を変更する。 だから我々のSQLの行のいずれかを PSET 7仕様であなたを与える ここにこの1である。 そして、我々は巨大なを費やすことはありません それについて話した時間。 あなたがしようとしている場合しかし、それは、結局のところ CS50ファイナンスにいくつかの株式を購入する あなたがすでに持っていること あなた、いくつかの株式 番号を行うことができるようにする 瞬時に一緒に物事の。 次のことができるようにしたい 効果的に、高レベルで、 私がしたい場合は、すべての権利を確認する 無料のより多くの株式を購入するために、 ペニーストック我々 スペックで約話し、 私が最初に確認したい どのように多くの株式を私が持っている。 そして、それは5だと仮定します。 そして、私がしたいとします 私は最終的に、10より多くを購入 株式の15株を持っていると思います。 だから私は2質問をしなければならない。 変数の状態は何ですか? 行の状態は何ですか? 私は現在、どのように多くの株式を持っていますか? その後、先に行くと、それを更新したいと思います。 だから、アナログだ あなたが行を確認することを牛乳で、 その後、あなたはそれを更新したい あなたは10株を購入したい場合のため、 あなたが変更したくない 10行、あなた 5にそれを変更したい プラス10または、もちろん、15。 このコード行は、ことが保証さ これら二つの概念のアイデア 一緒にまたは全く起こる。 他のユーザーを含め誰もいない、 同じウェブサイトにログインしたユーザーを、 何とか中断することができます 行のチェック と行の更新、 あなたは意志あれば選択してアップデート。 と構文は、スーパー明白ではありません しかし、長い間、この1行は、それがされている、 これらの二つの操作が保証 変数をチェックしたり、行をチェックする そして行がアトミックに起こる更新します。 ああ、ここで我々は再び行く。 自分の携帯電話上のテキストメッセージ。 それでは、このαを作ってみよう もう少し具体的な。 あなたがわからないと仮定する 冷蔵庫を実装 あなたが実装していない PSET 7実際の銀行、 またはATM、現金自動預け払い マシン、それによってあなたを何とか 力を与えることができるようにしたい ユーザーがお金を転送する 一方の口座から別の。 [OK]を、しがみつく。 私はあなたに感謝し、今これをミュートするつもりです。 だから我々はお金を移動したい 1口座番号から 別のアカウントに 番号は、具体的に100ドル。 だから、これは任意の一種である たとえば、それによってあなた、ATM、 2 SQLを実行したい場合があります クエリは、1アカウントから差し引く、 そして、他のアカウントに追加します。 しかし、あなたはこれらのことを確認したい 2行は起こらない、またはまったく両方。 あなたが何かをしたくない 中断ばかり。 あなたは、いくつかのスマートな悪者にはありません 何とかバンク·オブ·アメリカに立っ 前面に2台のATMを持つ 彼の何とか ソートの中で入力する 同時にコマンド、 うまくいけば、代わりに200ドルを控除しようとしている 100ドルと貸方だけ持つ100ドルの。 要するに、あなたはこれをしたい あなたが期待するとおりに動作します。 そして、あなたのやり方 SQLデータベースでこれです あなたは何でそれを包む トランザクションと呼ばれる。 文字通りSQLで、あなたはCS50のを呼び出すことができます 引用引用終わりスタートでクエリー機能 トランザクション。 その後、任意の数を実行することができます 後続のSQLクエリの、 それらのどれも取らない データベースへの影響 あなたは、クエリ引用引用終わりを呼び出すまで 再びPHPを使用している場合、コミット。 そして、このように、あなたはそれを確保することができます あなたが持っている場合でも、1,000人のユーザーすべて あなたのデータベースを打つ 同時に、SQL これらのことをお約束します つのクエリは次のようになります 次々権利を実装しました。 だから、過剰の終わらない 牛乳や間違った量、最終的には、 お金の。 だから、これを覚えておく、 PSET 7用そんなにいない しかし、最終的なプロジェクトのための あなたが実際にしている場合は、 データを移動しようとしている テーブル全体であなたがここかもしれないとして。 しかし、おそらく、よりシンプルで 例を理解することは明白 ここにこの1である。 そして誰かがについて教えて電子メールで送信 このちょうど先日 彼は同じようなオンラインの何かを見たとき。 私の知る限りそのように、ピン方式 この攻撃に対して脆弱ではありません。 それも使用している場合は、私は全く分からない フードの下にSQLデータベース。 しかし、ここでそれを使ってみましょう 議論のために。 ここではその画面です ハーバードの人々は傾向がある 自分でログインしたときに表示する ハーバードのID番号とそのピン。 とピンシステムがあったと仮定し PHPで実装され、MySQLで データベース、誰かコード 年前に書かれたかもしれない 次のようになります。 まず、aは宣言する ユーザ名と呼ばれる変数。 そして、ちょうどからそれを取得する のPOSTスーパーグローバル。 その後、別の変数を取得する パスワードと呼ばれ、同じことを行う。 そして、ちょうど実行 ここで、この長いクエリ、 ユーザーがどこからスターを選択 ユーザー名は、そのような、そのような等しい とパスワードは、そのような、そのような等しい。 カーリーていることに注意してください 私がここで使ってきた中括弧 ちょうど行く、PHPに意味 先に代替 これら二つの値 右が変数。 彼らは厳密には必要ではないだが、 それらは微妙な構文エラーを回避する傾向がある。 だから、これは完全に見えます 一見正しい。 そして、それはある。 あなたが実装することもできます このようにピン方式。 しかし、スーパーと仮定 スマートかつ悪質な生徒 彼または彼女のピンなどの入力これを。 だから私は弾丸を削除しました ここでモックアップにサイン、 そして私は実際に明らかにしてきた どのような彼または彼女はタイプすることがあります。 そして、それは少し奇妙だ。 しかし、どのような潜在的にあなたに飛び出す ユーザの入力に関する気になる、 あなたは何見当がつかない場合でも、 SQLインジェクション攻撃は意味します。 なぜこれがちょっと怪しいものですか? 何それ? [聞こえない] DAVIDマラン:またはある 少し疑わしい。 実際には、それは、SQLからキーワードです。 だから、良い前兆はありません。 そこにあるという事実 これらすべての単一引用符 実際にthere--、最も簡単なの一つ 一部のデータベースを破るための方法 オライリーのような名前を入力することである それはそれでアポストロフィを持って 人間が書いたかした場合のため 舞台裏コード を考慮していないことがある ユーザーの中に単一引用符かもしれない 入力、彼または彼女が使用していると 自分のコード内の単一引用符、 悪い事が起こる可能性があります。 実際には、さらに悪いことに、これを検討してください。 これは、再びコードだった場合 ハーバード年で、その誰か 前ピンのために書いた システム、何に注目してください 置換GETに約 ユーザ名とパスワードの入力 再度ユーザーがいる場合 自分のユーザ名としてskroob その後、一つ、二つ、三つ、四つ、五つ、 1等号引用終わり引用符または引用 引用1。 とキー何に気づく ここにユーザーがいないです 自分のパスワードを起動または 引用とのピン。 そして、彼らはそれを終了していない 引用付きなぜなら、彼または彼女 と仮定されている場合 プログラマは、とてもシャープではなかった 彼らはそれらを持っているつもりされている 自分のコード内の単一引用符。 だからここのコードです。 と置換すること 今これです起こるかもしれません。 そして、私は何を強調してきた そのユーザは入力した。 だから、前、後。 そして今、穏やかに気になる何に気づく このSQLコードの右半分はどうですか? それは、確かに、もう少し複雑だ 私たちが見てきたクエリより。 しかし、これはおそらくできない あなたがいるなら良いこと 選択され、選択の星を、と言って ユーザーの表からすべて ユーザ名はskroobに等しいと パスワードが1つ、2つ、3つ、4に等しい 5または1 1に等しい。 論理的な含意は何ですか おそらくその最後の節の? それはちょうど、常に本当だ。 そして、我々はある種の推測しているので、 または試行錯誤によって考え出し そのプログラマは誰 書いたこのコードはしませんでした ヒトまたは悪い人を予想 同様に、単一引用符を入力し、 我々は構文的にすることができます SQLクエリを完了 無意味な何かを持つ しかし、何かその 文法的に間違っています それは常にtrueと評価されます。 したがって、このコードは、応答するために使用されている場合 質問trueまたはfalse必要があります このユーザーは、通過させる 答えは常に明らかになるだろう 真であると、これは常に起こっているので、 データベースから何かを選択する もちろん、一つは常に1に等しいからである。 だから、解決策は何ですか? さてPSET 7で、実際に私たち すべて一緒にこれを避ける。 私たちはあなたのクエリ機能を与え、私たち 疑問符を使用することをお勧めします プレースホルダとして、類似した printfのの%sに精神で、 しかし疑問符約キー何 あなたが実際に通って読めばここにある のfunctions.php、ここで私たちの クエリ機能は、実装されている これらのクエスチョンマークがエスケープされ、 それによって潜在的に危険なもの 単一引用符をになっているように エスケープ単一引用符に変換する。 だから、これは何です 本当にあれば何が起こっ CS50のクエリ機能や、任意の数を使用 サードパーティのライブラリを無料のもの 同じことを行う。 緑色で、この場合は問題ではありません ユーザーは、単一引用符で入力している場合 クエリ理由 私たちが書いた関数である 前にバックスラッシュを追加しよう そのような危険な引用。 だから、これはでは、ありません 事実は、合法的になるだろう。 これは見て狂っを入力するようなものです もちろん、行くのではないパスワード skroobの実際のパスワードであると。 だから、CS50用の持ち帰りは、1である 絶対にいつも何かを使用 CS50のクエリ機能のような または基礎ライブラリ、 これは、PDOと呼ばれるように起こります。 しかし、決して、決して、 このようなコードを実行することはありません エスケープやスクラブなし 彼らはあなたの入力を言うように。 そして、あなたは、おそらくいくつかの点で意志 このようないくつかのウェブサイトに出くわす。 実際には、ケースであると思われる 場所で、空港やホテルでのような 彼らは、無料Wi-Fiを持っている場所 あなたがするにはログインする必要がありアクセス、 これらのウェブサイトは常にある 恐ろしく実装しました。 だからホームエクササイズでの楽しみの一種、 ていない悪質な目的以上 道路上の楽しみ 運動、ただタイプすることです アポストロフィ、一重引用符、 いくつかのウェブサイト上のフォームに そして何が起こるかを参照してください。 そして、サーバがクラッシュしたり与えた場合 あなたのエラーメッセージのいくつかの種類、 それは非常によくものであってもよい 誰かがこれを予期していません。 そして、あなたは、適切に警告すべき 当局とはそれ以上進みません。 だから今あなたたちがうまくいけばべき ここでもう少しオタクユーモアを理解しています。 [笑い] DAVIDマラン:あなたがオタクだ知っている。 次のいくつかのために 年、あなたは覚えているだろう 誰が少しボビー表される ここでこの漫画の理由。 だから我々として覚えておく コンテキストスイッチ1最後の時間 JavaScriptに今日。 私たちは、比較的少ない費やしてきた PHPの構文の時間 それは実際だから Cに似たスーパー そして素敵なことに、JavaScriptがあまりにも C言語の構文に似ているスーパー 同様に我々が表示されますように ちょっと、我々はよなど 特に、今週後半を参照してください。 あなたはこの言語で何ができるか、 しかし、すべてのより強力で、 特にAPIと。 しかし、最初のクイックツアー。 JavaScriptで、ありますので1、 いいですなし主な機能はなく、。 PHPと同じように、あなただけのコードを書くことができます。 条件は次のようになり。 とブール式かもしれない このようにするか、このように見える。 スイッチが存在し、それら 次のようになります。 4つのループは次のように見えます。 ループは次のようになりながら。 やる時々このように見える。 その後アレイは、のように見える これはPHPと非常によく似ています。 しかし、JavaScriptはあなたの中にことに気付く ドルとしない変数を宣言 ていないデータ型ではなく、文字通り、署名 その前に変数のVARを言って。 それはあまりにも緩く型付けされている それにはタイプがあり、 しかし、あなたはそれらを明示的に宣言しない。 その後の文字列は、 インスタンスは、見えるかもしれません このように、その文字列 この場合、複数呼び出される。 その後オブジェクト。 そして、これらの私たちは、長い前に、より多くのを見ることができます。 その目的とするところは、おそらくの一つです 最も一般的に見られるデータ構造 JavaScriptでベース プログラムはそれができるため、 あなたは、任意関連付ける キーと値のペアだけ PHPの連想配列のように ちょうどあなた自身のハッシュテーブルのような 私たちが実施されるように、または試みる 数週間前。 それでは、実際に何を見てみましょう 我々は、JavaScriptで行うことができます。 特に、これは 特徴の洗濯物のリスト ブラウザは、あることを持っていること 私たちはJavaScriptをフックすることができます 以下の方法でウェブサイトへ。 JavaScriptは、しばしば使用されている クライアントサイドのスクリプト言語。 これは、コンパイルされていない。 それはあまりにも解釈されます。 しかし、実行されているPHPとは異なり、 サーバ上で、ウェブサーバにおいて、 または深いの内側 クライアントは、JavaScript そのことで異なる 通常はブラウザで実行されます。 ので、任意のJavaScriptコードは、あなたが書き込みを開始 PSET 8、またはあなたの最終的なプロジェクトのために、 あるいは、現実の世界で一般的に起こっている 絶対に、サーバ上に保存する ドットHTMLやドット内 JavaScriptファイルのためのJS。 しかし、ブラウザが起こっている そのJavaScriptをダウンロードする クロームの独自のインスタンスにコード、 またはIE、またはFirefox、または何でも。 そしてコードは、実際に取得する予定です あなた自身のブラウザの内部で実行。 ただ、これはよりリアルにするために、 それでは、具体的な形でこれを見てみましょう。 私たちは、このコードが何をするか分からない 本当にそれを読まず。 しかし、私はFacebook.comへ行こう ログインせずに。 私は要素を点検しに行くことを行こう、 それでは言わせて、ネットワークとページをリロード。 そして、我々はsee--よ私はリロードシフトしましょう 新しいに対するすべての要求を取得するためのページです。 そして非常に最初の 私が見るファイルは、CSS、CSSです。 ここでは最初だ JavaScriptのファイル、および私が持っている ここにこれが何を考え、ない JavaScriptコードの一部である それはFacebookを利用して駆動します。 それも、本当にありません に拡大するが明らかになった。 それはまだ同じくらい無意味です。 しかし、あなたはあります、でも、下方に表​​示されます これらのJavaScriptファイルの一層。 おっと。 それは、pingです。 それでは少しダウンして行きましょう さらに、さらに、さらなる。 1があります。 1があります。 1があります。 そうであってもFacebookのも、背後にある シーンは、PHPの一部で書かれている そのとFacebookの独自のバージョン、 JavaScriptの膨大な量があります。 実際には、任意の あなたがFacebook上でやるチャット、 インラインタイムラインの更新のいずれか それは、リアルタイムですべてのことが起こる JavaScriptによって駆動される。 うん? 読者:私はわからないんだけど これは、フェイスブックであれば、 私はFacebookが開発していると考え 独自の社内のコード言語? DAVIDマラン:彼らはやった。 私はの分散を言うだから、なぜです 実際に彼らはPHPと呼ばれるヒップホップ そのようなときに機能を追加 マークは、Facebookを実施し、 それは、PHPで書かれています。 その種の推移している フロントエンド言語の一種 彼らは多くのために使用すること 彼らのコーディングが、それの だ言語ではなかった 数十億に特によくスケール 人々の。 だから彼らは自分を追加した 舞台裏の改善。 そして、彼らは、任意の数を使用 他の言語の 各種情報のため インフラストラクチャ。 そうです、それはの分散だ 我々は今、PHPとして知っている。 それでは見てみましょう 例のカップルで、 私たちはここにJavaScriptを使用する方法の。 今日のソースコードでは、我々が持っている ファイルの束、そのうちの最初の、 それではDOMゼロと呼ばましょう。 以下のようにDOMゼロに見えます。 私はこのディレクトリに行こう とdomzero.htmlを開く、 のトップは、doc型を持つ 宣言は、ここで言っては、HTML 5が付属しています。 そして今、ここにHTMLタグです。 ここではheadタグです。 そして、ここで何が新しくなったのか、今日の。 我々は現在、スクリプトタグを持っている ページの頭の中。 そして、これは明らかにしない 非常に少ない、しかし予告 私が定義したので スクリプトは、JavaScript。 そして余談ですが、この年として 一般的な誤解である、 JavaScriptは絶対に何もしています Javaの言語で行うには あなたのいくつかは可能性があること APCSで学んだ。 それは、マーケティングの以上であった 何よりもの事、 のJava年前の便乗に乗って。 とは何のが、JavaScript、何もしない Javaの、ちょうど同じように、とうるさく、 紛らわしい名前。 だからここにあなたが関数を宣言する方法です JavaScriptで、文字通りの機能を言う、 その後関数の名前、 それがかかることがあり、任意の引数、 ちょうどPHPで好きです。 JavaScriptは、ほとんどの一つで判明 存在迷惑な機能はアラートです。 これはその小さなウィンドウです ポップアップし、警告を表示します いくつかの情報である。 これは、一般的には眉をひそめだ。 しかし、私たちは私たちのようにそれを使用します ここで最初の練習。 JavaScriptをいくつかの機能に注目してください。 単一引用符や二重引用符 実際にはもう問題ではありません。 単一引用符と二重 引用符は交換可能で、 C言語で、あなたが使用する必要があり、一方、 文字列のための二重引用符、 そしてあなたは、単一の2を持っている 文字のために引用している。 JavaScriptの世界では、 多くの人々は、ほとんどの人 文字列は一重引用符で囲んでください それは文体のことだという理由だけで。 しかし、ここでプラス演算子は何ですか、 その私たちは前に見たことがない? 聴衆:連結。 DAVIDマラン:連結。 だから、Cがあってもこれを持っていません。 PHPは、ドット演算子を持って これこれを行います。 JavaScriptは、プラス演算子を持って これ紛らわしいだけでJavaのようなものです。 今、何がここに起こっているのですか? ここで基本的なだからここだ その絵の理解 私たちはカップルを投げた 日前戦場に出る。 我々は、単純なを持っていたとき覚えている HTML形式のバージョン当ページ それだけでHello Worldの、言った。 そして、我々は木を描いた 右側に、その 長方形や線の束を持っていた 家系図のようにそれらを接続する。 だから、いわゆるDOMだ またはドキュメントオブジェクトモデル。 そして、それはあなたがアクセスできることが判明 構文とそのツリー内の長方形 次のような。 あなたは、文字通りある文書を、言う JavaScriptで特別なグローバル変数 機能を有するプログラム あなたがアクセスできること、それに関連付けられた 構造体に似ていますが、単純に ドットと、関数の名前を言う、 IDによって要素を取得。 私が取得したい要素がある どうやら引用終わり名前を引用。 そして私は、その値を取得したい。 今、私たちは先に自分の取得している。 私は何でもわからないんだけど これはすべてについてです。 HTMLへレッツ早送りに 超簡単ですページ。 私が定義したことに注目してください Aここでダウンして形成する。 私はそれをユニークに与えてくれたに注意してください 私たちが使用していないしたにも関わらず、ID、 この属性の前に。 しかし、これは、HTMLに存在しています。 あなたが一意にいくつかのチャンクを識別することができます このような識別子を持つHTMLの。 通知は今this--は、HTML判明 その洗濯物のリストごとに、サポートしています 先ほど、全体 イベントハンドラの束。 そして、このイベントハンドラは、提出に述べています。 このユーザーの提出について フォームは、次のコードを呼び出します。 そしてそのコードは起こっている と呼ばれる、または実行される まさにこの、ギリシャ語である この関数は、戻り偽続く。 他のすべてがすべき かなり精通している。 ここでtext型、の入力がある IDは、この場合には、名前になるだろう。 私たちは、実際のname属性を持っていない このtime--と送信ボタン。 だから、結果のページは、このようになります。 そして結果の動作、 あなたは、このようになり、表示されます。 ページそれローカルホストこんにちは、言う デビッド、ほとんど美的 ユーザーに挨拶する方法。 しかし、実際に何が起こっているのですか? まあ、これが何であるかを検討してください。 これは、テキストフ​​ィールドである。 とによると ここでHTMLは、私はそれを与えてくれた 一意の識別子 引用引用終わりnameと呼ばれる。 一方、私が言ってきたとき ユーザーがこのフォームを送信 Enterキーを押すか、クリックして登録 ボタン、グリートという関数を呼び出す その後falseを返します。 それでは逆のものを考えてみましょう。 私はSubmitをクリックしたときに、注意してください このページのURLは変更されません。 ブラウザのアイコン スピニング起動しませんでした。 私はどこにも行かなかったし、それはだ 文字通り、私はFalseを返すと言ったので。 Falseの短絡や停止を返す フォームのデフォルトの動作。 その後で私たちを残しように この1最後の質問。 グリートは何をしますか? さて、どうやらグリート 呼び出された関数を呼び出す アラートは、1を渡し だ長い引数 一緒に連結した結果 部分文字列の束、コンマスペースこんにちは、 これは返し何でも。 だから、文書はグローバルのようなものです そのツリーのルートに変数、 特殊な関数を呼び出し、 そうでなければ、今の方法として知られている。 だ機能 されている変数の内部 代わりに、関数のメソッドを呼び出した。 だから、IDによって要素を取得。 あなたはどのような要素を行う そのIDで取得したい? 引用終わり名前を引用し、 その後、具体的値。 換言すれば、そのコードは、単に IDが名前であるテキストフ​​ィールドを見つける そして、その値を取得します。 だから私はこれを変更した場合 そして、代わりにダビデのデーヴィンを言う そして我々は今、[送信]をクリックします デーヴィンための挨拶を持っている。 ので、すべての罰金と良いすべての権利、。 しかし、我々が作ることができるかどうか見てみましょう このほんの以来少しクリーナー これは次のようなコードを書くこと 一般的にはひんしゅくを買うされようとして。 これは恐ろしい見に行くされている。 しかし、最初は何ですか あなたがここで注意違い 他にもこのバージョンで DOMのいずれかに変更することの名前は? 構造的に異なる見えるもの 他の対このことについて? うん? 読者:上のフォームです 今スクリプトの先頭に? DAVIDマラン:ええ、フォームが上になる いくつかの好奇心の理由で、スクリプトの。 だから、最初のことだ それはあまりにも、私に飛び出し。 そしてありがたいことに、少なくとも、 この部分は同じです。 そう思えるだけだ 異なるようにすることはこれです。 だからここにきちんと何だ JavaScriptの約2。 そして、それはそれは一生懸命になります 一目見ただけで理解して、 特に最後のプロジェクトの場合のために あなたは、オンラインのサンプル·コードを見ている それはいくつかに集約 基本的な構文上の特徴。 ここで再びことである グローバル変数文書。 ここで再びそのメソッドや関数である それは、IDによって要素を取得すると言います。 今回私がしたい デモと呼ばれるIDを取得。 それはどこにある? それは明らかだね ここでは、フォーム自体。 そして今、私があれば、明らかにことに気付く その木からそのノードを取り戻す フォームを表し、 それ自体ではなく、テキストフ​​ィールド、 それがあることを、そのフォームが判明 ツリーからノードや長方形、 我々はプロパティを呼び出すだろうものを持って、 非常に、非常に、非常に似て Cの構造体への精神でそれはちょうどだ この矩形の内部データメンバ。 だから私は、フォームを持っている ここで、私は取り付けています、 または私はその送信時に、割り当てるよ ハンドラまたはむしろ上のプロパティを提出 次の関数。 そして、これは、はるかに、クレイジーです これまで構文的なもの。 これは、JavaScriptでかつで判明 C言語でそのことについては、PHP、そして率直に言って、 我々はそれをしないにもかかわらず、次のことができます 無名の、匿名、またはAKAラムダを追加 名前を持たない関数 それにもかかわらず呼び出すことができます。 それでは、私はここでやっている私が割り当てているされている この上で、プロパティを提出した 、私のDOMツリーのこのノードの内部にある 関数、関数ポインタ可能ならば。 その機能は全く持っていません 名前が、それはしません 問題我々が表示されますので、 一瞬でそれを呼び出す方法。 この関数が呼び出されると、 このコードは、その後、実行されます 偽は、直前のように返されます。 しかし、私は何をやったかに気づく。 この時点で 物語は、私はフォームを持っている。 これは、デモと呼ばれる固有のIDを持っている。 ここでダウン、私はスクリプトタグを持っている それには、次のコードを実行します。 これは、そのノード内に取り付け それへのツリーは、提出日です プロパティここにこの機能。 そして、ちょうどブラウザがどのように動作するかの性質によって、 私は今、提出またはEnterキーを押します]をクリックすると、 その関数が呼び出さ取得する予定です。 それが原因名前を必要としません heckが、それが呼ばれるもの気遣う。 それは今までに取得するつもりだ唯一の時間 私はフォームを送信するときであると呼ばれる。 私のための必要はありません、 人間の開発者、 実際にどこか他にそれを呼び出します。 今ちょうどティーザーとして、そのかのように 十分な曲げ気にしていなかった、 私たちも、これを行うことができます 使用して、より不可解に見える 超人気ライブラリはjQueryを呼んだ。 事実jQueryとJavaScriptで しばしば混同されている。 そして私たちが水曜日にやることはスタートです この言語と、これ​​らのライブラリを使用して ますます非同期構築する および動的なアプリケーション 地図のようになっ アプリケーション、アプリケーション それが本当でウェブページを更新 時間、ずっとFacebookやGchat様 やる、もはやに自分自身を閉じ込める GETまたはちょうど郵便で提出打撃 一人で。 だから私は水曜日にお会いします。 [音楽再生]