XML DOM - XMLHttpRequest ¶ÔÏó

XMLHttpRequest ¶ÔÏó

XMLHttpRequest ¶ÔÏóÌṩÁË¶Ô HTTP ЭÒéµÄÍêÈ«µÄ·ÃÎÊ£¬°üÀ¨×ö³ö POST ºÍ HEAD ÇëÇóÒÔ¼°ÆÕͨµÄ GET ÇëÇóµÄÄÜÁ¦¡£XMLHttpRequest ¿ÉÒÔͬ²½»òÒì²½µØ·µ»Ø Web ·þÎñÆ÷µÄÏìÓ¦£¬²¢ÇÒÄܹ»ÒÔÎı¾»òÕßÒ»¸ö DOM ÎĵµµÄÐÎʽ·µ»ØÄÚÈÝ¡£

¾¡¹ÜÃûΪ XMLHttpRequest£¬Ëü²¢²»ÏÞÓÚºÍ XML ÎĵµÒ»ÆðʹÓãºËü¿ÉÒÔ½ÓÊÕÈκÎÐÎʽµÄÎı¾Îĵµ¡£

XMLHttpRequest ¶ÔÏóÊÇÃûΪ AJAX µÄ Web Ó¦ÓóÌÐò¼Ü¹¹µÄÒ»Ïî¹Ø¼ü¹¦ÄÜ¡£

ä¯ÀÀÆ÷Ö§³Ö

XMLHttpRequest µÃµ½ÁËËùÓÐÏÖ´úä¯ÀÀÆ÷½ÏºÃµÄÖ§³Ö¡£Î¨Ò»µÄä¯ÀÀÆ÷ÒÀÀµÐÔÉæ¼° XMLHttpRequest ¶ÔÏóµÄ´´½¨¡£ÔÚ IE 5 ºÍ IE 6 ÖУ¬±ØÐëʹÓÃÌØ¶¨ÓÚ IE µÄ ActiveXObject() ¹¹Ô캯Êý¡£ÕýÈçÔÚ XMLHttpRequest ¶ÔÏó ÕâÒ»½ÚËù½éÉܵġ£

W3C ±ê×¼»¯

XMLHttpRequest ¶ÔÏó»¹Ã»Óбê×¼»¯£¬µ«ÊÇ W3C ÒѾ­¿ªÊ¼Á˱ê×¼»¯µÄ¹¤×÷£¬±¾ÊÖ²á½éÉܵÄÄÚÈݶ¼ÊÇ»ùÓÚ±ê×¼»¯µÄ¹¤×÷²Ý°¸¡£

µ±Ç°µÄ XMLHttpRequest ʵÏÖÒѾ­Ï൱һÖ¡£µ«ÊǺͱê×¼ÓÐϸ΢µÄ²»Í¬¡£ÀýÈ磬һ¸öʵÏÖ¿ÉÄÜ·µ»Ø null£¬¶ø±ê×¼ÒªÇóÊÇ¿Õ×Ö·û´®£¬»òÕßʵÏÖ¿ÉÄÜ°Ñ readyState ÉèÖÃΪ 3 ¶ø²»±£Ö¤ËùÓеÄÏìӦͷ²¿¶¼¿ÉÓá£

ÊôÐÔ

readyState

HTTP ÇëÇóµÄ״̬.µ±Ò»¸ö XMLHttpRequest ³õ´Î´´½¨Ê±£¬Õâ¸öÊôÐÔµÄÖµ´Ó 0 ¿ªÊ¼£¬Ö±µ½½ÓÊÕµ½ÍêÕûµÄ HTTP ÏìÓ¦£¬Õâ¸öÖµÔö¼Óµ½ 4¡£

5 ¸ö״̬ÖÐÿһ¸ö¶¼ÓÐÒ»¸öÏà¹ØÁªµÄ·ÇÕýʽµÄÃû³Æ£¬Ï±íÁгöÁË״̬¡¢Ãû³ÆºÍº¬Ò壺

