localStorage undefined in rendr controller

Question

Im getting 500 ReferenceError: localStorage is not defined in the controller of my Rendr app. Im trying to fetch my Authorization token from localStorage and set it as a header before I fetch the spec. I've also tried window.localStorage but then I get window is not defined. Do I not have access to the window object in the controller level? If not, how would I fetch from localStorage.

This is my code for the controller.

module.exports = {
  show: function(params, callback) {
    var spec = {
      model: {
        model: 'Company', params: { name: params.id }
      }
    };

    var options = {},
        Authorization = localStorage.getItem('Authorization');

    options.header = {
      "Authorization": Authorization
    }

    this.app.fetch(spec, options, function (err, results) {
      // return if there is an error fetching the user
      if (err) return callback(err);

      // set the title of the page to the users name
      this.app.set('title', results.model.get('name'));

      // render the page with the results from the fetch
      callback(null, results);
    }.bind(this));
  }
};

No window?? you wouldn't happen to be running this code on the server? — Blindman67, Nov 01 '15 at 01:55
@Blindman67 yes the code is being run on the server as this code is for the router. I'm trying to find a way to handle authentication token through a persistent storage. Do you have any suggestions on how to accomplish it that works both on server and client side? — LongJeongS, Nov 01 '15 at 19:56

score 1 · Accepted Answer · answered Nov 01 '15 at 08:19

1

Welcome to Rendr :-)

Rendr is Isomorphic (or "Universal), which means a lot of it's code runs both on the server AND in the browser. If you have code that you only want to run on the browser there are two ways to make that happen:

In the views there is a custom method called postRender - that method is not run on the server, and only runs on the browser. It's the standard place to put all of your browser specific code. The downside is that it is run after the page is rendered.
You can wrap the code in if (window !== 'undefined') {...} to ensure that it only runs in a browser. The downside is that it will never run on the server.

In our Rendr app, we do a bit of using localstorage, and kinda have to wedge it into the very top of the base template. It's a bit weird because the concepts of localstorage (the browser has persistence) fight the concepts of isomorpic apps (the server and the browser can be the same). So they don't work together great.

answered Nov 01 '15 at 08:19

bigethan

48
3

I'm trying to run the code on the server side as this is the router controller, I'm guessing I won't be able to access localStorage on the server side. Do you have any suggestions on persistent storage I can use on both server and client side to handle authentication tokens? – LongJeongS Nov 01 '15 at 19:54
Cookies work in both express and browser. That's what we used. – bigethan Nov 02 '15 at 09:47
I've been trying to store it in the cookies, but couldn't figure out how to grab the cookies I have set on the express side. Is there easy way to accomplish this ? – LongJeongS Nov 02 '15 at 20:59
I was able to use cookie-dough library to accomplish this, thanks for the tip – LongJeongS Nov 05 '15 at 02:06

localStorage undefined in rendr controller

1 Answers1