VPF::XMLHttpRequest и AJAX. В чём различия? - Форум программистов

Elfet

Дата 17.2.2006, 17:26 (ссылка)

(нет голосов)

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

Репутация: нет
Всего: 16

XMLHttpRequest и AJAX. В чём различия? Может кто-нибудь дать что-нибудь про AJAX, желательно на русском. Как пользоваться и тп! Буду очень благодарен!

--------------------

PHP Чат Скрипт

Elfet

Дата 17.2.2006, 17:42 (ссылка)

(нет голосов)

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

Репутация: нет
Всего: 16

А кто-нибудь разберался с библеотеками IPB? C ips_xmlhttprequest.js например? smile

--------------------

PHP Чат Скрипт

Elfet

Дата 17.2.2006, 17:58 (ссылка)

(нет голосов)

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

Репутация: нет
Всего: 16

Код


//------------------------------------------------------------------------------
// IPS XML HTTP REQUEST
//------------------------------------------------------------------------------
// Supports Safari, Mozilla 1.3+ (Firefox, etc) and IE 5.5+
// (c) 2005 Invision Power Services, Inc.
// http://www.invisionpower.com
//------------------------------------------------------------------------------

try
{
    if ( ! use_charset )
    {
        var use_charset = '';
    }
}
catch( e ) { }

/*--------------------------------------------*/
// New object
/*--------------------------------------------*/

function ajax_request()
{
    this.isIE               = false;
    this.allow_use          = use_enhanced_js ? true : false;
    this.xmlhandler         = null;
    this.error_string       = '';
    this.nocache            = true;
    this.do_request_functon = function() {}
    this.loading_fired        = 0;
    this.centerdiv          = null;
}

/*--------------------------------------------*/
// Initiate
/*--------------------------------------------*/

ajax_request.prototype.xml_init = function()
{
    try
    {
        //------------------------------------------------
        // Moz, Safari, Opera
        //------------------------------------------------

        this.xmlhandler = new XMLHttpRequest();
        this.ie        = false;
        this.allow_use = true;
        return true;
    }
    catch(e)
    {
        try
        {
            //------------------------------------------------
            // IE
            //------------------------------------------------

            this.xmlhandler = new ActiveXObject('Microsoft.XMLHTTP');
            this.ie        = true;
            this.allow_use = true;
            return true;
        }
        catch(e)
        {
            this.ie        = true;
            this.allow_use = false;
            return false;
        }
    }
}

/*--------------------------------------------*/
// Actually send data
/*--------------------------------------------*/

ajax_request.prototype.process = function( url, type, post )
{
    //------------------------------------------------
    // The 'post' variable needs to be in the following format:
    //
    // var=content&var2=content&var3=content
    //
    // All values need to be escaped with encodeURIComponent();
    //------------------------------------------------

    type = type == "POST" ? "POST" : "GET";

    //------------------------------------------------
    // Use nocache where possible...
    //------------------------------------------------

    if ( this.nocache == true  && type == 'GET' )
    {
        url = this.nocache_url( url );
    }

    //------------------------------------------------
    // Make sure we're initialized
    //------------------------------------------------

    if ( ! this.xmlhandler )
    {
        this.xml_init();
    }

    //------------------------------------------------
    // Only go when ready
    //------------------------------------------------

    if ( ! this.readystate_not_ready() )
    {
        this.xmlhandler.open(type, url, true);

        if ( type == "GET" )
        {
            this.xmlhandler.send(null);
        }
        else
        {
            if ( typeof( this.xmlhandler.setRequestHeader ) != "undefined" )
            {
                this.xmlhandler.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=' + use_charset);
            }

            this.xmlhandler.send( post );
        }

        if ( this.xmlhandler.readyState == 4 && this.xmlhandler.status == 200 )
        {
            return true;
        }
    }

    return false;
}

/*--------------------------------------------*/
// retrieve text of an XML document element, including
// elements using namespaces
/*--------------------------------------------*/

ajax_request.prototype.get_element_text_ns = function(prefix, local, parentElem, index)
{
    var result = "";

    if ( prefix && this.isIE )
    {
        //-------------------------------
        // IE
        //-------------------------------

        result = parentElem.getElementsByTagName(prefix + ":" + local)[index];
    }
    else
    {
        //-------------------------------
        // Safari, Gecko
        //-------------------------------

        result = parentElem.getElementsByTagName(local)[index];
    }

    if ( result )
    {
        if (result.childNodes.length > 1)
        {
            return result.childNodes[1].nodeValue;
        }
        else
        {
            return result.firstChild.nodeValue;
        }
    }
    else
    {
        return "n/a";
    }
}

/*--------------------------------------------*/
// Make sure URL is not cached
/*--------------------------------------------*/