״̬ Ãû³Æ ÃèÊö
0 Uninitialized ³õʼ»¯×´Ì¬¡£XMLHttpRequest ¶ÔÏóÒÑ´´½¨»òÒѱ» abort() ·½·¨ÖØÖá£
1 Open open() ·½·¨Òѵ÷Ó㬵«ÊÇ send() ·½·¨Î´µ÷Óá£ÇëÇó»¹Ã»Óб»·¢ËÍ¡£
2 Sent Send() ·½·¨Òѵ÷Óã¬HTTP ÇëÇóÒÑ·¢Ë͵½ Web ·þÎñÆ÷¡£Î´½ÓÊÕµ½ÏìÓ¦¡£
3 Receiving ËùÓÐÏìӦͷ²¿¶¼ÒѾ­½ÓÊÕµ½¡£ÏìÓ¦Ì忪ʼ½ÓÊÕµ«Î´Íê³É¡£
4 Loaded HTTP ÏìÓ¦ÒѾ­ÍêÈ«½ÓÊÕ¡£

readyState µÄÖµ²»»áµÝ¼õ£¬³ý·Çµ±Ò»¸öÇëÇóÔÚ´¦Àí¹ý³ÌÖеÄʱºòµ÷ÓÃÁË abort() »ò open() ·½·¨¡£Ã¿´ÎÕâ¸öÊôÐÔµÄÖµÔö¼ÓµÄʱºò£¬¶¼»á´¥·¢ onreadystatechange ʼþ¾ä±ú¡£

responseText

ĿǰΪֹΪ·þÎñÆ÷½ÓÊÕµ½µÄÏìÓ¦Ì壨²»°üÀ¨Í·²¿£©£¬»òÕßÈç¹û»¹Ã»ÓнÓÊÕµ½Êý¾ÝµÄ»°£¬¾ÍÊÇ¿Õ×Ö·û´®¡£

Èç¹û readyState СÓÚ 3£¬Õâ¸öÊôÐÔ¾ÍÊÇÒ»¸ö¿Õ×Ö·û´®¡£µ± readyState Ϊ 3£¬Õâ¸öÊôÐÔ·µ»ØÄ¿Ç°ÒѾ­½ÓÊÕµÄÏìÓ¦²¿·Ö¡£Èç¹û readyState Ϊ 4£¬Õâ¸öÊôÐÔ±£´æÁËÍêÕûµÄÏìÓ¦Ìå¡£

Èç¹ûÏìÓ¦°üº¬ÁËΪÏìÓ¦ÌåÖ¸¶¨×Ö·û±àÂëµÄÍ·²¿£¬¾ÍʹÓøñàÂë¡£·ñÔò£¬¼Ù¶¨Ê¹Óà Unicode UTF-8¡£

responseXML

¶ÔÇëÇóµÄÏìÓ¦£¬½âÎöΪ XML ²¢×÷Ϊ Document ¶ÔÏ󷵻ء£

status

ÓÉ·þÎñÆ÷·µ»ØµÄ HTTP ״̬´úÂ룬Èç 200 ±íʾ³É¹¦£¬¶ø 404 ±íʾ "Not Found" ´íÎó¡£µ± readyState СÓÚ 3 µÄʱºò¶ÁÈ¡ÕâÒ»ÊôÐԻᵼÖÂÒ»¸öÒì³£¡£

statusText

Õâ¸öÊôÐÔÓÃÃû³Æ¶ø²»ÊÇÊý×ÖÖ¸¶¨ÁËÇëÇóµÄ HTTP µÄ״̬´úÂë¡£Ò²¾ÍÊÇ˵£¬µ±×´Ì¬Îª 200 µÄʱºòËüÊÇ "OK"£¬µ±×´Ì¬Îª 404 µÄʱºòËüÊÇ "Not Found"¡£ºÍ status ÊôÐÔÒ»Ñù£¬µ± readyState СÓÚ 3 µÄʱºò¶ÁÈ¡ÕâÒ»ÊôÐԻᵼÖÂÒ»¸öÒì³£¡£

