AJAX

H

^HITMAN^

Гостин
AJAX - Asynchronous JavaScript и XML (Asynchronous JavaScript and XML).
Добри и лоши страни. Значи вака, за сите што имаат работено AJAX и со развојот на AJAX апликации сите карактеристики ќе ги категоризирам во добри и лоши.

Добри:
- Bandwidth utilization - многу побрзо со директно вчитување на податоци од серверот(доколку се со помал обем)
- работа со DOM објектот,менување на DOM објектот без потреба од испраќање на комплетните податоци во веб формата до веб серверот и обратно,

Лоши:
- Мрежна латенција - Без добар фидбек до корисникот, мали вчитувања на податоци и соодветна манипулација со XMLHttpRequest објектот, може да дојде предолго доцнење па и замрзнување на содржината на страницата во веб прелистувачот, нешто што корисникот не го очекува и разбира,
- СЕО оптимизација,пребарувачките машини не го извршуваат JavaScript кодот кој е потребен за да Ajax апликациите бидат функционални.

Би сакал да продискутираме околу лошите страни на AJAX посебно околу СЕО оптимизацијата, евентуални подобри решенија или комбинација на технологии за избегнување на проблемите околу СЕО оптимизацијата.

Искуства и размислувања - добредојдени.
 

SkyDriver

Would like my bananna ?
Член од
31 јули 2008
Мислења
2.140
Поени од реакции
221
Не е толку лошо колку што наведе, не за џабе тоа им е главниот адут на Google :)
Како за пример ќе ги спомнам Google Translate и Google Suggest.

Иначе лично мене Ajax-от ми се допаѓа затоа што ми е некако многу „економичен и практичен“, лесно работи без освежување на страната и исто така при креирање на динамички сајтови го крие т.е. не го прикажува изворниот код. Можда ова последново и не е којзнае што, али има некои програмери кои не би сакале нивниот код да се прикажува „јавно“. :toe:

Еве и едеа интересна ствар од Google за читање на RSS (Ajax Rulz :icon_lol:):

HTML:
<!-- ++Begin Dynamic Feed Wizard Generated Code++ -->
  <!--
  // Created with a Google AJAX Search and Feed Wizard
  // http://code.google.com/apis/ajaxsearch/wizards.html
  -->

  <!--
  // The Following div element will end up holding the actual feed control.
  // You can place this anywhere on your page.
  -->
  <div id="feed-control">
    <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span>
  </div>

  <!-- Google Ajax Api
  -->
  <script src="http://www.google.com/jsapi?key=notsupplied-wizard"
    type="text/javascript"></script>

  <!-- Dynamic Feed Control and Stylesheet -->
  <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
    type="text/javascript"></script>
  <style type="text/css">
    @import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
  </style>

  <script type="text/javascript">
    function LoadDynamicFeedControl() {
      var feeds = [
	{title: 'Форум',
	 url: 'http://forum.com.mk/_feeds/rss2/news'
	},
	{title: 'Сител телевизија',
	 url: 'http://sitel.com.mk/global/rss.xml'
	},
	{title: 'Време',
	 url: 'http://vreme.com.mk/rssPublication.aspx?CategoryID=0'
	},
	{title: 'Утрински весник',
	 url: 'http://utrinski.com.mk/rssGenerator/rss.aspx'
	}];
      var options = {
        stacked : true,
        horizontal : false,
        title : "Најнови вести"
      }

      new GFdynamicFeedControl(feeds, 'feed-control', options);
    }
    // Load the feeds API and set the onload callback.
    google.load('feeds', '1');
    google.setOnLoadCallback(LoadDynamicFeedControl);
  </script>
<!-- ++End Dynamic Feed Control Wizard Generated Code++ -->
 
H

^HITMAN^

Гостин
Не е толку лошо колку што наведе, не за џабе тоа им е главниот адут на Google :)
Како за пример ќе ги спомнам Google Translate и Google Suggest.

Иначе лично мене Ajax-от ми се допаѓа затоа што ми е некако многу „економичен и практичен“, лесно работи без освежување на страната и исто така при креирање на динамички сајтови го крие т.е. не го прикажува изворниот код. Можда ова последново и не е којзнае што, али има некои програмери кои не би сакале нивниот код да се прикажува „јавно“. :toe:

Еве и едеа интересна ствар од Google за читање на RSS (Ajax Rulz :icon_lol:):

