[సంగీతాన్ని]
>> డౌ LLOYD: సో ఒక మరింత భావన యొక్క విధమైన ఆ
విధమైన గొడుగు కింద వస్తుంది జావాస్క్రిప్ట్ AJAX అనే విషయం.
ఆ సమయం వరకు మా జావాస్క్రిప్ట్ తో పరస్పర
ఒక పుష్ కు పరిమితం చేసింది బటన్ మరియు ఏదో జరుగుతుంది.
మరియు ప్రత్యేకంగా, జరిగినప్పుడు ఏదో
మా వెబ్సైట్లను చూడండి మరియు మార్పులు అనుభూతి ఉంటుంది.
కుడి?
ముఖ్యంగా వంటి, డాక్యుమెంట్ ఆబ్జెక్ట్ మోడల్ వీడియో,
నేను నేపథ్య రంగు.
నేను చేసినవి ఉన్నప్పుడు, నేను లేదు ఏ ప్రత్యేక అదనపు అభ్యర్థనలు చేయాలని.
నేను అభ్యర్థించవచ్చు లేదు సర్వర్ నాకు ఒక క్రొత్త పేజీ పంపండి.
నేను అప్పటికే ఏమి మార్చబడింది.
నేను నా పేజీ రీలోడ్ లేదు మరియు విషయాలు ఖచ్చితంగా మార్చబడింది
కాబట్టి ఆ గొప్ప.
కానీ ఖచ్చితంగా ఉంది కొన్ని మాన్యువల్ వినియోగదారు పరస్పర చర్య పాల్గొన్నారు.
AJAX అనుమతించే ఒక చల్లని టెక్నిక్ మాకు ఒక పేజీ యొక్క కంటెంట్ నవీకరించుటకు,
మరియు కేవలం లుక్ మరియు రీలోడ్ లేకుండా, అనుభూతి.
>> ఎప్పుడు ప్రత్యేకంగా నేను ఒక పేజీ యొక్క కంటెంట్ నవీకరించుటకు చెప్పటానికి,
మనం తిరగరాసే చెప్పడం లేదు జావాస్క్రిప్ట్ ఉపయోగించి పేజీ.
నేను మేము నిజానికి అభ్యర్థించవచ్చు మాట్లాడుతూ నేను సర్వర్ నుండి మరింత సమాచారం
మా పేజీ రీలోడ్ చేయకుండా.
>> ఒక బిట్ యొక్క ఇప్పుడు ఆ విధమైన మరింత ఆధునిక సాంకేతికత
మేము మాట్లాడటానికి చూడాలని ఈ వీడియో లో.
మేము కొన్ని పరస్పర చూడాలని.
కానీ మేము చేసినప్పుడు, నేను వెళుతున్న వెబ్ సర్వర్కు అభ్యర్థనలను మేకింగ్.
ఈ సందర్భంలో, కేవలం ఏమిటి నా Apache వెబ్ సేవికను నడుపుతోంది.
నేను అదనపు చేస్తున్నట్లు వెళుతున్న అభ్యర్థనలు నేను ఒక వెబ్ పేజీని సందర్శించడం చేస్తున్నాను అయితే
కానీ నా పేజీ రిఫ్రెష్ కాదు.
>> ఇది కేవలం జరగబోతోంది క్రమపద్దతిలో నా పేజీ అప్డేట్.
మరియు ఆ, నిజానికి, ఉంది AJAX ఉన్నచో,
అసిన్క్రోనస్ జావాస్క్రిప్ట్ మరియు XML ఉంది.
XML మార్కప్ మరొక రకమైన భాష మరియు మీరు యొక్క క్రమం చేయవచ్చు
కేవలం HTML వంటి ఆలోచించి.
ఇది చాలా అదే విషయం కాదు కానీ ఇది కేవలం ఒక మార్కప్ భాష.
కనుక ఇది ఒక అసమకాలిక వార్తలు JavaScript మరియు మార్కప్ భాష.
>> కాబట్టి ఈ ఉపయోగించడానికి క్రమంలో AJAX technique-- AJAX
ఒక ప్రత్యేక ప్రోగ్రామింగ్ భాష కాదు.
ఇది ఒక కేవలం విధమైన ఉంది techniques-- మేము సమితి
ఒక ప్రత్యేక సృష్టించాలి జావాస్క్రిప్ట్ వస్తువు, ఇది
ఒక XMLHttpRequest అంటారు.
ఇప్పుడు, దీన్ని చాలా సులభం.
మేము చెప్పటానికి var, సంసార మేము ఈ వస్తువు కాల్ కావలసినట్లు,
కొత్త XMLHttpRequest సమానం.
మరియు ఇప్పుడు మేము ఇప్పుడు పొందిన వస్తువు యొక్క ఒక AJAX విధమైన,
లేదా ఒక XMLHttpRequest అనుమతిస్తుంది ఇది వస్తువు,
మాకు క్రమపద్దతిలో మా పేజీ అప్డేట్.
>> మేము ఈ కొత్త ఉండాల్సిందని తరువాత వస్తువు, ఈ XMLHttpRequest,
మేము ఏదో చేయాల్సిందల్లా దాని onreadystatechange ప్రవర్తన.
Onreadystatechange ప్రవర్తన నిజంగా కేవలం
మీరు ఒక అభ్యర్థనను చేస్తే ఒక వెబ్ పేజీ, పేజీ
దశలను సంఖ్య గుండా వెళుతుంది.
మొదటి, ఒక అభ్యర్థనను పంపింది చేయలేదు.
అప్పుడు, అభ్యర్థన ఉంది పంపాడు గానీ అమలు చేయలేదు.
అప్పుడు అభ్యర్థనపై నటించింది చెయ్యబడింది.
అప్పుడు అభ్యర్థన ఉంది మీరు తిరిగి పంపబడింది.
>> అప్పుడు, అభ్యర్థన ఉంది పూర్తిగా మీ పేజీ లో లోడ్.
ఆ వివిధ రాష్ట్రాలు ఉన్నాయి.
కాబట్టి మేము మా సెట్ అవసరం కొత్త XMLHttpRequest వస్తువు
సిద్ధమైన రాష్ట్ర మార్పులు మార్చడానికి.
మరియు సాధారణంగా, మేము ద్వారా దీన్ని ఒక అనామక ఫంక్షన్, మొదలైనవి ఏ
మేము నుండి తెలిసి ఇప్పుడు JavaScript, ఆ
సిద్ధమైన రాష్ట్ర మార్పులు అంటారు.
ఇది కంటే నిజంగా చాలా ఎక్కువ అనిపిస్తుంది.
మేము కేవలం ఒక నిర్వచించు చూడాలని అనామక ఫంక్షన్ విధమైన ఇష్టం ఏమిటి
మేము చేస్తున్న జావాస్క్రిప్ట్, ఇక్కడ మనం చేస్తాను
ఒక అనామక ఫంక్షన్ కలిగి పై క్లిక్ స్పందిస్తారు,
లేదా మేము ఒక చిహ్నం చేస్తున్న సమయంలో వ్యూహంలో వివిధ వస్తువులు.
>> ఏదో చేసినప్పుడు జరిగిన ఏదో క్లిక్.
ఈ సందర్భంలో, అది కేవలం ఏదో ఉంది జరుగుతున్న ఉన్నప్పుడు మా పేజీ రాష్ట్ర
మార్పులు.
రెండు ఇతర వసతులలో విధమైన వారు కాదని ఆ
అని మాత్రమే లక్షణాలు XMLHttpRequest స్వాభావిక,
కానీ వారు అందంగా ముఖ్యమైన వాటిని ఉన్నాము.
ReadyState అని ఏదో ఉంది, ఇది మీరు బహుశా అంచనా వంటి,
onreadystatechange దగ్గరి సంబంధం ఉంది.
ఇది నిజానికి మీరు చెబుతుంది readyState ఏమిటి.
0, 1, 2, 3, మరియు 4 అక్కడ అవకాశాలను,
మరియు వారు విధమైన సుమారు అనుగుణ్యమైన ఏమి
నేను రెండవ క్రితం గురించి మాట్లాడుతున్నాను.
>> ఆపై స్థితి, దీనిలో ఆశాజనక ప్రతిదీ OK గనక,
చిన్న ఇది 200 కోసం, కోర్సు యొక్క, OK,
మేము HTTP నుండి తెలిసిన ఇది.
కాబట్టి మేము ఆశతో చేస్తున్న మా సిద్ధంగా రాష్ట్ర నాలుగు, మరియు మా స్థితి 200 ఉంది.
మరియు మా సిద్ధంగా రాష్ట్ర ఉంటే నాలుగు, మరియు స్పందన
లో పెట్టడానికి సిద్ధంగా ఉంది పేజీ, మరియు స్థితి 200,
మేము ఏమి సాధించారు ప్రతిదీ విజయవంతంగా
ఇప్పుడు మేము క్రమపద్దతిలో చెయ్యవచ్చు మా పేజీ అప్డేట్
రీలోడ్ చేయకుండా అది మొత్తం కంటెంట్.
>> మేము ఏమి నిర్వచించిన చేసిన తరువాత onreadystatechange ప్రవర్తన కారణంగా,
మరియు మేము ఆ తనిఖీ చేసిన readyState 4, మరియు స్థితి 200
అప్పుడు మేము అవసరం అన్ని ఉంది ఒక అసమకాలిక తెరుచుకుంటుంది
అభ్యర్థన, కేవలం ఇది చేస్తోందా ఒక HTTP సాధారణంగా అభ్యర్థన GET.
జస్ట్ programmatically చేయడం, బదులుగా మా వెబ్ బ్రౌజర్ ద్వారా యొక్క.
ఆపై ఆ అభ్యర్థన పంపండి.
సో వాట్ బహుశా ఈ చేస్తుంది సందర్భంలో కనిపిస్తుంది?
కాబట్టి ఇక్కడ ఒక ఫంక్షన్ అని అజాక్స్ అభ్యర్ధనలు తో ఒప్పందాలు.
అలాగే?
నేను ఏకపక్ష చెప్పాడు చేసిన ఇది ఒక వాదన అంగీకరిస్తుంది.
మరియు ఈ ఒక యొక్క ఒక విధమైన ఇక్కడ సాధారణ అస్థిపంజరం.
చాలా ప్రారంభంలో, మేము పొందుటకు మమ్మల్ని ఒక కొత్త XMLHttpRequest వస్తువు.
అప్పుడు, నేను సెట్ అవసరం onreadystatechange ప్రవర్తన.
కాబట్టి నేను చెప్పడానికి వెళుతున్నాను ఉన్నప్పుడు readyState మార్పులు
నేను మీరు ఈ ఫంక్షన్ కాల్ అనుకుందాం.
>> గోవా వెళ్తున్నారు దీనిలో ప్రశ్న readyState ఉంటే
readyState మారితే, 4 4, మరియు హోదా 200 కు,
కాబట్టి మేము నేను, ఒక విజయవంతమైన అభ్యర్థన వచ్చింది పేజీకి ఏదో చేయాలనుకుంటున్నారా.
మరియు మేము పరిశీలించి చేస్తాము ఒక ఉదాహరణ ఏమి
ఏదో ఒక సెకనులో కావచ్చు.
కాబట్టి అప్పుడు, ఇప్పుడు నేను నిర్వచించారు నా అనామక ఫంక్షన్,
నా స్పందన ఫంక్షన్ చేసినప్పుడు readyState మార్పులు.
>> కాబట్టి అప్పుడు నేను కేవలం ఒక అప్ తెరవడానికి అవసరం ఓపెన్ పద్ధతి ఉపయోగించి, అభ్యర్థించవచ్చు.
ఆపై, నేను ఆ అభ్యర్థన పంపండి.
మరియు యొక్క పరిశీలించి తెలియజేయండి మరింత కాంక్రీటు ఉదాహరణ
ఏమి AJAX మా వెబ్ పేజీల్లో ఏమి చేయవచ్చు.
కాబట్టి నేను ఇక్కడ చాలా సులభమైన ఉంటుంది పేజీ home.html అని.
నేను ఒక సమాచారం వెళుతుంది పొందారు ఇక్కడ మరియు డ్రాప్-డౌన్ మెను విధమైన.
>> మరియు మేము ఒక రెండవ ఈ సందర్శించండి చేస్తాము.
కానీ మనం ఇప్పుడు ఒక తీసుకోవాలి అనుకుంటున్నాను అసలు సోర్స్ కోడ్ వద్ద చూడండి.
అందుకే నేను home.html తెరవటానికి వెళుతున్న.
మరియు మేము జరగబోతోంది ఏమి చూస్తారు.
ఇక్కడ చాలా ఎగువన అప్ సో, నేను కలిగి జరగబోతోంది కొన్ని జావాస్క్రిప్ట్ stuff.
>> మరియు ఇక్కడ, నేను స్పష్టంగా కలిగి దీని ID infodiv ఒక div,
మరియు కొన్ని సమాచారం అక్కడ వెళ్ళడానికి వెళ్తున్నారు.
ఆపై నేను ఈ రూపంలో.
మరియు ఈ లోపల రూపం, నేను ఏదైనా కలిగి
ఒక ఎంచుకోండి, ఇది పిలుపునిచ్చింది కేవలం ఒక డ్రాప్-డౌన్ మెనూ ఉంది
వివిధ ఎంపికలు ఒక సమూహం తో.
మరియు ఆ, ఉన్నప్పుడు మార్చే స్పష్టంగా ఉన్నప్పుడు ఎంపిక చేయబడిందని ఎంపికను కలిగి
మార్చబడింది, నేను కాల్ వెళుతున్న కొన్ని ఫంక్షన్ cs50Info,
ఆపై నేను వెళుతున్న this.value లో పాస్,
ఎక్కడ ఈ సూచిస్తుంది ఇది ఐచ్ఛికాన్ని ఎంపిక చేసినట్లు
మరియు విలువ, ఇక్కడ ఎంపిక వీటిలో ఒకటి విలువ = సమానం ఖాళీ, "blumberg,"
"బౌడెన్," "చాన్" మరియు "మలన్."
>> సో వాట్ వాస్తవానికి వాటిని నేను ఈ చేసినప్పుడు ఇక్కడ జరిగే?
సరే, ఒక తీసుకుందాం blumberg.html చూడండి.
అది కేవలం ఒక కనిపిస్తోంది కొన్ని HTML స్నిప్పెట్.
నిజానికి, నేను ఏమి ఆశతో వెబ్ ఇక్కడ జరిగే
నేను ప్లగ్ చెయ్యలేరు వెళుతున్న ఉంది నా వెబ్ పేజీ లోకి నేరుగా ఈ HTML
రీలోడ్ చేయకుండా పేజీ, అనగా అవి ఆ
నేను డ్రాప్ డౌన్ నుండి హన్నా ఎంచుకోండి మెను, హన్నా గురించి సమాచారం,
ముఖ్యంగా, ఈ సమాచారం ఇక్కడ blumberg.html లో,
పేజీలో చూపిస్తుంది ఏమిటి.
నేను రిఫ్రెష్ కలిగి లేదు.
నేను మరొకరి ఎంచుకున్నాడు ఉంటే వారి సమాచారం చూపిస్తుంది.
నేను ఈ ఎలా చేస్తారు?
మళ్ళీ, ఈ అవసరం మాకు కొన్ని AJAX ఉపయోగించడానికి.
అందువలన, మేము ajax.js. ప్రారంభించిన చేస్తాము
మరియు ఇక్కడ, cs50Info విధి.
పేరు ఏమీ ఉంటే, నేను తిరిగి.
నేను ఉంటే ఏదైనా వెళ్ళడం లేదు ఖాళీ ఎంపిక ఎంపిక చేయబడింది.
లేకపోతే, నేను వెళుతున్న ఒక కొత్త XMLHttpRequest సృష్టించడానికి.
ఆపై నేను ఎప్పుడు చెప్పాలి వెళుతున్న readyState మార్పులు, ఈ ఫంక్షన్ కాల్.
>> మరియు readyState ఉంటే 4 మరియు స్థితి 200,
ఇక్కడ కొద్దిగా లైన్ 13 న j క్వెరీ యొక్క.
కానీ నేను చెప్పడం నేను చేస్తున్న అన్ని infodiv విషయాలు మార్చడానికి
నేను ఒక గా తిరిగి వచ్చింది మరేమిటి నా HttpRequest నుండి స్పందన.
>> నా HttpRequest ఏమిటి?
Well, అవునా ఇక్కడ లైన్ 18 మరియు 19.
లైన్ 18, నేను ప్రధానంగా తయారవుతున్నాను ఒక పేరు + .html కోసం అభ్యర్థన GET.
మరియు తిరిగి, ఇక్కడ పేరు ఉంది అని వాదన
cs50Info ఒక పారామీటర్లాగా.
>> కాబట్టి ప్రాథమికంగా, నేను ఎవరో లో ప్రయాణిస్తున్న am ఎంపికలు సమితి ఇది, పేరు
మేము చూసిన డ్రాప్-డౌన్ మెను రూపంలో.
నేను ఆ పేరు పొందుతున్నాను.
మరియు నేను మీరు కోరుకుంటున్నారో మాట్లాడుతూ నేను నాకు ఆ file.html పొందటానికి దయచేసి
మరియు ఆ అభ్యర్ధనను పంపుతారు.
>> కాబట్టి ఆ onreadystatechange అన్నారు వింటూ మరియు వేచి మరియు వేచి ఉండాలి
మరియు readyState వరకు వేచి 4, మరియు స్థితి 200 ఉంది.
కనుక ఇది వడ్డిస్తారు సిద్ధంగా మరియు అభ్యర్థన విజయవంతమైంది.
అది ఉంటే మరియు, అది జరగబోతోంది infodiv విషయాలు మార్చడానికి
నేను తిరిగి వచ్చింది అని స్పందన టెక్స్ట్ ఉండాలి.
>> కాబట్టి యొక్క ఈ ఎలా చూద్దాం నిజానికి పనిచేయవచ్చు.
కాబట్టి మేము నా బ్రౌజర్ కు అధిపతిగా చేస్తాము విండో, మరియు మేము ఇక్కడ చూడండి.
కాబట్టి యొక్క పరిశీలించి తెలియజేయండి ఏమి AJAX లో ఇక్కడ జరగబోతోంది.
కాబట్టి మేము ఎవరైనా ఎంచుకోవచ్చు డ్రాప్-డౌన్ మెను నుండి.
కాబట్టి ఈ విషయంలో, లెట్స్ కేవలం హన్నా ఎంచుకోండి.
మరియు నోటీసు హన్నా యొక్క సమాచారం మార్చబడింది,
కానీ నేను any-- లేదు నా పేజీని పూర్తిగా రీలోడ్ లేదు.
Stuff బస.
వాటిలో చాలా బస.
AJAX టెస్ట్ మార్చలేదు.
బటన్ కూడా, ఈ డ్రాప్-డౌన్ మెను మార్చలేదు.
కానీ సమాచార అక్కడ మార్పు చేసింది.
మరియు విధానాలపై ఆధారపడి త్వరగా నా కంప్యూటర్ కదలికలు,
మీరు నిజంగా కంటెంట్ చూడవచ్చు అదృశ్యమవుతుంది మరియు అప్పుడు నిజంగా కనిపిస్తాడు
త్వరగా.
అనే కంటెంట్ infodiv నుండి తొలగించబడింది,
ఆపై ఒక భర్తీ కొత్త అసమకాలిక అభ్యర్థన.
>> నేను చెప్పేటంత కు మారాలని చేస్తే, Rob-- మళ్ళీ, పరిశీలించి,
మరియు బహుశా మేము నిజానికి అది చూస్తారు అదృశ్యం మరియు త్వరగా తిరిగి కనిపిస్తాయి.
మీరు ఆ చూడండి?
ఎలా అది కేవలం దూరంగా popped మరియు అప్పుడు అది రీఫిల్?
ఆ AJAX అభ్యర్థనను వార్తలు జరుగుతున్న అబ్బాయి.
అందువలన ఆధారపడి వ్యక్తి నేను ఉన్నాను, ఎంచుకోండి
వేరే అసమకాలిక మేకింగ్ వేరే ఫైల్ అభ్యర్ధనను
నేను నా సర్వర్ లో కలిగి.
మరియు యొక్క కంటెంట్లను నా infodiv డేట్ చేస్తున్నాము,
నేను ఎంచుకున్న వీటిలోని ఆధారంగా.
తద్వారా నిజంగా అన్ని AJAX అక్కడ ఉంది.
ఇది మాకు ఈ అసమకాలిక చేయడానికి అనుమతిస్తుంది అభ్యర్థనలు, ఒక పేజీ నవీకరణలు.
చేయకుండా మొత్తం పేజీ రిఫ్రెష్,
మేము కొత్త పొందడానికి వెళుతున్న చేయడం ద్వారా దాని నుండి కంటెంట్
సర్వర్కు ఒక కొత్త తాజా అభ్యర్థన.
అందువలన, మా పేజీలు తయారవుతుంది మరికొన్ని డైనమిక్.
>> మరియు మేము మరింత పొందుటకు గా మరియు మరింత ఆధునిక, మీరు
వంటి విషయాలు పొందండి ఉండవచ్చు చెప్పడానికి, మీ ఇమెయిల్ ఇన్బాక్స్,
ఇక్కడ మీరు ఏమీ లేదు.
మీరు ఒక క్లిక్ లేదు డౌన్ మెను డ్రాప్ లేదా ఏదైనా క్లిక్
మరియు అకస్మాత్తుగా అన్ని, మీ సరికొత్త ఇమెయిల్ ఎగువన అప్ చూపిస్తుంది.
కూడా కేవలం ఒక అజాక్స్ అభ్యర్థనను వార్తలు.
అజాక్స్ అభ్యర్థిస్తోంది మీ సర్వర్ ఇమెయిల్ సర్వర్
అన్ని సమాచారాన్ని పంపడానికి మీ తాజా ఇమెయిల్స్ గురించి,
మరియు మీరు చూసే మారుతున్న స్క్రీన్ ఇమెయిల్స్ మీ సరికొత్త సెట్ ఉండాలి.
మరియు మీరు ఒక కొత్త కలిగి ఉంటే ఆ DIV అక్కడ, అప్పుడు కంటెంట్
ప్రతిబింబించేలా మారుతుంది కంటెంట్ నవీకరించబడింది.
నేను డౌ లాయిడ్ ఉన్నాను.
ఈ CS50 ఉంది.