ʼþ¾ä±ú

onreadystatechange

ÿ´Î readyState ÊôÐԸıäµÄʱºòµ÷ÓõÄʼþ¾ä±úº¯Êý¡£µ± readyState Ϊ 3 ʱ£¬ËüÒ²¿ÉÄܵ÷Óöà´Î¡£

·½·¨

abort()

È¡Ïûµ±Ç°ÏìÓ¦£¬¹Ø±ÕÁ¬½Ó²¢ÇÒ½áÊøÈκÎδ¾öµÄÍøÂç»î¶¯¡£

Õâ¸ö·½·¨°Ñ XMLHttpRequest ¶ÔÏóÖØÖÃΪ readyState Ϊ 0 µÄ״̬£¬²¢ÇÒÈ¡ÏûËùÓÐδ¾öµÄÍøÂç»î¶¯¡£ÀýÈ磬Èç¹ûÇëÇóÓÃÁËÌ«³¤Ê±¼ä£¬¶øÇÒÏìÓ¦²»ÔÙ±ØÒªµÄʱºò£¬¿ÉÒÔµ÷ÓÃÕâ¸ö·½·¨¡£

getAllResponseHeaders()

°Ñ HTTP ÏìӦͷ²¿×÷Ϊδ½âÎöµÄ×Ö·û´®·µ»Ø¡£

Èç¹û readyState СÓÚ 3£¬Õâ¸ö·½·¨·µ»Ø null¡£·ñÔò£¬Ëü·µ»Ø·þÎñÆ÷·¢Ë͵ÄËùÓÐ HTTP ÏìÓ¦µÄÍ·²¿¡£Í·²¿×÷Ϊµ¥¸öµÄ×Ö·û´®·µ»Ø£¬Ò»ÐÐÒ»¸öÍ·²¿¡£Ã¿ÐÐÓû»Ðзû "\r\n" ¸ô¿ª¡£

getResponseHeader()

·µ»ØÖ¸¶¨µÄ HTTP ÏìӦͷ²¿µÄÖµ¡£Æä²ÎÊýÊÇÒª·µ»ØµÄ HTTP ÏìӦͷ²¿µÄÃû³Æ¡£¿ÉÒÔʹÓÃÈκδóСдÀ´Öƶ¨Õâ¸öÍ·²¿Ãû×Ö£¬ºÍÏìӦͷ²¿µÄ±È½ÏÊDz»Çø·Ö´óСдµÄ¡£

¸Ã·½·¨µÄ·µ»ØÖµÊÇÖ¸¶¨µÄ HTTP ÏìӦͷ²¿µÄÖµ£¬Èç¹ûûÓнÓÊÕµ½Õâ¸öÍ·²¿»òÕß readyState СÓÚ 3 ÔòΪ¿Õ×Ö·û´®¡£Èç¹û½ÓÊÕµ½¶à¸öÓÐÖ¸¶¨Ãû³ÆµÄÍ·²¿£¬Õâ¸öÍ·²¿µÄÖµ±»Á¬½ÓÆðÀ´²¢·µ»Ø£¬Ê¹ÓöººÅºÍ¿Õ¸ñ·Ö¸ô¿ª¸÷¸öÍ·²¿µÄÖµ¡£

open()

³õʼ»¯ HTTP ÇëÇó²ÎÊý£¬ÀýÈç URL ºÍ HTTP ·½·¨£¬µ«ÊDz¢²»·¢ËÍÇëÇó¡£

send()

·¢ËÍ HTTP ÇëÇó£¬Ê¹Óô«µÝ¸ø open() ·½·¨µÄ²ÎÊý£¬ÒÔ¼°´«µÝ¸ø¸Ã·½·¨µÄ¿ÉÑ¡ÇëÇóÌå¡£

setRequestHeader()

ÏòÒ»¸ö´ò¿ªµ«Î´·¢Ë͵ÄÇëÇóÉèÖûòÌí¼ÓÒ»¸ö HTTP ÇëÇó¡£

