>> [MUSIK BERMAIN]
>> DAVID MALAN: Ini adalah CS 50, dan ini adalah permulaan minggu sembilan.
Dan apa yang kita fikir kita akan lakukan hari ini bukan hanya menutup bab pada minggu lepas
material yang kami fokus pada pelayan sisi pemrograman web dengan PHP dan SQL,
beberapa hal pangkalan data.
Kami akan bercakap tentang sedikit hari ini keselamatan dan kemudian
peralihan kepada pengaturcaraan sisi klien bahasa yang dikenal sebagai JavaScript.
Tetapi pertama, beberapa penebusan.
>> Anda mungkin ingat bahawa pada Hari Rabu, aku berangkat
menulis sebuah laman web yang mengambil dalam input pengguna
oleh HTML sebuah bentuk yang kemudian disimpan bahawa nama-nama input pengguna, telefon
angka, dan telefon bimbit operator dalam pangkalan data.
Dan kemudian saya memiliki perintah yang sedikit naskah baris ditulis dalam PHP
yang sepatutnya untuk beralih lebih baris dalam pangkalan data
dan menghantar mesej teks.
Walaupun beberapa, beberapa percubaan, kami tidak mendapat kerja yang pada akhir.
>> Jadi aku menghabiskan minggu ini seluruh bekerja pada kode yang untuk mendapatkan kita melewati titik
di mana kita tinggalkan, di mana semua Saya mendapat pada akhir Rabu
adalah mesej teks ini daripada Margo saat aku berjuang,
diikuti dengan mesej teks dari yang lain rakan sekelas, Anda telah mendapat Daud ini.
Diikuti dengan yang satu ini, hebat menggalakkan.
Terus, sangat membesarkan hati.
Saya hampir mendapatkannya sehingga then-- dan itulah nota kami berakhir pada hari Rabu.
Dan kemudian benar-benar mungkin kegemaran saya, seketika kemudian, datang.
Damn Live Stream.
>> Jadi hari ini, kita memperbaiki ini dengan cepat melihat apa yang saya lakukan sejak.
Jadi semua kod ini boleh didapati online dari minggu lepas, minggu lapan,
kod sumber.
Dan anda akan melihat bahawa saya lalui, dan saya benar-benar membersihkan hal-hal sedikit.
Saya memperkenalkan pasangan lain ciri-ciri pangkalan data SQL.
Sebagai contoh, daripada hanya membuat pembawa var char
kerana saya fikir saya melakukan dengan cepat minggu lepas.
Saya bukan ditakrifkan sebagai apa yang dipanggil enum an.
>> Dan sebahagian daripada anda mungkin telah melihat ini seperti kami menjelajahi C. Enum sebenarnya
satu ciri C dimana anda boleh menyebutkan sejumlah besar pemalar
dan menetapkan nilai-nilai automatik, seperti satu, dua, tiga, empat
tanpa perlu nombor kod sulit.
Jadi SQL menyokong yang sama, di mana jika Anda memiliki bidang pangkalan data yang anda hanya
ingin mengambil salah satu yang terbatas nilai-nilai, anda dapat menentukan ia
seperti yang saya lakukan di sana selama empat operator telefon bimbit AS popular.
>> Jadi saya melakukan itu.
Dan saya membuat beberapa perubahan seperti baik, yang paling penting di antaranya
adalah untuk mendapatkan e-mel bekerja kerana ingat, bahawa program ini bergantung kepada yang
umumnya dikenali sebagai e-mel kepada SMS gateway, yang hanya
cara yang mewah untuk mengatakan bahawa Verizon, dan AT & T, dan orang-orang lain menyokong server,
dimana jika ia menerima e-mel, ia bertukar kepada SMS
dan menghantar teks mesej ke telefon seseorang.
Jadi, jika saya melakukan ini dengan betul, di sini adalah suatu bentuk baru dan lebih baik
yang akan bercakap dengan baru dan lebih baik kod, yang
Anda boleh bermain dengan online.
Dan ia diharapkan akan membuat saya bip telefon hanya dalam beberapa saat.
>> Jadi pertama, saya akan menaip nama saya.
Kedua, saya tidak akan untuk melakukan ini kali ini.
Saya akan lakukan Periksa Elemen.
Dan ini adalah hanya perkara yang sedikit jadi saya tidak
membuat jam pasca produksi bekerja seperti yang saya lakukan masa lalu.
Sekarang ada nombor telefon saya.
>> Saya akan memilih Verizon.
Dan di sini, mari kita menghidupkan mikrofon ini di sini dan bertujuan demikian pada telefon saya di sini.
Saya akan klik Daftar, yang harus diharapkan
memasukkannya ke dalam pangkalan data.
Sekarang saya akan pergi ke program baris perintah, yang
recall dipanggil slash dot teks, dan berdoa.
Di sini kita pergi.
>> [Bantingan PHONE]
>> [Tepuk Tangan]
DAVID MALAN: Jadi lebih seronok daripada this-- itu menyenangkan, sudah tentu, jika saya masuk ke dalam.
Tetapi itu lebih menyenangkan, saya fikir, jika kita dibuat salah satu detik filem
di mana seperti sesuatu yang benar-benar buruk yang telah berlaku di dunia,
dan seperti semua NSA rakyat telefon bimbit mulai berbunyi
dengan mesej teks mengingatkan mereka kepada hakikat ini.
Jadi saya fikir kita akan cuba untuk mencipta yang sama di sini,
di mana tidak menggunakan pangkalan data, Saya bukan di muka
menulis sebuah program yang kelihatan seperti ini.
>> Ini adalah sebuah index.php-- dan saya meletakkan kod ini dalam talian
seperti baik yang nampaknya hanya membuat form.php,
menggunakan MVC gaya paradigma yang kita bercakap mengenai dengan lebih terperinci dalam set masalah
tujuh.
Bentuk yang sangat sederhana.
Ia akan akur kepada file bernama here.php melalui pos.
Dan ia nampaknya akan meminta untuk nama, dan nombor telefon,
dan kemudian melalui apa yang dipanggil Pilih menu, itu
akan memberikan sekurang-kurangnya empat operator telefon bimbit AS popular,
dan kemudian membolehkan anda untuk secara efektif mengambil kehadiran dengan klik di sini.
>> Dan di sini pula, akan meminjam beberapa kode dari masa lalu.
Dan jika anda hanya skim ini, Anda akan melihat bahawa terdapat
sejumlah besar pemeriksaan kesalahan.
Tetapi kecantikan yang pada akhirnya adalah bahawa kita tidak bertulis kepada pangkalan data hari ini.
Kami tetap sederhana dan hanya menghantar diharapkan
mesej teks melalui fungsi saya menulis lebih dari beberapa hari yang lalu panggilan
Teks, yang dalam Fungsi. php, yang lagi boleh didapati dalam talian.
>> Jadi jika anda ingin mengambil bahagian dalam hal ini.
Kami tidak akan menyimpan apa-apa.
Pergi ke URL ini di sini dalam masa nyata.
Jangan kirimkan dulu, tetapi mari kita melihat apakah kita dapat memiliki salah satu daripada filem ini
detik-detik di mana telefon bimbit setiap orang mulai berbunyi, mudah-mudahan hanya
sekali tahun ini tidak seperti tahun 2011 di mana ini pergi teruk serba salah.
Dan apabila anda pergi ke alamat tersebut, Anda akan melihat bentuk yang super mudah
bahawa jika anda mempunyai nama, telefon bimbit nombor, dan pembawa telefon bimbit yang
senarai perlawanan di sana, masuk ke depan dan mengisi borang.
Tapi jangan tekan submit dulu.
>> Borang ini akan kelihatan seperti ini.
Pergi ke depan dan menaip nama, nombor telefon.
OOP, ada yang berjalan di depan kurva.
Tidak apa-apa.
OK, semua orang mengisi borang.
Ini harus bekerja pada telefon, juga, jika anda mahu.
Baiklah, pada tanda anda, mendapatkan set, pergi.
Hit sini.
Apa?
Tidak.
Aku bersumpah kepada Allah, saya diuji ini beberapa kali hari ini.
Anda mendapatkannya?
>> [Interposing SUARA]
>> DAVID MALAN: OK, kesalahan pengguna mungkin.
Itu dua orang.
Ini bekerja untuk dua daripada yang beberapa ratus, tiga, empat.
OK, itu bagus.
Empat daripada lima untuk Kebenaran bagaimana.
>> Jadi apa yang baru saja terjadi?
Jadi mungkin, tanpa melihat anda skrin, mengapa mungkin ia telah errored?
Ia mungkin bahawa kami hanya cuba membuat terlalu banyak sambungan
kepada pelayan mel Harvard semua pada sekali dari alamat IP yang sama.
Saya hanya meneka kerana saya tidak mempunyai kemewahan ujian
kod ini dengan beberapa 300 orang-orang di muka
tetapi buat masa ini sedar bahawa yang sekurang-kurangnya harus
mendapatkan pekerjaan yang dilakukan kali ini.
>> Baiklah, jadi mengapa ini semua lebih erat dengan apa yang sedang berlaku?
Yah pertama, yang cepat beberapa pengumuman.
Jadi satu, jika anda ingin untuk menyertai Chang, dan Nick, dan lain-lain di makan tengah hari Jumaat ini,
lakukan RSVP di URL biasa di sana.
Jika anda berfikir untuk menumpukan perhatian dalam atau melakukan menengah di CS,
sama ada anda seorang mahasiswa, atau mahasiswa, atau rendah atau kanan pada ketika ini
dan masih boleh memerah dalam kursus, menyedari bahawa sekolah kejuruteraan
adalah perhimpunan secara percuma Ben dan Ais krim dan nasihat Jerry
Rabu tidak lama selepas kelas ini pada jam 4:00 PM CS bangunan itu
di Maxwell Dworkin.
Jika ini adalah terlalu cepat pada skrin, hanya pergi
untuk cs50.harvard.edu untuk pautan ke acara Facebook
di mana anda boleh melihat maklumat lanjut.
>> Sementara itu, saya fikir saya akan membetulkan satu perkara lain saya melakukan kesalahan pada hari Rabu.
Ternyata bahawa Mark ID di Facebook bukan tiga.
Ia adalah empat.
Rupa-rupanya, dia mempunyai lebih banyak ujian akaun daripada saya ingat.
Tetapi apa yang ini merasa seperti peluang lakukan adalah untuk menarik sebuah URL seperti ini.
>> Jadi ternyata bahawa Facebook mempunyai API, Antara Muka Pengaturcaraan Permohonan,
yang merupakan mekanisme dimana anda dapat meminta data pemrograman
di Facebook dan kembali mesin maklumat yang dibaca, tidak laman web
tetapi teks hanya mentah, sesuatu disebut JavaScript Object Notation.
Dan sebenarnya, jika saya mengunjungi ini URL, dan memperbesar, secara lalai,
ini adalah Mark secara terbuka maklumat diakses.
>> Dan butiran yang menarik di sini adalah hanya bahawa ID
memang, nombor empat, yang saya sedar segera setelah saya melakukan ini.
Anda boleh melakukannya sendiri jika anda tahu nama pengguna Facebook anda jika anda mempunyai satu.
Hanya taip itu atas sana.
Dan semua ini adalah swasta.
Aku hanya melakukan ini walaupun dalam mod inkognito.
Jadi, saya tidak login.
Dan kau melihat aku yang nampaknya adalah jumlah pengguna 6454
di Facebook, yang tidak terlalu buruk hari ini.
Jadi bagaimanapun, anda juga akan melihat maklumat tambahan di sana.
>> Dan aspek yang berguna dari itu adalah bahawa anda
boleh menulis perisian anda sendiri bahawa entah bagaimana mengintegrasikan data seperti ini
ke dalam aplikasi anda sendiri.
Anda boleh memberi kuasa kepada pengguna untuk log masuk ke laman web anda,
tidak menggunakan nama pengguna adat mereka sendiri dan kata laluan tapi mungkin login Facebook mereka
dan mendapatkan maklumat bahkan tentang kawan-kawan mereka,
jika mereka meluluskan, atau serupa.
Jadi ambil perhatian CS50 itu juga, mempunyai beberapa API sendiri,
satu untuk data katalog kursus, ada yang untuk pelukan menu di makan
dewan, semua bangunan dan lokasi
di kampus kita mempunyai API untuk juga bahawa anda dapat permintaan yang sama dan mendapat
data tekstual belakang yang anda boleh mengintegrasikan ke dalam PHP, atau JavaScript, atau bahkan,
walaupun kurang umum, sebuah C berasaskan projek akhir.
>> Sesungguhnya depan untuk final projek adalah tonggak beberapa.
Anda mendapat e-mel daripada kami pada hari yang lain.
Sedarlah bahawa cadangan disebabkan hari Senin mendatang.
Ia tidak semestinya mengikat, tetapi anda perlu menerima rakan-rakan pengajaran anda
kelulusan sebelum membuat apa-apa perubahan selepas itu.
Dan kemudian ke depan adalah beberapa peristiwa penting lain.
>> Jadi untuk menggoda anda, juga, dengan beberapa kemungkinan,
kami mempunyai sekumpulan ini bola lampu warna.
Dan ada di antara kamu orang-orang sekarang memiliki beberapa ini dalam bilik asrama anda juga.
Dan mereka juga mempunyai API.
Jadi ingat minggu-minggu mentol binari lalu bahawa Dan Bradley dan Ansel
Duff diciptakan untuk kita.
Mereka menggunakan antara muka perisian untuk bola lampu ini, yang pada masa ini
dipasang ke dalam elektrik dan kemudian melalui wireless
disambungkan kepada satu perkara yang kecil dipanggil Jambatan ke bawah di sini
seperti proprietari router sedikit kepada peranti ini.
>> Tetapi ternyata jika saya tahu bagaimana untuk menghantar mesej HTTP, seperti yang kita semua sekarang lakukan,
Saya boleh menghantar mesej seperti ini untuk mentol cahaya ini untuk menghidupkannya atau mematikan
atau melakukan apa-apa jumlah operasi lain di atasnya.
Perhatikan bahawa ia tidak mendapatkan, ia tidak posting.
Ada satu lagi dipanggil put.
Sebenarnya ada beberapa kata kerja lain seperti.
Tetapi perhatikan ada jalan yang ada, mengurangkan API, slash pengembang yang baru,
mengurangkan cahaya, mengurangkan satu, slash negara.
>> Itu nampaknya hanya jalan yang syarikat itu, Philips,
memutuskan anda telah mencecah dengan permintaan HTTP
jika anda ingin mengubah negara mentol menggunakan HTTP 1.1.
Kemudian perhatikan garis kosong.
Kemudian akhir sekali apa yang kelihatan seperti jenis array dari beberapa macam,
ini sekali lagi akan dipanggil JavaScript Object Notation, atau Jason.
Dan apa yang anda lihat di sini adalah bahwa ada tiga pasangan nilai kunci.
>> Salah satu kuncinya adalah menyeru.
Dan nilai nampaknya akan menjadi kenyataan.
Kecerahan adalah 128, yang beberapa jenis int.
Dan kemudian masa peralihan adalah sifar, yang ternyata
berapa lama ia akan mengambil untuk mengubah perkara ini pada.
>> Jadi sekarang ini mentol lampu dimatikan.
Tetapi jika saya melakukan hal this-- membiarkan saya pergi ke contekan kecil
Dan yang ditubuhkan pada advance-- dan aku akan
untuk terus maju dan menyalin perintah berikut.
Keriting, sebagai sebahagian dari kamu mungkin telah dikumpulkan pada CS50
Bincangkan adalah utiliti seperti Telnet seperti bahawa anda boleh mensimulasikan permintaan HTTP,
khusus meletakkan.
Saya boleh menghantar data ini, secara khusus apa yang hanya
melihat saat yang lalu khusus ke URL ini di sini.
Dan kemudian Curl akan menangani semua header diperlukan
dan parsing dari sana.
>> Jadi apa yang saya perlu lakukan ialah salinan ini ke dalam tetingkap terminal dan kemudian tekan Enter.
Dan bola lampu menyala.
Dan ini semua akan melalui komputer saya secara wayarles
entah ke jambatan itu, yang kemudian bercakap dengan mentol cahaya ini.
Yang boleh saya lakukan sesuatu yang lain.
Saya boleh membuat perkara ini pergi merah misalnya.
Saya dapat misalnya membuat hal ini pergi hijau.
Saya boleh membuat ia pergi biru.
>> Dan melihat di masing-masing contoh, apa yang Aku ganti
adalah nilai warna yang dipanggil untuk sebenarnya memberikan warna beberapa.
Jadi, saya melekatkan satu ini juga.
Sekarang itu biru.
>> Dan anda boleh melakukan bahkan lebih bagus perkara jika- mari kita pergi ke hijau.
Dan saya boleh melakukan ini dari kursus dengan kod sendiri.
Tetapi bahkan API itu sendiri menyokong operasi funky
begini, yang kini akan mengganggu kami selama 30 saat yang akan datang.
>> Jadi itu satu rasa dari apa yang anda mungkin lakukan dengan API, yang satu ini yang melibatkan
mentol lampu.
Ambil perhatian bahawa CS50 mempunyai pasangan pasang Google Glass jika Anda lebih
suka untuk mengatasi sesuatu di sepanjang garis-garis, Arduino Unos, yang
adalah komputer kecil kecil, pada dasarnya, di papan litar kecil
bahawa anda boleh menyambung kabel dan lain-lain
kepada dan sebenarnya kawalan persekitaran dunia sebenar anda.
Dan kemudian ada pasangan mainan baru yang kita ada.
Yang ini benar-benar hanya tiba hari melalui surat, yang Myo Armband.
Dan saya fikir ia adalah satu cara untuk membuat Anda gembira tentang projek-projek
bahawa anda boleh menggunakan dengan perkakasan ini akan
jadi bermain klip pendek ini yang mereka gunakan untuk menggoda penduduk
bahawa kita sedang hidup di masa depan.
>> [MUSIK BERMAIN]
>> DAVID MALAN: Jadi, dalam hanya beberapa minggu, anda juga boleh jadi sejuk di pameran CS50 ini.
Peranti lain yang kami memiliki banyak yang kami
senang untuk pinjaman bagi projek-projek dipanggil pengawal gerakan.
Ini adalah peranti USB kecil anda menyambung ke komputer yang
membolehkan anda untuk berinteraksi dengan komputer riba anda, Mac atau PC,
seolah-olah anda mempunyai seperti Xbox Kinect dan benar-benar membuat gerakan fizikal banyak
seperti yang kita lihat dalam ini visi masa depan.
>> [MUSIK BERMAIN]
>> DAVID MALAN: Jadi, walaupun anda mempunyai tidak tahu bagaimana sesuatu seperti itu
mungkin boleh dicipta atau kerja pada tahap perkakasan, tidak kira.
Walaupun selepas hanya beberapa bulan dari CS50, dan pemahaman tentang pengaturcaraan
lebih umum, dan pengaturcaraan web yang lebih baru-baru ini, dan kemudian juga API, dan HTTP,
Anda akan mempunyai akses melalui API perisian jika anda
ingin meminjam salah satu daripada peranti untuk benar-benar bercakap dengan ia
dan tidak perlu bimbang tentang pelaksanaan asas
butiran, yang benar-benar selaras dengan gagasan ini dari lapisan
abstraksi yang kami telah dilihat sepanjang semester.
>> Begitu juga pada hujung minggu, melihat beberapa keping berita.
Pergi pertama, pergi ke seminar jika anda ingin mengetahui sesuatu
lebih lanjut mengenai beberapa topik.
Lihat URL di sana.
Dan yang satu ini telah dihantar kepada saya oleh Chang, yang kamu kenal,
siapa yang mencetak tentara kita gajah.
Dan ia adalah tajuk berita seperti berikut.
Aku takut TV baru saya.
Mengapa aku takut untuk mengubah ini perkara dan anda akan terlalu.
Jadi kita kini berada di titik dalam semester,
terlalu, yang mana walaupun anda mempunyai sedikit pemahaman
bagaimana web bekerja, dan HTTP, dan keselamatan, hal-hal seperti ini
harus bermula untuk menangkap mata anda.
Tetapi juga, anda akan memahami sama ada perkara-perkara ini atau tidak
ancaman sebenar.
>> Jadi saya mengambil petikan beberapa dari artikel ini di sini.
Dan cerita ini adalah seperti berikut.
Saya sekarang pemilik sebuah TV pintar baru, yang
menjanjikan untuk memberikan streaming kandungan multimedia, permainan, aplikasi,
media sosial dan internet menyemak imbas, oh dan TV terlalu.
Satu-satunya masalah adalah bahawa saya sekarang takut untuk menggunakannya, kata penulis.
Anda akan, juga, jika anda membaca dasar privasi 46 halaman untuk TV anda.
Jumlah data ini terkumpul perkara yang mengejutkan.
Ini log di mana, bila, bagaimana, dan untuk berapa lama anda menggunakan TV.
Ia set pelacakan cookie, kerana kita telah dibincangkan,
dan suar dirancang untuk mengesan apabila anda mempunyai
kandungan tertentu dilihat atau mesej e-mel tertentu
jika anda mahu untuk memeriksa e-mel pada TV anda.
Ini catatan aplikasi anda digunakan, laman web yang anda lawati,
dan bagaimana anda berinteraksi dengan kandungan, melakukan semua itu melalui TV pintar anda.
Ia juga, YET creepier itu addition-- saya
telah terbina dalam kamera dengan pengenalan wajah.
>> Tujuannya adalah untuk memberikan kawalan isyarat untuk TV
dan membolehkan anda untuk log masuk ke peribadi akaun menggunakan muka anda.
Pada terbalik, gambar yang disimpan di TV bukan dimuat naik
ke pelayan korporat.
Pada sisi negatifnya, internet sambungan membuat seluruh TV
terdedah kepada hacker yang telah menunjukkan keupayaan
mengambil kawalan lengkap mesin.
>> Yang lebih menakutkan, seolah-olah itu bukan bijak, adalah mikrofon.
TV ini mempunyai suara yang ciri pengecaman
yang membolehkan penonton untuk mengawal skrin dengan arahan suara.
Tetapi perkhidmatan yang dilengkapi dengan peringatan agak menyenangkan.
Sila ambil perhatian bahawa jika kata yang diucapkan anda termasuk
peribadi atau sensitif maklumat, bahawa maklumat
akan berada di antara data yang diambil dan dihantar kepada pihak ketiga.
Mengerti?
Jangan kata peribadi atau sensitif barang-barang di hadapan TV anda.
>> Jadi, ini adalah benar-benar nyata.
Dan sukar untuk tidak melihat jika anda pergi ke Best Buy atau sejenisnya untuk TV
hari ini.
Mereka semua bijak dalam beberapa cara.
Dan mereka mendapatkan lebih bijak dan creepier.
Dan mereka hanya mengumpulkan data cara-cara yang telah kita bicarakan
dan kemudian memuat naik melalui HTTP atau beberapa protokol lain untuk beberapa pelayan.
>> Jadi ini adalah satu artikel yang menyeronokkan di laman web dalam talian ini
di sini, yang bercakap tentang bug tertentu atau kod keliru
bahawa kita benar-benar dapat mengikat dalam perbincangan minggu lalu.
Jadi tajuk ini adalah seperti berikut, menurut cerita di sini,
Josh Breckman bekerja untuk syarikat yang mendarat kontrak yang
untuk membangunkan pengurusan kandungan sistem, atau CMS kerana mereka dipanggil,
untuk laman web kerajaan yang cukup besar.
Banyak projek yang terlibat membangunkan sistem pengurusan kandungan
supaya pekerja akan dapat membina dan mengekalkan
yang sentiasa berubah kandungan untuk laman mereka.
Semua berjalan dengan baik untuk beberapa hari selepas akan hidup.
Tetapi pada hari keenam, perkara yang tidak berjalan dengan baik.
Semua kandungan pada laman web telah benar-benar hilang.
Dan semua halaman membawa kepada lalai, Sila masukkan kandungan laman web.
Alamak.
Josh dipanggil untuk menyiasat dan perasan
yang sangat mengganggu alamat IP luaran mempunyai
pergi dalam dan memadam semua kandungan pada sistem.
>> Alamat IP tidak tergolong kepada beberapa hacker bengkok di luar negara
menghancurkan berguna maklumat kerajaan.
Ia memutuskan untuk googlebot.com, Web merangkak sendiri labah-labah Google.
Alamak.
Setelah sedikit penyelidikan dan berebut sekitar untuk mencari sandaran noncorrupt,
Josh menemukan masalah.
>> Seorang pengguna telah disalin semula dan ditampal beberapa kandungan dari satu
halaman ke halaman lain, termasuk sebuah Edit Hyperlink
untuk menyunting kandungan pada halaman.
Biasanya ini tidak akan menjadi masalah kerana pengguna luar akan
perlu memasukkan nama dan kata laluan, tetapi sistem pengesahan CMS,
sistem login, tidak mengambil kira
hacking yang canggih teknik Google Spider.
Alamak.
>> Ternyata, Google Labah-labah tidak menggunakan
cookies, yang bermakna bahawa ia boleh dengan mudah memotong cek untuk
login set kuki adalah palsu.
Ini juga tidak memberi perhatian kepada JavaScript, yang biasanya akan
meminta dan mengarahkan pengguna yang tidak log masuk.
Bagaimana pun mengikuti setiap hyperlink pada setiap halaman itu menjumpai,
termasuk mereka yang mempunyai Padam halaman dalam tajuk.
Alamak.
>> Jadi apa artinya ini dalam lebih istilah teknikal tapi cukup mudah?
Ia hanya bermakna bahawa di seluruh laman web mereka,
mereka mempunyai URL yang tidak tidak seperti yang satu ini yang Anda mungkin akan melihat dalam permasalahan yang tujuh.
Recall pada permasalahan yang tujuh atau kenal permasalahan yang tujuh
bahawa anda dicabar, di antaranya,
untuk menjual saham bagi pihak pengguna.
Tetapi melaksanakan ciri yang dengan cara dari mendapatkan melalui hyperlink dalam pengguna anda
antara muka, mungkin bukan idea yang paling bijak
kerana jika laman web anda adalah entah bagaimana diakses sama ada oleh manusia
siapa yang mengklik di sekitar atau membeli bot seperti Google atau labah-labah yang
sebagai mereka disebut itu hanya merangkak web cuba untuk indeks
web sebagai enjin carian, mereka boleh dengan mudah
memukul melalui mendapatkan jenis URL.
Dan itu secara fungsional bersamaan dengan, dalam hal ini,
menjual semua saham Google.
>> Kini terus terang, itu benar-benar bodoh bahawa CMS
digunakan JavaScript dan cookies untuk melaksanakan sistem login nya
dan tidak melakukan hal itu pihak pelayan, sebagai kalian berbuat dan akan di Serangga 7--
ada login.php yang file-- selalu, sentiasa,
selalu keamanan harus dilakukan pada sisi server,
tidak di pihak klien kerana, kerana ini artikel mencadangkan dan anda mungkin diri anda
melihat pada masa tertentu, ia adalah remeh untuk pengguna, baik atau buruk,
hanya mematikan JavaScript apatah cookies.
Jadi itulah WTF harian anda.
>> Ada satu lagi, yang adalah hanya jenis menakutkan,
jadi saya akan menyatakannya jika hanya sebagai pelajaran hidup.
Setiap kali anda menggunakan permohonan disebut seperti Snapchat atau sejenisnya
yang mengatakan gambar-gambar ini hanya berlangsung selama lima saat, sepuluh saat, atau entah apa lagi.
Mereka tidak kekal Itu sama sekali tidak terjadi.
Seperti tidak ada cara, digital, untuk melaksanakan beberapa bentuk video,
atau imej, atau teks perkongsian seperti bahawa penerima di hujung yang lain
tidak boleh entah bagaimana menyimpan data.
>> Dengan cara yang paling naif, seseorang boleh mengambil telefon mereka.
Dan mereka mempunyai jendela kedua 10 sambil melihat beberapa snap
untuk hanya mengambil beberapa telefon lain dan mengambil gambar itu, jelas.
Jadi, anda boleh memelihara sesuatu secara digital dengan cara itu.
Sebahagian daripada anda tahu bagaimana untuk mengambil screenshot pada telefon anda.
Malah, jika anda tidak tahu ini, menyedari bahawa sekurang-kurangnya Snapchat,
dan saya rasa lain aplikasi hari ini,
sekurang-kurangnya memberitahu anda jika penerima telah benar-benar
mengambil screenshot imej anda.
>> Tetapi yang lebih buruk lagi, ini adalah snappening itu, sebagai seseorang yang diciptakan itu baru-baru ini,
di mana kira-kira 100,000 Buncis telah dibebaskan
dalam apa yang disebut fail torrent di pelbagai laman web akhirnya.
Dan ini terkandung sejumlah mesej peribadi dan posting.
Ternyata kebanyakan dari mereka tidak berbahaya, jadi apa yang anda harapkan.
Tetapi kerana orang mempunyai menggunakan laman web pihak ketiga,
login dengan Snapchat mereka nama pengguna dan kata laluan dan kemudian
menyimpan semua mereka terkunci pada ini laman web pihak ketiga.
Dan ia adalah bahawa pihak ketiga laman web yang telah digodam,
yang hanya bermakna seseorang digambarkan bagaimana untuk mendapatkan semua 100,000 ditambah dari orang-orang gambar
ke dalam cakera keras mereka sendiri untuk perkongsian seterusnya.
Terus terang, di sini juga, itu adalah semacam dari bodoh yang Snapchat
dilaksanakan dalam apa-apa cara yang pihak ketiga boleh menyusun intercept
data dan ia tidak terikat kepada anda aplikasi sendiri yang berjalan pada telefon.
Tetapi di sini juga, sedar bahawa ini perkara yang tidak harus menangkap anda dengan kejutan,
atau sekurang-kurangnya harus ada menjadi pelajaran hidup di sini.
Jika ingin teknikal maklumat, sila ke URL yang ada
yang ada di slide hari ini.
Baiklah, apa-apa soalan mengenai pelajaran hidup hari ini di CS?
Menghidupkan yang mati.
Apa-apa pun?
Saya ada ramai orang yang mendaftar Snapchat atau sesuatu yang mereka sekarang.
>> Baiklah, jadi SQL, Bahasa Pertanyaan Berstruktur.
Mari kita membungkus hal ini.
Dan juga, walaupun kami hanya menggaru
permukaan ini bahasa, kami akan memberikan anda
cukup bahasa dalam bentuk Serangga 7
supaya anda boleh mengatasi beberapa fungsi yang agak biasa.
Tetapi menyadari ada pasangan perkara yang kita tidak memerlukan dari anda,
tetapi mereka akan menjadi penting datang tugas akhir
dan pasti datang membuat sebenar laman web dengan pengguna sebenar
adalah keputusan reka bentuk ini.
>> Ia ternyata bahawa dalam pangkalan data MySQL, anda
mempunyai tandan pilihan seperti jenis data untuk ruangan anda
dan perkara-perkara lain, tetapi anda juga mempunyai pilihan simpanan yang dipanggil
mesin untuk semua data anda, jenis sistem fail,
jika anda sudah biasa, untuk semua data anda.
Apa format ia akhirnya disimpan di dalam?
Dan yang paling biasa, mungkin, telah MyISAM dan InnoDB, istilah teknikal
bahawa kami akan mengambil berat tentang hanya setakat satu yang mempunyai
dan seseorang tidak perlu ciri berikut.
>> Katakan anda mempunyai asrama lemari es sedikit.
Dan anggaplah bahawa anda dan anda rakan sebilik, berkongsi peti sejuk ini,
benar-benar menyukai susu katakan.
Dan ini adalah, sebenarnya, bagaimana cerita diberitahu kepada saya dalam perjalanan pulang
pada hari ketika saya mengambil kursus dipanggil CS 161 Sistem Operasi, yang
sama meneroka topik ini.
Jadi anda mempunyai peti sejuk ini.
Anda kehabisan susu.
Dan anda pulang ke rumah, rakan sebilik anda masih di kelas atau apa sahaja,
dan anda membuat keputusan saya akan pergi keluar dan mendapatkan susu.
Jadi anda menutup peti sejuk, lokap di dalam bilik asrama, pergi di seberang jalan
CVS atau di mana pun, dan mendapatkan dalam talian untuk membeli susu.
>> Sementara itu, rakan sebilik anda pulang ke rumah dari kelas, masuk ke dalam bilik asrama,
membuka peti sejuk, juga menyedari ooph, kami daripada susu.
Sehingga ia menutup peti sejuk dan kemudian berlaku
untuk pergi ke CVS lain, yang kebetulan menjadi
satu blok jauhnya dari CVS lain di alun-alun, dan mendapat di talian
sana untuk mendapatkan susu.
Sekarang, tentu saja, beberapa menit kemudian, anda berdua kembali,
dan yang terburuk dari semua kemungkinan hasil yang telah berlaku.
Anda berdua mempunyai susu.
Dan anda tidak benar-benar seperti susu yang banyak.
Jadi salah seorang daripada mereka hanyalah akan masam pada satu masa nanti.
Jadi sekarang anda mempunyai satu jumlah yang berlebihan susu di dalam peti sejuk semua kerana mengapa?
>> [Terdengar]
DAVID MALAN: Ya, anda tidak entah bagaimana berkomunikasi antara satu sama lain
bahawa anda mendapat susu.
Jadi, dalam yang paling mudah cara-cara di dunia manusia,
bagaimana anda boleh mengelakkan ini bodoh senario daripada berlaku seperti
bahawa anda hanya berakhir dengan satu.
Teks mereka, ya baik.
Tetapi bagaimana lagi?
Post-it.
DAVID MALAN: Satu nota Post-it.
Apa-apa bentuk komunikasi yang memberitahu rakan sebilik anda
tidak akan masuk ke dalam peti sejuk untuk susu.
Saya akan pergi mengisi kembali pada saya sendiri.
Jadi, anda perlu entah bagaimana untuk mengunci bahagian ini.
Oleh itu, kita boleh membuat this-- kita boleh jenis merosakkan cerita dan bertukar menjadi cerita CS
mana menganggap ini sebagai sama seperti berubah-ubah, yang menyimpan beberapa nilai.
Dan sekarang ini, nilai susu adalah sifar,
yang anda tidak mahu anda rakan sebilik untuk memeriksa pembolehubah yang
dan kemudian membuat keputusan dirinya sendiri berdasarkan keadaan yang berubah-ubah
jika anda berada dalam proses mengubah keadaan berubah-ubah itu.
>> Jadi salah satu baris SQL yang kita memberikan dalam Serangga 7 spesifikasi
adalah salah satu ini di sini.
Dan kita tidak menghabiskan besar jumlah masa yang bercakap tentang hal itu.
Tetapi ternyata, jika anda cuba untuk membeli beberapa saham di bidang keuangan CS50
bahawa anda sudah mempunyai beberapa saham, anda
ingin dapat melakukan nomor perkara serta-merta bersama-sama.
Anda mahu menjadi mampu berkesan, pada tahap yang tinggi,
periksa semua betul, jika saya ingin untuk membeli lebih banyak saham percuma,
yang kita saham sen bercakap tentang di spec,
Saya mahu cek pertama berapa banyak saham yang saya miliki.
Dan rasa itu lima.
Dan kira saya mahu membeli 10 lagi, saya akhirnya
ingin memiliki 15 saham.
Jadi saya harus bertanya dua soalan.
Apa keadaan pembolehubah?
Apa keadaan barisan?
Berapa banyak syer boleh saya saat ini?
Maka anda mahu pergi ke depan dan mengemaskinikannya.
Jadi itulah analog kepada susu dalam bahawa anda memeriksa barisan,
dan kemudian anda mahu untuk mengemaskininya kerana jika anda ingin membeli 10 saham,
Anda tidak ingin mengubah baris ke 10, anda
ingin mengubahnya ke 5 ditambah 10 atau, tentu saja, 15.
>> Baris kode memastikan kedua-dua idea-idea konseptual
berlaku bersama-sama atau tidak sama sekali.
Tidak seorang pun, termasuk beberapa pengguna lain siapa yang masuk ke laman web yang sama,
entah bagaimana boleh mengganggu pengecekan barisan
dan pengemaskinian berturut-turut itu, pilih dan kemas kini jika anda akan.
Dan sintaks yang tidak super jelas, tetapi baris ini satu, lama itu adalah,
memastikan bahawa kedua-dua operasi memeriksa variabel atau periksa barisan
dan kemas kini baris yang berlaku atom.
>> Oh di sini kita pergi lagi.
Mesej teks pada telefon bimbit saya.
Jadi mari kita membuat hal ini konkrit lebih sedikit.
Katakan bahawa anda tidak melaksanakan peti sejuk,
dan anda tidak melaksanakan Serangga 7 tetapi sebuah bank sebenarnya,
atau ATM, Juruwang Automatik Mesin, di mana anda entah bagaimana
ingin dapat memberdayakan pengguna untuk memindahkan wang
dari satu akaun ke akaun lain.
OK, bertahan.
Saya akan membisukan ini sekarang, matur nuwun.
Jadi kami ingin memindahkan wang dari satu nombor akaun
ke dalam akaun yang berbeza nombor, khususnya $ 100.
Jadi ini adalah jenis yang sewenang-wenang Sebagai contoh, di mana anda, ATM,
mungkin mahu untuk melaksanakan dua SQL pertanyaan, tolak daripada satu akaun,
dan menambah ke akaun yang lain.
Tetapi anda ingin memastikan bahawa Dua baris kedua berlaku atau tidak sama sekali.
Anda tidak mahu sesuatu mendapatkan terganggu.
Anda tidak melakukan beberapa orang jahat bijak entah bagaimana berdiri di Bank of America
dengan dua mesin ATM di hadapan daripadanya dan entah bagaimana
semacam menaip dalam arahan pada masa yang sama,
mudah-mudahan cuba untuk memotong $ 200 sebagai ganti sebanyak $ 100 dan hanya mempunyai $ 100 dikreditkan.
Pendek kata, anda mahu perkara ini berkelakuan persis seperti yang anda harapkan.
>> Dan cara yang anda lakukan ini di SQL database
Anda membungkusnya dengan apa yang disebut transaksi.
Secara harfiah dalam SQL, anda boleh memanggil ini CS50 fungsi query dengan kutipan awal tanda kutip
transaksi.
Kemudian anda boleh melaksanakan apa-apa jumlah pertanyaan SQL berikutnya,
tetapi tidak seorang pun dari mereka mengambil kesan ke atas pangkalan data
sehingga anda memanggil pertanyaan kutipan tanda kutip melakukan, jika sekali lagi menggunakan PHP.
Dan dengan cara ini, anda boleh memastikan bahawa pengguna walaupun anda mempunyai 1,000 semua
memukul pangkalan data anda pada masa yang sama, SQL
akan menjanjikan bahawa dua pertanyaan akan
dilaksanakan satu demi satu.
Jadi anda tidak berakhir dengan lebih daripada susu atau jumlah yang salah, pada akhirnya,
uang.
>> Maka sematkan di dalam fikiran, bukan kerana Serangga 7
tetapi bagi projek-projek akhir jika anda benar-benar
cuba untuk memindahkan data seluruh jadual seperti yang mungkin di sini.
Tetapi mungkin juga lebih mudah dan jelas untuk memahami dengan contoh
adalah salah satu ini di sini.
Dan seseorang melalui e-mel kepada kami tentang hanya hari ini yang lain
apabila dia melihat sesuatu secara online sama.
>> Jadi, untuk pengetahuan saya, sistem pin tidak terdedah kepada serangan ini.
Dan saya tidak tahu apakah itu bahkan penggunaan pangkalan data SQL di bawah tenda.
Tetapi mari kita menggunakannya untuk Demi perbincangan.
Berikut adalah skrin yang Orang-orang cenderung Harvard
untuk melihat ketika login dengan mereka Nombor ID Harvard dan pin mereka.
Dan menganggap bahawa sistem pin ialah dilaksanakan dalam PHP dan MySQL dengan
pangkalan data, kod yang seseorang tahun mungkin telah menulis yang lalu
mungkin kelihatan seperti ini.
Pertama, mengisytiharkan ubah dikenali sebagai nama pengguna.
Dan hanya mendapatkan bahawa dari yang superglobal POST.
Kemudian mendapatkan variabel lain disebut kata laluan dan melakukan perkara yang sama.
Dan kemudian hanya menjalankan pertanyaan ini panjang di sini,
pilih bintang daripada pengguna di mana nama pengguna sama dengan ini dan itu
dan kata laluan sama dengan ini dan itu.
>> Perhatikan bahawa keriting yang kawat gigi saya telah digunakan di sini
hanya bermaksud untuk PHP, pergi ke depan dan pengganti
nilai kedua-dua pembolehubah di sana.
Mereka tidak benar-benar diperlukan, tetapi mereka cenderung untuk menghindari kesalahan sintaks halus.
Jadi ini kelihatan benar-benar betul pada pandangan pertama.
Dan ia adalah.
Anda dapat melaksanakan sistem pin dengan cara ini.
>> Tetapi kira yang super pelajar pintar dan berniat jahat
input ini sebagai nya pin.
Jadi saya telah membuang peluru tanda-tanda di sini di olok-olok ke atas,
dan saya sudah benar-benar mendedahkan apa yang dia mungkin menaip.
Dan ia sedikit aneh.
Tetapi apa yang melompat keluar pada anda di berpotensi membimbangkan mengenai input pengguna,
walaupun anda tidak tahu apa yang serangan injeksi SQL bermakna.
Mengapa hal ini kelihatan hanyir sedikit?
Apa itu?
[Terdengar]
DAVID MALAN: ini atau agak curiga.
Sebenarnya, itu adalah satu kata kunci dari SQL.
Sehingga tidak menjadi petanda baik.
Hakikat bahawa terdapat semua ini tanda petikan tunggal
besar-- sebenarnya, salah satu yang paling mudah cara untuk memecahkan beberapa pangkalan data
adalah dengan menaip nama seperti O'Reilly yang mempunyai tanda kutip di dalamnya
kerana jika manusia yang menulis kod di belakang tabir
tidak mengambil kira bahawa terdapat mungkin tanda petikan tunggal di pengguna
input, dan dia menggunakan tanda petikan tunggal dalam kod mereka,
hal-hal buruk boleh berlaku.
>> Malah, lebih buruk lagi, pertimbangkan ini.
Jika ini sekali lagi kod bahwa seseorang di tahun Harvard
lalu menulis untuk pin sistem, perhatikan apa yang
kira-kira untuk digantikan untuk nama pengguna dan kata laluan
jika jenis pengguna dalam lagi skroob sebagai username mereka
dan kemudian satu, dua, tiga, empat, lima, petikan atau kutipan tanda kutip satu sama dengan
mengutip satu.
Dan perhatikan apa yang utama di sini adalah pengguna tidak
mula password atau pin mereka dengan kutipan.
Dan mereka belum berakhir itu dengan kutipan kerana dia
dengan mengandaikan jika pengaturcara tidak begitu tajam,
mereka akan memiliki orang- sebut harga tunggal di dalam kod.
>> Jadi, inilah kod.
Dan penggantian yang sekarang mungkin berlaku adalah ini.
Dan saya telah digariskan apa pengguna telah ditaip dalam.
Jadi sebelum, sesudah.
Dan perhatikan apa yang sedikit membimbangkan sekarang kira-kira setengah hak kod SQL ini?
Ini adalah sedikit lebih kompleks, diakui, daripada pertanyaan yang telah kita lihat.
Tetapi ini tidak boleh mungkin menjadi hal yang baik jika anda
mengatakan pilih bintang, yang pilih segala sesuatu dari meja pengguna
mana nama pengguna sama skroob dan kata laluan sama dengan satu, dua, tiga, empat,
lima atau satu sama dengan satu.
Apakah implikasi logik dari fasal terakhir mungkin?
Ia hanya selalu benar.
>> Dan kerana kita telah semacam meneka atau digambarkan oleh percubaan dan kesilapan
bahwa programmer yang menulis kod ini tidak
menjangka seseorang manusia atau buruk menaip dalam tanda petikan tunggal juga,
kita boleh sintaksis menyelesaikan pertanyaan SQL
dengan sesuatu yang tidak masuk akal tetapi sesuatu yang
sintaksis tidak betul yang selalu bernilai true.
Jadi, jika kod ini sedang digunakan untuk menjawab soalan benar atau salah perlu
pengguna ini dibenarkan untuk lulus, yang jawapan selalu tampaknya akan
untuk menjadi kenyataan kerana ini selalu akan untuk memilih sesuatu dari pangkalan data
kerana salah satu tentu saja akan selalu sama dengan satu.
>> Jadi apa penyelesaian?
Baik dalam Serangga 7, kita benar-benar mengelakkan ini semua bersama-sama.
Kami memberikan fungsi pertanyaan, dan kami menggalakkan anda untuk menggunakan tanda tanya
sebagai pemegang tempat, sama semangat yang printf ini% s,
tetapi apa yang penting mengenai tanda tanya di sini adalah jika anda benar-benar membaca
functions.php, di mana kami fungsi permintaan dilaksanakan,
tanda tanya yang melarikan diri, di mana sesuatu yang berpotensi berbahaya
seperti satu kutipan dihidupkan menjadi kutip melarikan diri.
>> Jadi, ini adalah apa yang benar-benar terjadi jika anda
menggunakan fungsi pertanyaan CS50 atau mana-mana nombor dari perpustakaan bebas pihak ketiga yang
melakukan perkara yang sama.
Tidak terpakai di dalam kes ini, dengan warna hijau, jika pengguna telah ditaip dalam satu kutipan
kerana pertanyaan fungsi yang kita tulis adalah
akan menambahkan backslashes sebelum sebarang kutipan berbahaya tersebut.
Jadi ini tidak, dalam Malah, akan menjadi legit.
Ini seperti menaip dalam gila mencari kata laluan itu, tentu saja, tidak akan
menjadi kata laluan sebenar skroob ini.
>> Jadi takeaway untuk CS50 adalah satu, benar-benar sentiasa menggunakan sesuatu
seperti fungsi pertanyaan CS50 ini atau perpustakaan yang sedia ada,
yang kebetulan dipanggil PDO.
Tetapi tidak pernah, tidak pernah, tidak pernah melakukan kod seperti ini
tanpa melarikan diri atau menggosok sebagaimana yang mereka katakan input anda.
Dan anda akan pada satu masa nanti mungkin mencari beberapa laman web seperti ini.
Malah, ia seolah-olah menjadi kes itu seperti di lapangan terbang dan hotel di tempat-tempat
di mana mereka memiliki Wi-Fi percuma akses yang anda perlu login ke,
laman web ini selalu teruk dilaksanakan.
Dan sebagainya semacam-senang di rumah latihan, bukan untuk tujuan berniat jahat atau lebih
yang menyenangkan di jalan raya senaman, adalah dengan hanya menaip
apostrof, satu kutipan, ke dalam borang di laman web beberapa
dan melihat apa yang berlaku.
Dan jika server crash atau memberikan anda beberapa jenis mesej ralat,
sangat mungkin bahawa seseorang telah tidak dijangka ini.
Dan kemudian anda harus waspada yang betul pihak berkuasa dan meneruskan lagi.
>> Jadi sekarang kalian harus diharapkan memahami sedikit lebih geek lucu di sini.
>> [Ketawa]
DAVID MALAN: Kau tahu anda seorang geek.
Selama beberapa seterusnya tahun, anda akan ingat
yang sedikit Jadual Bobby kerana kartun ini di sini.
Jadi ingatlah bahawa dalam fikiran kerana kita konteks suis kali terakhir
hari ini untuk JavaScript.
Kami telah menghabiskan agak sedikit masa pada sintaks PHP
kerana ia sebenarnya super sama dengan C.
Dan baik cukup, JavaScript terlalu super mirip dengan sintaks C
dan juga seperti yang akan kita lihat dalam hanya masa dan seperti yang akan kita
lihat pada minggu ini khususnya.
Apa yang boleh anda lakukan dengan bahasa ini walaupun, adalah lebih kuat,
terutama dengan API.
>> Tetapi pertama tur singkat.
Jadi satu, dalam JavaScript, ada tiada fungsi utama, yang bagus.
Seperti PHP, anda hanya boleh menulis kod.
Syarat kelihatan seperti ini.
Dan ungkapan Boolean mungkin kelihatan seperti ini atau seperti ini.
Menukar wujud, dan mereka mungkin kelihatan seperti ini.
Empat gelung kelihatan seperti ini.
Walaupun gelung kelihatan seperti ini.
Adakah sesekali kelihatan seperti ini.
Dan kemudian array kelihatan seperti ini, hampir sama dengan PHP.
Tetapi perhatikan, bahawa dalam JavaScript anda mengisytiharkan pembolehubah tidak dengan satu dolar
menandatangani, tidak dengan jenis data tetapi secara harfiah dengan mengatakan var untuk berubah di hadapannya.
Ia terlalu longgar ditaip dalam hal ini memiliki jenis,
tetapi anda tidak tegas menyatakan mereka.
Dan kemudian string, untuk contoh, mungkin kelihatan
seperti ini, tali yang yang disebut dalam kes ini.
Dan kemudian objek.
Dan kita ini akan melihat lebih banyak tidak lama lagi.
Dan objek adalah mungkin salah satu yang paling kerap berlaku dalam struktur data
dalam JavaScript berdasarkan program kerana ia membolehkan
Anda kaitkan sewenang-wenangnya pasangan nilai utama hanya
seperti array bersekutu PHP ini dan seperti jadual hash anda sendiri
atau seperti yang kita cuba dilaksanakan beberapa minggu kembali.
Jadi mari kita benar-benar melihat apa yang boleh kita lakukan dengan JavaScript.
Dan khususnya, ini adalah daftar cucian ciri-
yang mempunyai pelayar yang membolehkan kita untuk menyambung JavaScript
ke dalam laman web dengan cara yang berikut.
JavaScript sering digunakan sebagai sisi klien bahasa skrip.
Ia tidak disusun.
Ia juga ditafsirkan.
Tetapi tidak seperti PHP, yang sudah berjalan pada pelayan, di pelayan web,
atau di dalam mendalam tentang pelanggan, JavaScript
berbeza di dalamnya yang biasanya berlangsung dalam pelayar.
>> Jadi apa-apa kod JavaScript anda mula menulis untuk Serangga 8, atau projek akhir anda,
atau dalam dunia sebenar umumnya akan yang akan disimpan pada pelayan, benar-benar
dalam HTML atau dot dot JS untuk fail JavaScript.
Tapi browser akan untuk memuat turun yang JavaScript
kod untuk contoh anda sendiri Chrome, atau IE, atau Firefox, atau apa sahaja.
Dan kod tersebut benar-benar akan mendapatkan dijalankan di dalam pelayar anda.
Hanya untuk membuat ini lebih nyata, mari kita lihat ini dalam bentuk konkrit.
>> Kami tidak tahu apa kod ini tidak tanpa benar-benar membaca melaluinya.
Tetapi saya pergi ke Facebook.com tanpa log in.
Biar saya pergi ke Periksa Elemen dan pergi ke, katakanlah, Rangkaian dan memuat semula halaman.
Dan kami akan see-- biarlah saya beralih Reload yang Page untuk mendapatkan semua pertanyaan dengan produk baru.
Dan yang pertama fail yang saya lihat adalah CSS, CSS.
Berikut adalah yang pertama JavaScript fail, dan saya mempunyai
tidak tahu apa yang dilakukan, tetapi di sini adalah beberapa kod JavaScript yang
yang mendorong Facebook.
Ia bukan walaupun benar-benar bahawa mendedahkan untuk zum masuk.
Ia masih sama seperti tidak masuk akal.
>> Tetapi anda akan melihat bahkan di bawah, ada bahkan lebih dari ini fail JavaScript.
Alamak.
Itu ping.
Mari kita turun sedikit lebih lanjut, lebih jauh, lebih lanjut.
Ada satu.
>> Jadi walaupun Facebook, di belakang adegan, ditulis dengan bahagian dalam PHP
dan Facebook versi itu sendiri, terdapat sejumlah besar JavaScript.
Malah, mana-mana berbual yang anda lakukan di Facebook,
salah satu update garis masa inline yang berlaku dalam masa sebenar, semua itu
didorong oleh JavaScript.
Ya?
>> PENONTON: Saya tidak pasti jika ini adalah Facebook,
tetapi saya fikir bahawa Facebook dibangunkan di-rumah kod bahasa mereka sendiri?
DAVID MALAN: Mereka punya.
Jadi sebab itu saya mengatakan varians PHP disebut Hip Hop yang mereka benar-benar
ciri-ciri tambahan kepada apa-apa yang apabila Mark mula dilaksanakan Facebook,
ia ditulis dalam PHP.
Dan yang jenis tetap jenis bahasa ujung depan
yang mereka gunakan untuk banyak coding mereka, tetapi
tidak menjadi bahasa itu skala sangat baik untuk berbilion
orang.
Oleh itu mereka telah menambahkan mereka sendiri peningkatan di belakang tabir.
Dan mereka menggunakan apa-apa bilangan bahasa-bahasa lain
untuk berbagai potongan infrastruktur mereka.
Jadi ya, ia adalah satu varians apa yang kita kenali sebagai PHP.
>> Jadi mari kita lihat di beberapa contoh
bagaimana kita boleh menggunakan JavaScript di sini.
Dalam kod sumber hari ini, kita mempunyai sekelompok fail, di mana yang pertama,
mari kita dipanggil DOM sifar.
Jadi DOM sifar kelihatan seperti berikut.
Biar saya pergi ke direktori ini dan membuka domzero.html,
bahagian atas yang mempunyai jenis doc perisytiharan, katakan di sini datang HTML 5.
Dan sekarang inilah tag HTML.
Berikut adalah tag kepala.
Dan inilah apa yang baru hari ini.
>> Kami kini mempunyai tag script dalam kepala halaman.
Dan ini nampaknya tidak sangat sedikit, tetapi notis
bahawa saya telah menetapkan skrip, yang JavaScript.
Dan sebagai samping, kerana ini adalah salah faham umum,
JavaScript mempunyai apa-apa hubungannya dengan Jawa, bahasa
sebahagian dari anda mungkin telah belajar di APC.
Itu lebih dari pemasaran yang perkara daripada apa-apa,
naik coattails Jawa tahun yang lalu.
Tetapi JavaScript, tiada kaitan dengan Jawa, hanya sama, dan mengganggu,
membingungkan dinamakan.
>> Jadi di sini adalah bagaimana anda menyatakan fungsi dalam JavaScript, secara harfiah mengatakan fungsi,
maka nama fungsi, maka apa-apa hujah yang ia mungkin mengambil masa,
sama seperti di PHP.
Rupa-rupanya dalam JavaScript, salah satu yang paling fungsi menjengkelkan yang wujud adalah Pemberitahuan.
Ini adalah sebuah jendela kecil yang akan muncul dan memberi isyarat kepada anda
kepada beberapa keping maklumat.
Ini umumnya disukai.
Tapi kita akan menggunakannya sebagai kami latihan pertama di sini.
>> Perhatikan beberapa ciri JavaScript.
Tanda petik tunggal dan tanda petik sebenarnya tidak penting lagi.
Tanda petikan tunggal dan ganda sebut harga boleh ditukar ganti,
sedangkan dalam bahasa C, anda perlu menggunakan tanda kutip ganda untuk string,
dan anda mempunyai dua single mengutip untuk karakter.
Dalam dunia JavaScript, banyak orang, kebanyakan orang
menggunakan tanda kutip tunggal di tali hanya kerana ia adalah satu perkara yang gaya.
Tetapi apa yang pengendali ditambah di sini, yang kita tidak pernah melihat sebelum ini?
>> PENONTON: Rangkaian.
DAVID MALAN: Rangkaian.
Jadi C bahkan tidak memiliki ini.
PHP mempunyai operator titik, yang melakukan hal ini.
JavaScript mempunyai pengendali ditambah, yang membingungkan adalah seperti Java.
Sekarang apa yang berlaku di sini?
>> Jadi, di sinilah asas pemahaman tentang gambar yang
kita muntah pasangan hari lalu datang ke dalam bermain.
Ingat ketika kami mempunyai mudah versi HTML page--
ia hanya berkata, hello world.
Dan kemudian kita menarik pokok di sebelah kanan, yang
telah mempunyai banyak segi empat dan garis menghubungkan mereka seperti pohon keluarga.
Jadi itulah yang dipanggil DOM atau Document Object Model.
Dan ternyata bahawa anda boleh mengakses segi empat tepat di pohon dengan sintaks
seperti berikut ini.
Anda benar-benar mengatakan dokumen, yang merupakan variabel global khusus dalam JavaScript
program yang mempunyai fungsi yang yang berkaitan dengannya yang boleh anda akses
sama dengan struct, tetapi anda hanya mengatakan titik dan nama fungsi,
mendapatkan elemen dengan ID.
>> Elemen yang saya mahu dapatkan adalah nampaknya quote nama tanda kutip.
Dan kemudian saya ingin mendapatkan nilainya.
Sekarang kita mendapat lebih awal daripada diri kita sendiri.
Saya tidak pasti apa yang semua ini adalah tentang.
Mari kita maju cepat ke HTML pada halaman, yang super mudah.
>> Perhatikan bahawa Aku telah menetapkan yang membentuk di sini.
Perhatikan Aku telah memberikannya yang unik ID, walaupun kita sudah tidak digunakan
atribut ini sebelumnya.
Tapi ini wujud dalam HTML.
Anda unik boleh mengenal pasti beberapa potongan HTML dengan pengecam seperti ini.
>> Perhatikan sekarang this-- ternyata HTML menyokong, per bahawa senarai dobi
saat yang lalu, keseluruhan sekumpulan pengendali acara.
Dan pengendali acara ini yang tertulis di hantar.
Pada pengemukaan pengguna ini bentuk, panggil kod berikut.
Dan kod yang akan untuk dipanggil atau disempurnakan
adalah tepat ini, Yunani fungsi diikuti dengan pulangan palsu.
Segala sesuatu yang lain harus menjadi cukup akrab.
>> Di sini merupakan input dari jenis teks, di mana ID, dalam kes ini, akan menjadi nama.
Kami tidak mempunyai atribut nama sebenar time-- ini dan butang hantar.
Jadi halaman yang dihasilkan kelihatan seperti ini.
Dan tingkah laku yang dihasilkan, Anda akan melihat, seperti di bawah.
Halaman itu tuan rumah tempatan berkata, halo Daud, hampir tidak dari segi estetik
cara untuk menyambut pengguna.
Tetapi apa yang sebenarnya berlaku?
>> Nah, mempertimbangkan apa ini.
Ini adalah medan teks.
Dan menurut HTML di sini, saya telah memberikannya
pengecam unik disebut sebut nama tanda kutip.
Sementara itu, saya telah berkata apabila pengguna menghantar borang ini
dengan menekan Enter atau klik Submit butang, memanggil fungsi yang disebut Greet
dan kemudian kembali Palsu.
Mari kita menganggap mereka secara terbalik.
Perhatikan apabila saya klik Submit, yang URL halaman ini tidak berubah.
Ikon browser tidak bermula berputar.
Saya tidak ke mana-mana, dan itu secara harfiah kerana saya berkata kembali Palsu.
Kembali litar pintas palsu atau berhenti kelakuan lalai dari borang.
Sehingga kemudian meninggalkan kami dengan ini pertanyaan terakhir satu.
Apa Greet lakukan?
Nah, Salam nampaknya memanggil fungsi yang dipanggil
Alert, lewat di salah satu hujah panjang itu
hasil daripada concatenating bersama-sama sekumpulan substrings, hello ruang koma,
maka apa pun ini kembali.
Jadi dokumen adalah seperti global variabel dengan akar pohon itu,
memanggil fungsi khas, jika tidak, kini dikenali sebagai kaedah a.
Fungsi itu dalam pembolehubah adalah
dikenali sebagai kaedah dan bukannya fungsi.
>> Oleh itu elemen dengan KTP.
Apa elemen yang anda ingin mendapatkan dengan ID?
Sebutkan nama dan tanda kutip kemudian secara khusus menghargai.
Jadi dengan kata lain, kod yang hanya mendapati medan teks di mana ID adalah nama
dan kemudian mendapat nilainya.
Jadi, jika saya mengubah ini dan berkata Davin bukan Daud,
dan klik Submit, sekarang kita mempunyai ucapan untuk Davin.
>> Baiklah, jadi semua baik dan bagus.
Tetapi mari kita lihat jika kita boleh membuat ini sedikit lebih bersih kerana hanya
menulis kod seperti ini adalah umumnya akan disukai.
Ini akan kelihatan menakutkan.
Tetapi apa yang pertama perbezaan bahawa anda ambil perhatian di sini
dalam versi ini selain nama berubah untuk DOM satu?
Apa struktur kelihatan berbeza tentang perkara ini berbanding yang lain?
Ya?
PENONTON: Apakah borang di atas script ini?
DAVID MALAN: Ya, bentuk adalah di atas script untuk sebab-sebab tertentu yang aneh.
Jadi itulah perkara pertama yang yang melompat keluar pada saya juga.
Dan bersyukur kerana sekurang-kurangnya, bahagian ini adalah sama.
Jadi satu-satunya perkara yang seolah-olah untuk berbeza adalah ini.
>> Jadi, inilah yang rapi kira-kira 2 JavaScript.
Dan itu membuat ia sukar untuk memahami pada pandangan pertama,
terutamanya bagi projek-projek akhir jika Anda sedang melihat contoh kod dalam talian,
tetapi itu bermuara pada beberapa ciri sintaksis asas.
Di sini sekali lagi adalah bahawa dokumen pembolehubah global.
Di sini sekali lagi adalah bahawa kaedah atau fungsi yang mengatakan mendapatkan elemen dengan ID.
Kali ini saya ingin mendapatkan ID dipanggil demo.
Di mana itu?
Itu nampaknya tepat di sini, borang itu sendiri.
>> Dan kini melihat bahawa nampaknya jika saya kembali bahawa nod dari pohon yang
mewakili bentuk itu sendiri, bukan medan teks,
ternyata bentuk itu, yang nod atau persegi panjang dari pohon,
mempunyai apa yang kita akan panggil harta, sangat, sangat, sangat mirip
semangat yang struct dalam C. Ia hanya ahli data di dalam persegi panjang ini.
>> Jadi aku punya bentuk di sini, dan saya melampirkan,
atau aku memberi, untuk Sawijining Hantar pengendali atau lebih tepatnya Di Hantar harta
fungsi berikut.
Dan ini adalah, setakat ini, yang paling gila hal yang selama ini sintaksis.
Ternyata dalam JavaScript dan dalam PHP, dan terus terang dalam hal ini dalam bahasa C,
walaupun kita tidak melakukannya, anda boleh menambah tanpa nama, tanpa nama, atau AKA lambda
fungsi-fungsi yang tidak mempunyai nama yang tetapi boleh dipanggil tetap.
>> Jadi apa yang saya lakukan di sini adalah Aku menugaskan ini On Hantar hartanah yang
berada di dalam nod ini pokok DOM saya, fungsi, fungsi penunjuk jika anda akan.
Fungsi yang tidak ada nama, tetapi itu tidak
percaya kita akan melihat dalam sekejap bagaimana untuk menyebutnya.
Apabila fungsi ini dipanggil, kod ini dijalankan, maka
palsu dikembalikan seperti sebelumnya.
>> Tetapi melihat apa yang saya lakukan.
Pada ketika ini di cerita, saya mempunyai borang.
Ia mempunyai ID unik yang dikenali sebagai demo.
Di sini, saya mempunyai tag script yang melaksanakan kod berikut.
Ia melekat dengan nod di pohon untuk itu Pada Hantar
harta fungsi ini di sini.
Dan hanya dengan sifat bagaimana pelayar bekerja, apabila saya sekarang klik Hantar atau tekan Enter,
fungsi yang akan dipanggil.
Ia tidak memerlukan nama kerana yang sih peduli apa namanya.
Satu-satunya masa ia pernah akan mendapatkan disebut ialah apabila saya serahkan borang tersebut.
Tidak perlu bagi saya, pemaju manusia,
untuk benar-benar menyebutnya di tempat lain.
>> Sekarang hanya sebagai teaser, seolah-olah bahawa tidak keberatan cukup lipatan,
kita bahkan dapat membuat ini kelihatan lebih samar menggunakan
perpustakaan super popular dipanggil jQuery.
Malah jQuery dan JavaScript sering dicampurkan.
Dan apa yang kita akan lakukan pada hari Rabu adalah satu permulaan menggunakan bahasa ini dan perpustakaan ini
untuk membina semakin tak segerak dan aplikasi dinamik
seperti peta mendapatkan aplikasi, aplikasi
yang update laman web secara real masa, seperti Facebook atau Gchat
lakukan, dan tidak lagi membataskan diri kita kepada Memukul Dikirim oleh mendapatkan atau hanya jawatan
sahaja.
Jadi saya akan melihat anda pada hari Rabu.
>> [MUSIK BERMAIN]