HTML:
<!-- ++Begin Dynamic Feed Wizard Generated Code++ -->
  <!--
  // Created with a Google AJAX Search and Feed Wizard
  // http://code.google.com/apis/ajaxsearch/wizards.html
  -->

  <!--
  // The Following div element will end up holding the actual feed control.
  // You can place this anywhere on your page.
  -->
  <div id="feed-control">
    <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span>
  </div>

  <!-- Google Ajax Api
  -->
  <script src="http://www.google.com/jsapi?key=notsupplied-wizard"
    type="text/javascript"></script>

  <!-- Dynamic Feed Control and Stylesheet -->
  <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
    type="text/javascript"></script>
  <style type="text/css">
    @import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
  </style>

  <script type="text/javascript">
    function LoadDynamicFeedControl() {
      var feeds = [
	{title: 'Форум',
	 url: 'http://forum.com.mk/_feeds/rss2/news'
	},
	{title: 'Сител телевизија',
	 url: 'http://sitel.com.mk/global/rss.xml'
	},
	{title: 'Време',
	 url: 'http://vreme.com.mk/rssPublication.aspx?CategoryID=0'
	},
	{title: 'Утрински весник',
	 url: 'http://utrinski.com.mk/rssGenerator/rss.aspx'
	}];
      var options = {
        stacked : true,
        horizontal : false,
        title : "Најнови вести"
      }

      new GFdynamicFeedControl(feeds, 'feed-control', options);
    }
    // Load the feeds API and set the onload callback.
    google.load('feeds', '1');
    google.setOnLoadCallback(LoadDynamicFeedControl);
  </script>
<!-- ++End Dynamic Feed Control Wizard Generated Code++ -->
Па да нормално некогаш не би сакал мојот код да се прикаже јавно поготово ако е кодот мој производ на долги и непреспиени ноќи. :) Затоа AJAX е ок, но мака мачам со тоа пусто СЕО. Пробувам деновиве топла вода да откријам, нешто што сум сигурен дека неможам да го направам т.e. да пробам да го направам вчитлив кодот некако, но ете се надевам...:toe:
 

SkyDriver

Would like my bananna ?
Член од
31 јули 2008
Мислења
2.140
Поени од реакции
221
Па да нормално некогаш не би сакал мојот код да се прикаже јавно поготово ако е кодот мој производ на долги и непреспиени ноќи. :) Затоа AJAX е ок, но мака мачам со тоа пусто СЕО. Пробувам деновиве топла вода да откријам, нешто што сум сигурен дека неможам да го направам т.e. да пробам да го направам вчитлив кодот некако, но ете се надевам...:toe:
Малце каснам, ама може ќе ти се најде... еве еден трик за SEO оптимизација кој лично го немам пробано, али логички би требало да упали. :toe:
 

SkyDriver

Would like my bananna ?
Член од
31 јули 2008
Мислења
2.140
Поени од реакции
221
Еве ви од мене една едноставна Ajax библиотека (ако може така да се каже)...

Simple Ajax Library
 
Член од
21 април 2010
Мислења
100
Поени од реакции
33
овој јазик е малку посложен, и не го употребувам... инаку го употребив AJAX за Quick Answer на мојот форум: http://cekik.com.mk/forum
 

Рунчев

Esi mi dobaaar
Член од
29 мај 2007
Мислења
1.262
Поени од реакции
190
Некој текст за Ајах општо, и поврзување на Ајах со бази на податоци, за семинарска ако може да ми најде некој.
 

аллександар

Вечно ненаспан
Член од
5 мај 2006
Мислења
7.380
Поени од реакции
2.522
еве ви добри корисни туторијали за ајакс програмирање и тоа на македонски јазик. се надевам дека ако некој има потреба од ајакс ова ке заврши работа.

Клик
 

Have an ice day

Get Free
Член од
26 јануари 2014
Мислења
544
Поени од реакции
1.020
ај да постирам и тука...
Помагајте со AJAX-ов , се утепав од барање неколку дена ништо не најдов по општо, во слајдовиве има само една задача и тоа никаква е... значи ми треба да превземам инфо од некоја страна и најнормално да внесам во eden <div>, како да пратам и како да ги добијам атрибутите од JSON ...како на пример овие

(испитни задачи)

Листата од податоци за
упатствата се превзема од youtube сервис:

http://gdata.youtube.com/feeds/api/playlists/PLAE85DE8440AA6B83?v=2&alt=json

Добиената листа треба да се прикаже во табела каде за секој запис (упатство) ќе
се прикажуваат податоци за: насловот, слика од видеото, број на корисници на кои
им се допаѓа упатството (likes), датум на објавување и оценка (rating). Наведените
податоци се добиваат од следниве атрибути од JSON-објектот: title.$t, link[1].href,
yt$rating.numLikes, gd$rating.average и published.$t.
Кога со покажувачот од глувчето ќе се помине врз некоја од ќелиите каде е
прикажана оценката за видеото, треба да се прикаже „tooltip“ со содржина број на
оценувачи (raters) и соодветен атрибут од JSON-објектот gd$rating.numRaters.
Треба да се обезбеди можност за бришење на кој било запис од листата, како и
сортирање според секој од податоците што се прикажува.


ИЛИ НЕКОЈ


