Что еще нужно для Ajax, чем эта функция
-
09-06-2019 - |
Вопрос
У меня есть небольшая функция JS, которая выполняет Ajax для меня, и еще одна такая, которая добавляет данные POST к запросу. Аякс - такая большая тема, о которой так много библиотек. Что мне не хватает в моей функции, это небезопасно или что-то еще беспокоит?
function loadPage(pagePath, displayElement)
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
}
xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
{
document.getElementById(displayElement).innerHTML = xmlHttp.responseText;
}
}
xmlHttp.open("GET", pagePath, true);
xmlHttp.send(null);
}
Решение
Я настоятельно рекомендую вам не использовать собственный код Ajax. Вместо этого используйте фреймворк, такой как Prototype, Dojo или любой другой. Они позаботились о том, чтобы обработать все готовые состояния, которые вы не обрабатываете (2 означает, что он был отправлен, 3 означает, что он находится в процессе и т. Д.), И они должны избежать ответа, который вы получаете, чтобы вы не вставили потенциально небезопасный JavaScript или что-то на вашей странице.
Еще одна вещь, которую даст вам более надежная структура, - это возможность делать больше, чем просто использовать innerHTML для замены элементов в DOM. Ваша функция здесь может использоваться только для замены одного элемента ответом на вызов ajax. С Ajax вы можете сделать гораздо больше.
Другие советы
Я бы удалил эту строку.
alert("Your browser does not support AJAX!")
Кричать на пользователя на языке, который он, вероятно, не понимает, хуже, чем провал. : -)
Я никогда не был фанатом вложенных блоков try / catch, поэтому я бы сделал это примерно так:
var xmlHttp;
if (window.XMLHttpRequest) {
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
} else if (window.ActiveXObject) {
try {
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
if (xmlHttp) {
// No errors, do whatever you need.
}
Я думаю, что это сработает. Но, как уже упоминалось ранее - зачем изобретать велосипед, используйте библиотеку. Еще лучше - узнайте, как они это делают.
jQuery, вероятно, одна из самых легких популярных библиотек.
То же самое в прототипе:
function loadPage(pagePath, displayElement) {
new Ajax.Updater(displayElement, pagePath);
}
Если вы действительно хотите увидеть, чего вам не хватает, прочитайте исходный код jQuery или Prototype для их подпрограмм ajax. Если в комментариях есть номера ошибок, поищите их.