jQuery- Ajax 응답을 글로벌 변수에 저장합니다

Question

jQuery와 Ajax 장면에 대한 초보자는 여전히 다소 초보자이지만 $ .ajax 요청이 일부 XML 파일 (~ 6KB 이하)을 검색하는 것을 수행하지만 XML 컨텐츠가 해당 페이지에 소비하는 기간 동안 변경되지 않습니다 (이 디자인은 변경할 수 없습니다. 다른 곳에서 읽을 때 XML 파일을 변경하는 데 액세스 할 수 없습니다). 따라서 응답 데이터를 저장하는 글로벌 변수가 있으며이 변수에 대한 후속 조회는이 변수에 대해 수행되므로 여러 요청이 필요하지 않습니다.

XML 파일이 증가 할 수 있다는 사실을 감안할 때 이것이 모범 사례인지 확실하지 않으며 Java 배경에서 나오는 글로벌 공개 변수에 대한 내 생각은 일반적으로 No-No입니다.

따라서 내가 가지고있는 질문은이 작업을 수행하는 더 나은 방법이 있는지 여부와 파일이 어리석은 파일 크기로 확장되면 메모리 문제를 일으키는 지에 대한 질문이 있습니까?

데이터가 XML 객체 내부의 일부 getter/setter 유형 함수로 전달 될 수 있으며, 이는 글로벌 공개 변수 문제를 해결할 수 있지만 여전히 객체 자체에 응답을 저장 해야하는지에 대한 질문을 제기합니다.

예를 들어, 내가 현재하는 일은 다음과 같습니다.

// top of code
var xml;
// get the file
$.ajax({
  type: "GET",
  url: "test.xml",
  dataType: "xml",
  success : function(data) {
    xml = data;
  }
});
// at a later stage do something with the 'xml' object
var foo = $(xml).find('something').attr('somethingElse');

Answer 1

저장하는 것 외에는 그 주위에 아무 방법이 없습니다. 메모리 페이징은 잠재적 인 문제를 줄여야합니다.

'XML'이라는 글로벌 변수를 사용하는 대신 다음과 같은 작업을 수행하는 것이 좋습니다.

var dataStore = (function(){
    var xml;

    $.ajax({
      type: "GET",
      url: "test.xml",
      dataType: "xml",
      success : function(data) {
                    xml = data;
                }
    });

    return {getXml : function()
    {
        if (xml) return xml;
        // else show some error that it isn't loaded yet;
    }};
})();

그런 다음 다음과 같이 액세스하십시오.

$(dataStore.getXml()).find('something').attr('somethingElse');

Answer 2

다음은 작업을 잘 수행하는 기능입니다. 나는 위의 최상의 답을 얻을 수 없었다.

jQuery.extend({
    getValues: function(url) {
        var result = null;
        $.ajax({
            url: url,
            type: 'get',
            dataType: 'xml',
            async: false,
            success: function(data) {
                result = data;
            }
        });
       return result;
    }
});

그런 다음 액세스하려면 다음과 같은 변수를 만듭니다.

var results = $.getValues("url string");

Answer 3

이것은 나를 위해 효과가있었습니다.

var jqxhr = $.ajax({
    type: 'POST',       
    url: "processMe.php",
    data: queryParams,
    dataType: 'html',
    context: document.body,
    global: false,
    async:false,
    success: function(data) {
        return data;
    }
}).responseText;

alert(jqxhr);
// or...
return jqxhr;

주목해야 할 중요 : global: false, async:false 그리고 마지막으로 responseText 묶여 $.ajax 요구.

Answer 4

당신은 이것을 할 필요가 없습니다. 나는 프로젝트와 같은 문제를 일으켰다. 당신이하는 일은 On Success 콜백 내부에서 함수 호출을하여 글로벌 변수를 재설정하는 것입니다. 비동기식 자바 스크립트가 거짓으로 설정된 한 올바르게 작동합니다. 여기 내 코드가 있습니다. 도움이되기를 바랍니다.

var exists;

//function to call inside ajax callback 
function set_exists(x){
    exists = x;
}

$.ajax({
    url: "check_entity_name.php",
    type: "POST",
    async: false, // set to false so order of operations is correct
    data: {entity_name : entity},
    success: function(data){
        if(data == true){
            set_exists(true);
        }
        else{
            set_exists(false);
        }
    }
});
if(exists == true){
    return true;
}
else{
    return false;
}

이것이 당신에게 도움이되기를 바랍니다.

Answer 5

전 세계적으로 액세스 할 수 있으므로 응답 값을 DOM 요소에 저장하는 것이 더 쉬울 수 있습니다.

<input type="hidden" id="your-hidden-control" value="replace-me" />

<script>
    $.getJSON( '/uri/', function( data ) {
        $('#your-hidden-control').val( data );
    } );
</script>

이것은 비동기를 False로 설정할 필요가 없다는 이점이 있습니다. 분명히 이것이 적절한 지 여부는 달성하려는 것에 달려 있습니다.

Answer 6

문제는 "성공"기능 실행과 변수에서 데이터를 꺼내려고하는 시간 간의 서버 지연 만 해당 문제에 대한 로컬 또는 글로벌 범위와 관련이 없을 수 있습니다.

Ajax "성공"기능 화재 전에 변수의 내용을 인쇄하려고 할 가능성이 있습니다.