XMLHttpRequest.open()

³õʼ»¯ HTTP ÇëÇó²ÎÊý

Óï·¨

open(method, url, async, username, password)

method ²ÎÊýÊÇÓÃÓÚÇëÇóµÄ HTTP ·½·¨¡£Öµ°üÀ¨ GET¡¢POST ºÍ HEAD¡£

url ²ÎÊýÊÇÇëÇóµÄÖ÷Ìå¡£´ó¶àÊýä¯ÀÀÆ÷ʵʩÁËÒ»¸öͬԴ°²È«²ßÂÔ£¬²¢ÇÒÒªÇóÕâ¸ö URL Óë°üº¬½Å±¾µÄÎı¾¾ßÓÐÏàͬµÄÖ÷»úÃûºÍ¶Ë¿Ú¡£

async ²ÎÊýָʾÇëÇóʹÓÃÓ¦¸ÃÒì²½µØÖ´ÐС£Èç¹ûÕâ¸ö²ÎÊýÊÇ false£¬ÇëÇóÊÇͬ²½µÄ£¬ºóÐø¶Ô send() µÄµ÷Óý«×èÈû£¬Ö±µ½ÏìÓ¦ÍêÈ«½ÓÊÕ¡£Èç¹ûÕâ¸ö²ÎÊýÊÇ true »òÊ¡ÂÔ£¬ÇëÇóÊÇÒì²½µÄ£¬ÇÒͨ³£ÐèÒªÒ»¸ö onreadystatechange ʼþ¾ä±ú¡£

username ºÍ password ²ÎÊýÊÇ¿ÉÑ¡µÄ£¬Îª url ËùÐèµÄÊÚȨÌṩÈÏÖ¤×ʸñ¡£Èç¹ûÖ¸¶¨ÁË£¬ËüÃǻḲ¸Ç url ×Ô¼ºÖ¸¶¨µÄÈκÎ×ʸñ¡£

˵Ã÷

Õâ¸ö·½·¨³õʼ»¯ÇëÇó²ÎÊýÒÔ¹© send() ·½·¨ÉÔºóʹÓá£Ëü°Ñ readyState ÉèÖÃΪ 1£¬É¾³ý֮ǰָ¶¨µÄËùÓÐÇëÇóÍ·²¿£¬ÒÔ¼°Ö®Ç°½ÓÊÕµÄËùÓÐÏìӦͷ²¿£¬²¢ÇÒ°Ñ responseText¡¢responseXML¡¢status ÒÔ¼° statusText ²ÎÊýÉèÖÃΪËüÃǵÄĬÈÏÖµ¡£µ± readyState Ϊ 0 µÄʱºò£¨µ± XMLHttpRequest ¶ÔÏó¸Õ´´½¨»òÕß abort() ·½·¨µ÷Óúó£©ÒÔ¼°µ± readyState Ϊ 4 ʱ£¨ÒѾ­½ÓÊÕÏìӦʱ£©£¬µ÷ÓÃÕâ¸ö·½·¨Êǰ²È«µÄ¡£µ±Õë¶ÔÈÎºÎÆäËû״̬µ÷ÓõÄʱºò£¬open() ·½·¨µÄÐÐΪÊÇΪָ¶¨µÄ¡£

³ýÁ˱£´æ¹© send() ·½·¨Ê¹ÓõÄÇëÇó²ÎÊý£¬ÒÔ¼°ÖØÖà XMLHttpRequest ¶ÔÏóÒԱ㸴Óã¬open() ·½·¨Ã»ÓÐÆäËûµÄÐÐΪ¡£ÒªÌرð×¢Ò⣬µ±Õâ¸ö·½·¨µ÷ÓõÄʱºò£¬ÊµÏÖͨ³£²»»á´ò¿ªÒ»¸öµ½ Web ·þÎñÆ÷µÄÍøÂçÁ¬½Ó¡£

XMLHttpRequest.send()

