When I load the home page of my react-redux application I got the error
Encountered error "TypeError: Cannot read property 'search' of undefined" when prerendering App with {"location":"/","currency":"USD"}
I am getting error in following code
const UrlParser = {
getQueryVariable: (variable) => {
let query = window.location.search.substring(1);
let vars = query.split('&');
for (let i = 0; i < vars.length; i++) {
let pair = vars[i].split('=');
if (decodeURIComponent(pair[0]) === variable) {
return decodeURIComponent(pair[1]);
}
}
}
}
export default UrlParser;
can anyone please help me
Edit
window.location on console gives
Location {href: "http://localhost:5000/", ancestorOrigins: DOMStringList, origin: "http://localhost:5000", replace: function,
assign: function…} ancestorOrigins:DOMStringListassign:function ()hash :"" host : "localhost:5000" hostname : "localhost" href : "http://localhost:5000/" origin : "http://localhost:5000" pathname : "/" port : "5000" protocol : "http:" reload : function reload() replace : function () search : "" toString : function toString() valueOf : function valueOf() Symbol(Symbol.toPrimitive) : undefined proto : Location
When I load the home page of my react-redux application I got the error
Encountered error "TypeError: Cannot read property 'search' of undefined" when prerendering App with {"location":"/","currency":"USD"}
I am getting error in following code
const UrlParser = {
getQueryVariable: (variable) => {
let query = window.location.search.substring(1);
let vars = query.split('&');
for (let i = 0; i < vars.length; i++) {
let pair = vars[i].split('=');
if (decodeURIComponent(pair[0]) === variable) {
return decodeURIComponent(pair[1]);
}
}
}
}
export default UrlParser;
can anyone please help me
Edit
window.location on console gives
Share Improve this question edited Jun 22, 2017 at 13:38 Anish asked Jun 22, 2017 at 13:13 AnishAnish 5583 gold badges10 silver badges33 bronze badges 10Location {href: "http://localhost:5000/", ancestorOrigins: DOMStringList, origin: "http://localhost:5000", replace: function,
assign: function…} ancestorOrigins:DOMStringListassign:function ()hash :"" host : "localhost:5000" hostname : "localhost" href : "http://localhost:5000/" origin : "http://localhost:5000" pathname : "/" port : "5000" protocol : "http:" reload : function reload() replace : function () search : "" toString : function toString() valueOf : function valueOf() Symbol(Symbol.toPrimitive) : undefined proto : Location
- Please detail the problem; at which line do you meet the error? with which input? – pinturic Commented Jun 22, 2017 at 13:16
- @pinturic let query = window.location.search.substring(1); – Anish Commented Jun 22, 2017 at 13:17
- stackoverflow./a/26803253/6294260....please check this link if its helpful for you.. – Urvish Patel Commented Jun 22, 2017 at 13:25
- @Anish can you console.log(window.location) and tell us what you get? – Mμ. Commented Jun 22, 2017 at 13:32
- @UrvishPatel in my problem it shows window.location it self isn't defined – Anish Commented Jun 22, 2017 at 13:32
2 Answers
Reset to default 3After much discussion, It's really hard to tell why assigning window.location.search.substring(1)
throws an error. One way to circumvent this issue is by using a try catch clause:
getQueryVariable: (variable) => {
let query;
try {
query = window.location.search.substring(1);
} catch(e) {
// window.location.search.substring(1) throws an error, set query
// to fallback value ''
console.log(e);
query = '';
}
let vars = query.split('&');
for (let i = 0; i < vars.length; i++) {
let pair = vars[i].split('=');
if (decodeURIComponent(pair[0]) === variable) {
return decodeURIComponent(pair[1]);
}
}
}
To answer for the headline question title of window.location is undefined my wasted 20 minutes was because I was using the bad capitalization given here.
https://developer.mozilla/en-US/docs/Web/API/Window/location
i.e. Window.location
is wrong, window.location
is correct.