Merge pull request #10 from vaibhavbansal23/ssr-window-fix

ssr window issue fixed

Author: imagekitio

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "imagekitio-react",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "React SDK for ImageKit.io which implements client-side upload and URL generation for use inside a react application.",
   "scripts": {
     "compile": "node_modules/.bin/babel src --out-dir lib --copy-files",

package.json

@@ -2,7 +2,7 @@ import React from 'react';
 import ImageKitComponent from "../ImageKitComponent/ImageKitComponent";
 import extractImageKitProps from '../../util/extractImageKitProps';
 
-export default class IKImage extends ImageKitComponent {
+class IKImage extends ImageKitComponent {
   constructor(props, context) {
     super(props, context);
     this.imageRef = React.createRef();
@@ -95,4 +95,6 @@ export default class IKImage extends ImageKitComponent {
   }
 }
 
-Image.propTypes = ImageKitComponent.propTypes;
+IKImage.propTypes = ImageKitComponent.propTypes;
+
+export default IKImage;

src/components/IKImage/IKImage.js

@@ -1,23 +1,49 @@
 export function parseURL(url) {
-  let parser = document.createElement('a'),
-      searchObject = {},
-      queries, split, i;
-  // Let the browser do the work
-  parser.href = url;
-  // Convert query string to object
-  queries = parser.search.replace(/^\?/, '').split('&');
-  for( i = 0; i < queries.length; i++ ) {
-      split = queries[i].split('=');
-      searchObject[split[0]] = split[1];
-  }
-  return {
-      protocol: parser.protocol,
-      host: parser.host,
-      hostname: parser.hostname,
-      port: parser.port,
-      pathname: parser.pathname,
-      search: parser.search,
-      searchObject: searchObject,
-      hash: parser.hash
-  };
+	let parser;
+	if(typeof document === 'undefined'){
+		parser = parseUrlInNode(url);
+	}else{
+		parser = parseUrlInBrowser(url);
+	}
+
+	return {
+		protocol: parser.protocol,
+		host: parser.host,
+		hostname: parser.hostname,
+		port: parser.port,
+		pathname: parser.pathname,
+		search: parser.search,
+		searchObject: parser.searchObject,
+		hash: parser.hash
+	};
 }
+
+function parseUrlInBrowser(urlToParse){
+	var parser = document.createElement('a'),searchObject = {}, queries, split, i;
+	// Let the browser do the work
+	parser.href = urlToParse;
+	// Convert query string to object
+	queries = parser.search.replace(/^\?/, '').split('&');
+	for( i = 0; i < queries.length; i++ ) {
+		split = queries[i].split('=');
+		searchObject[split[0]] = split[1];
+	}
+	parser.searchObject = searchObject;
+	return parser;
+}
+
+function parseUrlInNode(urlToParse){
+	var url = require('url');
+
+	var parser = new URL(urlToParse);
+	var searchObject = {}, queries, split, i;
+	
+	// Convert query string to object
+	queries = parser.search.replace(/^\?/, '').split('&');
+	for( i = 0; i < queries.length; i++ ) {
+		split = queries[i].split('=');
+		searchObject[split[0]] = split[1];
+	}
+	parser.searchObject = searchObject;
+	return parser;
+}

src/util/urlParser.js

@@ -11,7 +11,8 @@ module.exports = {
     library: 'imageKitReact',
     libraryTarget: 'umd',
     publicPath: '/dist/',
-    umdNamedDefine: true
+	umdNamedDefine: true,
+	globalObject: 'this'
   },
   module: {
     rules: [{