Subdomain react app

let host = window.location.host;
let protocol = window.location.protocol;
let parts = host.split(".");
let subdomain = "";
// If we get more than 3 parts, then we have a subdomain
// INFO: This could be 4, if you have a co.uk TLD or something like that.
if (parts.length >= 3) {
  subdomain = parts[0];
  // Remove the subdomain from the parts list
  parts.splice(0, 1);
  // Set the location to the new url
  window.location = protocol + "//" + parts.join(".") + "/" + subdomain;
}

Source: stackoverflow.com

Subdomain react app

import React from 'react';

import {MainApplication} from './Main';

function subdomainApplications (map) {
  let main = map.find((item)=> item.main);
  if (!main) {
    throw new Error('Must set main flag to true on at least one subdomain app');
  }

  return function getComponent () {
    const parts = window.location.hostname.split('.');

    let last_index = -2;
    const last = parts[parts.length - 1];
    const is_localhost = last === 'localhost';
    if (is_localhost) {
      last_index = -1;
    }

    const subdomain = parts.slice(0, last_index).join('.');

    if (!subdomain) {
      return main.application;
    }

    const app = map.find(({subdomains})=> subdomains.includes(subdomain));
    if (app) {
      return app.application;
    } else {
      return main.application;
    }
  }
}

const getApp = subdomainApplications([
  {
    subdomains: ['www'],
    application: function () {
      return 'Main!'
    }
    main: true
  },
  {
    subdomains: ['foo'],
    application: function () {
      return 'Foo!';
    }
  },
  {
    subdomains: ['bar', 'baz.bar'],
    application: function () {
      return 'Bar!';
    }
  }
]);

export default function Application () {
  const App = getApp();
  return (
    <App className="Application" />
  );
}

Source: stackoverflow.com

Similar codes

0 vote136 views1 answer
POST http://localhost:3000/$(process.env.REACT_APP_API_URL)/auth/users/ 404 (Not Found) in react redux
Javascript React
18 votes136 views2 answers
How to import background image in inline css in react
Javascript React
0 vote165 views1 answer
How to go to settings on next click in react native
Javascript React
0 vote134 views1 answer
The email address is badly formatted react
Javascript React
1 vote141 views1 answer
"react native" component dynamic children props
Javascript React
12 votes279 views1 answer
React chrome extension
Javascript React
1 vote149 views3 answers
Bash: react-scripts: command not found
Javascript React
0 vote141 views1 answer
Sweper slider react
Javascript React
1 vote164 views1 answer
Module not found: Can't resolve 'C:\Users\{user}\Documents\React apps\{app-name}\node_modules\react-scripts\node_modules\babel-loader\lib\index.js'
Javascript React
1 vote137 views1 answer
Conditional style react native
Javascript React