·¢ËÍÒ»¸ö HTTP ÇëÇó

Óï·¨

send(body)

Èç¹ûͨ¹ýµ÷Óà open() Ö¸¶¨µÄ HTTP ·½·¨ÊÇ POST »ò PUT£¬body ²ÎÊýÖ¸¶¨ÁËÇëÇóÌ壬×÷Ϊһ¸ö×Ö·û´®»òÕß Document ¶ÔÏó¡£Èç¹ûÇëÇóÌå²»ÊʱØÐëµÄ»°£¬Õâ¸ö²ÎÊý¾ÍΪ null¡£¶ÔÓÚÈÎºÎÆäËû·½·¨£¬Õâ¸ö²ÎÊýÊDz»¿ÉÓõģ¬Ó¦¸ÃΪ null£¨ÓÐЩʵÏÖ²»ÔÊÐíÊ¡ÂԸòÎÊý£©¡£

˵Ã÷

Õâ¸ö·½·¨µ¼ÖÂÒ»¸ö HTTP ÇëÇó·¢ËÍ¡£Èç¹û֮ǰûÓе÷Óà open()£¬»òÕ߸ü¾ßÌåµØËµ£¬Èç¹û readyState ²»ÊÇ 1£¬send() Å׳öÒ»¸öÒì³£¡£·ñÔò£¬Ëü·¢ËÍÒ»¸ö HTTP ÇëÇ󣬸ÃÇëÇóÓÉÒÔϼ¸²¿·Ö×é³É£º

  • ֮ǰµ÷Óà open() ʱָ¶¨µÄ HTTP ·½·¨¡¢URL ÒÔ¼°ÈÏÖ¤×ʸñ£¨Èç¹ûÓеϰ£©¡£
  • ֮ǰµ÷Óà setRequestHeader() ʱָ¶¨µÄÇëÇóÍ·²¿£¨Èç¹ûÓеϰ£©¡£
  • ´«µÝ¸øÕâ¸ö·½·¨µÄ body ²ÎÊý¡£

Ò»µ©ÇëÇó·¢²¼ÁË£¬send() °Ñ readyState ÉèÖÃΪ 2£¬²¢´¥·¢ onreadystatechange ʼþ¾ä±ú¡£

Èç¹û֮ǰµ÷ÓÃµÄ open() ²ÎÊý async Ϊ false£¬Õâ¸ö·½·¨»á×èÈû²¢²»»á·µ»Ø£¬Ö±µ½ readyState Ϊ 4 ²¢ÇÒ·þÎñÆ÷µÄÏìÓ¦±»ÍêÈ«½ÓÊÕ¡£·ñÔò£¬Èç¹û async ²ÎÊýΪ true£¬»òÕßÕâ¸ö²ÎÊýÊ¡ÂÔÁË£¬send() Á¢¼´·µ»Ø£¬²¢ÇÒÕýÈçºóÃæËù½éÉܵ쬷þÎñÆ÷ÏìÓ¦½«ÔÚÒ»¸öºǫ́Ïß³ÌÖд¦Àí¡£

Èç¹û·þÎñÆ÷ÏìÓ¦´øÓÐÒ»¸ö HTTP ÖØ¶¨Ïò£¬send() ·½·¨»òºǫ́Ïß³Ì×Ô¶¯×ñ´ÓÖØ¶¨Ïò¡£µ±ËùÓÐµÄ HTTP ÏìӦͷ²¿ÒѾ­½ÓÊÕ£¬send() »òºǫ́Ïß³Ì°Ñ readyState ÉèÖÃΪ 3 ²¢´¥·¢ onreadystatechange ʼþ¾ä±ú¡£Èç¹ûÏìÓ¦½Ï³¤£¬send() »òºǫ́Ï߳̿ÉÄÜÔÚ״̬ 3 Öд¥·¢ onreadystatechange ʼþ¾ä±ú£ºÕâ¿ÉÒÔ×÷Ϊһ¸öÏÂÔØ½ø¶ÈָʾÆ÷¡£×îºó£¬µ±ÏìÓ¦Íê³É£¬send() »òºǫ́Ïß³Ì°Ñ readyState ÉèÖÃΪ 4£¬²¢×îºóÒ»´Î´¥·¢Ê¼þ¾ä±ú¡£