Answer 7

        function getJson(url) {
            return JSON.parse($.ajax({
                type: 'GET',
                url: url,
                dataType: 'json',
                global: false,
                async: false,
                success: function (data) {
                    return data;
                }
            }).responseText);
        }

        var myJsonObj = getJson('/api/current');

이것은 작동합니다 !!!

Answer 8

     function get(a){
            bodyContent = $.ajax({
                  url: "/rpc.php",
                  global: false,
                  type: "POST",
                  data: a,
                  dataType: "html",
                  async:false
               } 
            ).responseText;
            return bodyContent;

  }

Answer 9

이것도 달렸다. 많은 답변이 있지만, 내가 제공 할 간단한 올바른 하나의 답변. 열쇠는 $ .ajax 전화를 만드는 것입니다.

$.ajax({  
    async: false, ...

Answer 10

나는 jQuery ajax의 결과를 "document.ready"단계에서 내 변수로 가져 오는 데 어려움을 겪었습니다.

페이지가 이미로드 된 후 사용자가 선택 상자의 "onchange"이벤트를 트리거했을 때 jQuery의 ajax는 내 변수에로드되지만 페이지가 처음로드되었을 때 데이터가 변수를 공급하지 않습니다.

나는 많은, 많은, 많은 다른 방법을 시도했지만 결국 찰스 길버트의 방법은 저에게 가장 적합한 방법이었습니다.

Charles Guilbert에게 모자! 그의 대답을 사용하여 페이지가 처음로드 된 경우에도 내 변수에 데이터를 가져올 수 있습니다.

작업 스크립트의 예는 다음과 같습니다.

    jQuery.extend
    (
        {
            getValues: function(url) 
            {
                var result = null;
                $.ajax(
                    {
                        url: url,
                        type: 'get',
                        dataType: 'html',
                        async: false,
                        cache: false,
                        success: function(data) 
                        {
                            result = data;
                        }
                    }
                );
               return result;
            }
        }
    );

    // Option List 1, when "Cats" is selected elsewhere
    optList1_Cats += $.getValues("/MyData.aspx?iListNum=1&sVal=cats");

    // Option List 1, when "Dogs" is selected elsewhere
    optList1_Dogs += $.getValues("/MyData.aspx?iListNum=1&sVal=dogs");

    // Option List 2, when "Cats" is selected elsewhere
    optList2_Cats += $.getValues("/MyData.aspx?iListNum=2&sVal=cats");

    // Option List 2, when "Dogs" is selected elsewhere
    optList2_Dogs += $.getValues("/MyData.aspx?iListNum=2&sVal=dogs");

Answer 11

IMO이 데이터를 글로벌 변수에 저장할 수 있습니다. 그러나 더 독특한 이름을 사용하거나 네임 스페이스를 사용하는 것이 좋습니다.

myComPany = {};

...
mycompany.cachedData = data;

또한 이러한 목적으로 JSON을 사용하는 것이 좋습니다. JSON 형식의 데이터는 일반적으로 XML 형식의 동일한 데이터보다 훨씬 작습니다.

Answer 12

서버에서 큰 XML 파일을 가져 오는 것을 피해야한다고 제안합니다. 변수 "XML"은 은닉처, 데이터 저장소 자체가 아닙니다.

대부분의 시나리오에서는 캐시를 검사하고 원하는 데이터를 얻기 위해 서버에 요청 해야하는지 확인할 수 있습니다. 이렇게하면 앱이 더 가볍고 빠르게됩니다.

건배, JRH.

Answer 13

.Get 응답은 기본적으로 캐시됩니다. 따라서 원하는 결과를 얻기 위해 아무것도 할 필요가 없습니다.

Answer 14

나는 실이 늙었다는 것을 알고 있지만 다른 사람이 이것을 유용 할 것이라고 생각했다. jquey.com에 따르면

var bodyContent = $.ajax({
  url: "script.php",
  global: false,
  type: "POST",
  data: "name=value",
  dataType: "html",
  async:false,
  success: function(msg){
     alert(msg);
  }
}).responseText;

결과를 문자열로 직접 얻는 데 도움이됩니다. 참고 .RESPONSETEXT; 부분.

Answer 15

이전 답변과 유사 :

<script type="text/javascript">

    var wait = false;

    $(function(){
        console.log('Loaded...');
        loadPost(5);
    });

    $(window).scroll(function(){
      if($(window).scrollTop() >= $(document).height() - $(window).height()-100){
        // Get last item
        var last = $('.post_id:last-of-type').val();
        loadPost(1,last);
      }
    });

    function loadPost(qty,offset){
      if(wait !== true){

        wait = true;

        var data = {
          items:qty,
          oset:offset
        }

        $.ajax({
            url:"api.php",
            type:"POST",
            dataType:"json",
            data:data,
            success:function(data){
              //var d = JSON.parse(data);
              console.log(data);
              $.each(data.content, function(index, value){
                $('#content').append('<input class="post_id" type="hidden" value="'+value.id+'">')
                $('#content').append('<h2>'+value.id+'</h2>');
                $('#content').append(value.content+'<hr>');
                $('#content').append('<h3>'+value.date+'</h3>');
              });
              wait = false;
            }
        });
      }
    }
</script>