ajax_request.prototype.nocache_url = function (url)
{
    var sep    = ( -1 < url.indexOf("?") ) ? "&" : "?";
    var mydate = new Date();
    var newurl = url + sep + "__=" + mydate.getTime();
    return newurl;
}

/*--------------------------------------------*/
// Takes an array of:
// array[ field ] = value
// and returns a nice encoded POST string
/*--------------------------------------------*/

ajax_request.prototype.format_for_post = function( arrayfields )
{
    var str = '';

    try
    {
        for( var i in arrayfields )
        {
            str += i + '=' + this.encodeurl(arrayfields[i]) + '&';
        }
    }
    catch(e)
    {
    }

    return str;
}

/*--------------------------------------------*/
// Hand roll encode URL to UTF-8
/*--------------------------------------------*/

ajax_request.prototype.encodeurl = function( url )
{
    //-------------------------------
    // Ensure we have a string
    //-------------------------------

    url = url.toString();

    var regcheck = url.match(/[\x90-\xFF]/g);

    if ( regcheck )
    {
        for (var i = 0; i < i.length; i++)
        {
            url = url.replace(regcheck[i], '%u00' + (regcheck[i].charCodeAt(0) & 0xFF).toString(16).toUpperCase());
        }
    }

    return escape(url).replace(/\+/g, "%2B");
}


/*--------------------------------------------*/
// Check to ensure ready state-ness
/*--------------------------------------------*/

ajax_request.prototype.readystate_not_ready = function()
{
    return ( this.xmlhandler.readyState && ( this.xmlhandler.readyState < 4 ) );
}

/*--------------------------------------------*/
// Check to ensure ready state-ness
/*--------------------------------------------*/

ajax_request.prototype.readystate_ready_and_ok = function()
{
    return ( this.xmlhandler.readyState == 4 && this.xmlhandler.status == 200 ) ? true : false;
}

/*--------------------------------------------*/
// Onready state change event handler
/*--------------------------------------------*/

ajax_request.prototype.onreadystatechange = function( event )
{
    //------------------------------------------------
    // Make sure we're initialized
    //------------------------------------------------

    if ( ! this.xmlhandler )
    {
        this.xml_init();
    }

    //------------------------------------------------
    // Make sure its a function event
    //------------------------------------------------

    if ( typeof(event) == 'function' )
    {
        this.xmlhandler.onreadystatechange = event;
    }
}

/*--------------------------------------------*/
// Show loading layer
/*--------------------------------------------*/

ajax_request.prototype.show_loading = function( message )
{
    if ( ! this.loading_fired )
    {
        this.loading_fired = 1;

        //------------------------------------------------
        // Change text?
        //------------------------------------------------

        if ( message )
        {
            document.getElementById( 'loading-layer-text' ).innerHTML = message;
        }

        this.centerdiv         = new center_div();
        this.centerdiv.divname = 'loading-layer';
        this.centerdiv.move_div();
    }

    return;
}

/*--------------------------------------------*/
// Hide loading layer
/*--------------------------------------------*/

ajax_request.prototype.hide_loading = function()
{
    try
    {
        if ( this.centerdiv && this.centerdiv.divobj )
        {
            this.centerdiv.hide_div();
        }
    }
    catch(e)
    {
    }

    this.loading_fired = 0;

    return;
}

/*--------------------------------------------*/
// IPB thinks we can use fancy JS, lets see...
/*--------------------------------------------*/

if ( use_enhanced_js )
{
    use_enhanced_js = ajax_request.prototype.xml_init() ? 1 : 0;
}

--------------------

PHP Чат Скрипт

Sardar

Дата 17.2.2006, 18:04 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 3
Всего: 317

Elfet, советую почитать на wikipedia.org что есть AJAX, вообще по любому поводу стоит с ней консультироваться smile

AJAX это технология, целый комплекс: загрузка контента + DOM, XPath, XSLT и прочие XML тех. + немного креатива, т.е. как динамически подгрузить контент, отформатировать его и отобразить на странице.

XMLHttpRequest это решение от MS, ставшее стандартом де-факто для всех, собственно от него и зародилась технология AJAX. По началу предназначалось опрашивать вебсервисы, не только веб страничкам, а вообще любой проге на C++ / C# / VB

Многие начинающие программисты не врубаються в суть XMLHttpRequest подгружая им что угодно, вплоть до JS скриптов что кидают на eval, ни разу не задумавшись при том зачем интерфейсу префикс XML smile

--------------------

Опыт - сын ошибок трудных © А. С. Пушкин
Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
Оценить мои качества можно тут.

12345c

Дата 17.2.2006, 19:07 (ссылка)

(нет голосов)

Загрузка ...

Круглый

Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 3
Всего: 101

Ссылка - http://forum.vingrad.ru/index.php?showtopi...=xmlhttprequest
и поиск по форуму и и-нету по названным умным словам. (Очень помогает.)