Да се изработи веб страница за прикажување на податоци за филмови. Во листа на
веб страницата се сместени имињата на филмовите. Над листата за фимови, треба да
има копче (Add new movie) за додавање на филмови листата. При клик на копчето,
треба да се појави дијалог во кој треба да се внесе само насловот на филмот.
При клик на филм од листата за тој филм треба да се преземат деталите од сервисот
OmdbAPI:
http://omdbapi.com/?t=ОВДЕ_ИМЕ_НА_ФИЛМОТ
Сервисот враќа JSON кој содржи повеќе детали за филмот, а од нив треба да се
прикажат следните податоци: наслов (Title), id на IMDB (imdbID), режисер (Director),
глумци (Actors), рејтинг (imdbRating) и постер од филмот (Poster). Овие податоци
треба да се прикажат под листата со филмови.
 
M

Mr.InF3ction

Гостин
@Have an ice day

Што те мачи со AJAX и JSON(кликни и читај ги сите 3-4 чекори )?

JSON = JavaScript Object Notation
Тоа значи дека податоците се представуваат како Javascript објекти..
Објект во Javascript e низа од key:value т.е обична хеш табела...ако знаеш што е. "Key"е секогаш стринг и означува името на "property" то, a "value" е уствари вредноста за тој кчуч....кој што може да биде "string", број, низа, објект.
пример за Javascript објект:

Код:
var movie = {
  Name:"Fight Club",
  Year:"1999",
  Actors:[
    "1", "2","3"
  ]
}
console.log(movie.Name) ; // печати Fight Club
for(var i = 0; i < movie.Actors.length; i++){
      console.log(movie.Actors[i]); /// "1", "2", "3"
}
Ajax ти е "асинхрона" комуникација, т.е додека се читаат податоците од било каде, не е блокирачки процес...од корисничка гледна точка тоа значи дека може да си кликаш кај сакаш и UI то се освежува додека читањето на податоци се случува во позадина.
Предпоставувам користите JQuery за ajax повици па тоа се прави вака:

Код:
$.getJSON("url-tuka",function(data){
       //ovaa anonimna funkcija ke se izvrsi koga uspesno ke se simnat podatocite
       // i za tvotie zadaci pogore ti tuka treba da napises kod kade sto ke gi izmine podatocite
      // ke kreira tabela, lista sto i da treba i ke polni podatoci pr:
       cell.innerHTML = data[i].Actors[j]; // da predpostavime deka ima lista od filmovi..za "i" tiot film citame "j" akter
});
 

Have an ice day

Get Free
Член од
26 јануари 2014
Мислења
544
Поени од реакции
1.020
@Have an ice day

Што те мачи со AJAX и JSON(кликни и читај ги сите 3-4 чекори )?

[/CODE]
да со jquery, ова е задачката што ја имам со ајах, сега има ли некакви шанси да променам за да функционира првата испитна што ја наведов погоре, ова ме буни за што служи линков кај $.ajax ( { url: (овде треба линкот што ќе превзема податоци?) и како да пристапам до атрибутите на јсон
(каде за секој запис (упатство) ќе
се прикажуваат податоци за: насловот, слика од видеото, број на корисници на кои
им се допаѓа упатството (likes), датум на објавување и оценка (rating). Наведените
податоци се добиваат од следниве атрибути од JSON-објектот: title.$t, link[1].href,
yt$rating.numLikes, gd$rating.average и published.$t. )


HTML:
function getPosts(fbUrl)                       
        {
            $.ajax({
                url: "http://query.yahooapis.com/v1/public/yql",
                dataType: "jsonp",
                data: {
                    q: 'select * from json where url="' + fbUrl + '"',
                    format: "json"
                },
                success: function (data) {
                    $('#posts').html("");
                    $.each(data.query.results.json.entries, function (i) {       
                      
                        var strContent = "<div>" + data.query.results.json.entries[i].content + "</div>";
                        img_src = $(strContent).find("img").attr("src");
                       
                        if (img_src != null)
                            $('#posts').append("<a target='_blank' title='" + data.query.results.json.entries[i].title + "' href='" + data.query.results.json.entries[i].alternate + "'><img src='" + img_src + "'/></a>");
                    });
                }   
            });
        }
       
        $(function() {
            $( "#selectable" ).selectable({
                stop: function() {
                    $( ".ui-selected", this ).each(function() {
                        var id = $(this).attr('id');
                        var fbUrl = "https://www.facebook.com/feeds/page.php?format=json&id=" + id;
                    
                        getPosts(fbUrl);
                    });
                }
            });
        });
 

Björn

Does Your Mother Know?
Член од
14 август 2006
Мислења
43.068
Поени од реакции
78.273
Клуб, прашак, а сеа и компјутерски јазик.
 

Kajgana Shop

На врв Bottom