XMLHttpRequest.setRequestHeader()

Óï·¨

setRequestHeader(name, value)

name ²ÎÊýÊÇÒªÉèÖõÄÍ·²¿µÄÃû³Æ¡£Õâ¸ö²ÎÊý²»Ó¦¸Ã°üÀ¨¿Õ°×¡¢Ã°ºÅ»ò»»ÐС£

value ²ÎÊýÊÇÍ·²¿µÄÖµ¡£Õâ¸ö²ÎÊý²»Ó¦¸Ã°üÀ¨»»ÐС£

˵Ã÷

setRequestHeader() ·½·¨Ö¸¶¨ÁËÒ»¸ö HTTP ÇëÇóµÄÍ·²¿£¬ËüÓ¦¸Ã°üº¬ÔÚͨ¹ýºóÐø send() µ÷Óöø·¢²¼µÄÇëÇóÖС£Õâ¸ö·½·¨Ö»Óе± readyState Ϊ 1 µÄʱºò²ÅÄܵ÷Óã¬ÀýÈ磬ÔÚµ÷ÓÃÁË open() Ö®ºó£¬µ«ÔÚµ÷Óà send() ֮ǰ¡£

Èç¹û´øÓÐÖ¸¶¨Ãû³ÆµÄÍ·²¿ÒѾ­±»Ö¸¶¨ÁË£¬Õâ¸öÍ·²¿µÄÐÂÖµ¾ÍÊÇ£ºÖ®Ç°Ö¸¶¨µÄÖµ£¬¼ÓÉ϶ººÅ¡¢¿Õ°×ÒÔ¼°Õâ¸öµ÷ÓÃÖ¸¶¨µÄÖµ¡£

Èç¹û open() µ÷ÓÃÖ¸¶¨ÁËÈÏÖ¤×ʸñ£¬XMLHttpRequest ×Ô¶¯·¢ËÍÒ»¸öÊʵ±µÄ Authorization ÇëÇóÍ·²¿¡£µ«ÊÇ£¬Äã¿ÉÒÔʹÓà setRequestHeader() À´Ìí¼ÓÕâ¸öÍ·²¿¡£ÀàËÆµØ£¬Èç¹û Web ·þÎñÆ÷ÒѾ­±£´æÁ˺ʹ«µÝ¸ø open() µÄ URL Ïà¹ØÁªµÄ cookie£¬Êʵ±µÄ Cookie »ò Cookie2 Í·²¿Ò²×Ô¶¯µØ°üº¬µ½ÇëÇóÖС£¿ÉÒÔͨ¹ýµ÷Óà setRequestHeader() À´°ÑÕâЩ cookie Ìí¼Óµ½Í·²¿¡£XMLHttpRequest Ò²¿ÉÒÔΪ User-Agent Í·²¿Ìṩһ¸öĬÈÏÖµ¡£Èç¹ûËüÕâô×ö£¬ÄãΪ¸ÃÍ·²¿Ö¸¶¨µÄÈκÎÖµ¶¼»áÌí¼Óµ½Õâ¸öĬÈÏÖµºóÃæ¡£

ÓÐЩÇëÇóÍ·²¿ÓÉ XMLHttpRequest ×Ô¶¯ÉèÖöø²»ÊÇÓÉÕâ¸ö·½·¨ÉèÖã¬ÒÔ·ûºÏ HTTP ЭÒé¡£Õâ°üÀ¨ÈçϺʹúÀíÏà¹ØµÄÍ·²¿£º

  • Host
  • Connection
  • Keep-Alive
  • Accept-charset
  • Accept-Encoding
  • If-Modified-Since
  • If-None-Match
  • If-Range
  • Range
VUE