Ajax - журналистский синоним xmlhttprequest . Чаще применяется теми, кто не уверен, что используется действительно второе : )

--------------------

Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go

Elfet

Дата 17.2.2006, 19:24 (ссылка)

(нет голосов)

Загрузка ...

Белый и Пушистый

Профиль
Группа: Awaiting Authorisation
Сообщений: 3776
Регистрация: 2.4.2003

Репутация: нет
Всего: 16

Цитата(Sardar @ 17.2.2006, 19:04

)

Многие начинающие программисты не врубаються в суть XMLHttpRequest подгружая им что угодно, вплоть до JS скриптов что кидают на eval, ни разу не задумавшись при том зачем интерфейсу префикс XML

Да

Вот так мы и делаем smile

12345c тяжело с этими умными словами smile

XML - тоже в нём я полный "0" smile

SOS!

--------------------

PHP Чат Скрипт

Alx

Дата 17.2.2006, 20:15 (ссылка)

(нет голосов)

Загрузка ...

Ajaxy

Профиль
Группа: Комодератор
Сообщений: 2903
Регистрация: 26.11.2003
Где: Cutopia

Репутация: 6
Всего: 78

я вот сколько не пытался понять нахрена нужен xml, но так и не понял.
и не вижу ничего плохого, чтобы подгружать html и скрипты, прогоняя через eval...

имхо темку лучше бы переименовать, пока не поздно, в "в различия AJAX и Subsys_JsHttpRequest", это интереснее буит smile

...

--------------------

Lixil

Дата 18.2.2006, 14:40 (ссылка)

(голосов: 0)

Загрузка ...

Unregistered

Цитата(Alx @ 17.2.2006, 20:15

)

я вот сколько не пытался понять нахрена нужен xml, но так и не понял.
и не вижу ничего плохого, чтобы подгружать html и скрипты, прогоняя через eval...

+1. Передаем строку типа

Цитата

{'asd': 123, ['q', 'w', 6, [1,2,3]] 'dfg': ['tyt', {'q': 'iop', [1,2], 'vb'}], 2: 'rfv'}

потом var arr = eval(text);
вот нам и информация произвольной формы smile

Sardar

Дата 18.2.2006, 16:45 (ссылка)

(нет голосов)

Загрузка ...

Бегун

Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 3
Всего: 317

Lixil, Называеться это JSON.
XMLHttpRequest изначально придумывался опрашивать веб сервисы, клиент к которым может теперь быть и "простая страница".

Плюсы и минусы подхода с JSON:

+ прост и понятен верстальщикам
- не понятен другим, особенно софту не имеющему JS, придёться парсить и материться
+/- передаёться код, который может быть чем угодно
- можно передать только данные, например целое дерево обьектов, но никаких операций по работе с данными нет, придёться всё проссматривать самому
- нет гибкости XML, нет валидации
- нельзя сразу трансформировать в HTML, придёться в ручную выбирать инфу и строить вёрстку, отсюда нет скинов, т.к. зашито в коде
- не пользуеться популярностью в серьёзных проектах, "XML рулит" если пойдёте дальше малых страниче

Плюсы и минусы подхода с XML:

- это надо учить, в наше время ещё много народу кто не врубаеться что XML это не только разметка
+ читаем и переносим между любыми приложениями, либы по работе с XML есть на любой платформе
+ прост и естественнен в генерации, опять же есть готовые либы, а не руками
+ валидируеться (XML Schema, но RelaxNG проще), всегда уверенны что не получим лажу, код по работе становиться простым без этого моря проверок на каждом шагу
+ очень гибкая выборка через XPath, просто и быстро достали всё что хотим. Также для изменения инфы (если нужно) есть DOM
+ трансформации XSLT позволяют полученную инфу сразу обратить не обходимый вид, при этом код будет в пару строк, а скин меняеться в xsl стилях. Скин это не только цвета и картинки, это всю структуру поменять можно, любознательных отправляю в XSL(T).
- Опера отстойничает, трансформаций пока у неё нет
+ море инструментов по разработке с которыми быстро и наглядно можно построить словарь XML, провсети тесты, анализировать результаты. С JSON всё делаем сами.
+ это ещё не все плюсы, а то с чем я столкнулся XML пользуеться везде, SVG, XForms, XUL/XAML, перечислять и перечислять. Единожды врубившись все эти технологии станут доступными и ясными.

Поэтому повторою: кто хочет заниматься серьёзными разработками обязан знать XML. Не синтаксис, а все сопутствующие технологии и концепции, кстати это инстересно smile

Это позволит не только всё это благо заюзать, но и расширит горизонты знаний и логики, эхом будет отражаться везде чем бы не занимался.

--------------------

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Применение библиотек \| Следующая тема »