Accessing the URL hostname from React JS

Question

I'm trying to access the URL subdomain. Traditionally in JavaScript I'd do

var full = window.location.host;
var parts = full.split('.');
var subdomain = parts[0];
// ...

However I'm calling this from a React JS component, and I get the following error -

Encountered error "TypeError: undefined is not an object (evaluating 'window.location.host')"

It seems as though window.location.host doesn't work from React? Does it not have access to the window?

I get there might be philosophical reasons to not do this, but I'd still be curious how to implement it if it's possible from React.

Thanks!

Is this code running in a browser? or is it possibly running in nodejs in some kind of isomorphic rendering mode? — Stephen Crosby
– Stephen Crosby, Commented May 19, 2016 at 18:11
So it's part of a larger Rails app. The react component is rendered from the view, which calls the JSX. I figured that although all of that gets compiled server-side, the end react code runs in the context of the browser on the client side? — user2490003
– user2490003, Commented May 19, 2016 at 18:14
We'd have to look at your specific setup, but my guess is this line with window.location is being evaluated on the back end where there is no window and no window object. — Stephen Crosby
– Stephen Crosby, Commented May 19, 2016 at 18:17
Yeah I think you're right, judging by the error and the fact that it returns "undefined" :( — user2490003
– user2490003, Commented May 19, 2016 at 18:24

Steve O · Accepted Answer · 2016-07-29 08:32:05Z

4

This is isomorphic so if it is being processed server side so you cannot access the window.location.href

For server side, you will need to look at the underlying request object to get the hostname:

answered Jul 29, 2016 at 8:32

Steve O

2281 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1