storing and retrieving ajax xml response in sessionStorage

Question

I am getting XML response from ajax and then I am trying to store it in sessionStorage but I cannot retrieve it.

$.ajax({
        url: '/webservice.svc/getProfile',
        data: { "memberId": $(authenticateResponse).find("memberId").text() },
        method: "GET",
        async: false,
        success: function (d) {
            sessionStorage.clear();
            sessionStorage.setItem('ALMS', d);
        }
    });

When I try to retrieve

console.dirxml(sessionStorage.ALMS)
[object XMLDocument]
console.dirxml($(sessionStorage.ALMS))

What I am doing wrong !!

Possible duplicate of [Storing Objects in HTML5 localStorage](http://stackoverflow.com/questions/2010892/storing-objects-in-html5-localstorage) — Chetan Joshi, Apr 28 '17 at 09:55
@ChetanJoshi similar, but not the same. That's about objects, this is about XML — Rory McCrossan, Apr 28 '17 at 10:00

score 2 · Accepted Answer · answered Apr 28 '17 at 09:51

The issue you have is that sessionStorage can only hold strings. Due to this the XMLDocument is being coerced using toString(), hence the value you're seeing.

To fix this you need to serialise the XMLDocument manually before saving it. Try this:

$.ajax({
  url: '/webservice.svc/getProfile',
  data: { 
    memberId: $(authenticateResponse).find("memberId").text() 
  },
  method: "GET",
  success: function (d) {
    sessionStorage.clear();
    sessionStorage.setItem('ALMS', new XMLSerializer().serializeToString(d));
  }
});

Also note that I removed async: false as it's incredibly bad practice.

storing and retrieving ajax xml response in sessionStorage

1 Answers1