External redirects for react-router 3.x

ExternalRedirect.js

import React, { Component, PropTypes } from 'react';

// This file is heavily based on:
// https://github.com/ReactTraining/react-router/blob/v3/modules/Redirect.js
export default class ExternalRedirect extends Component {
  static propTypes = {
    from: PropTypes.string.isRequired,
    to: PropTypes.string.isRequired,
  };

  static createRouteFromReactElement = (element) => {
    const { type } = element;
    const route = Object.assign({}, type.defaultProps, element.props);
    route.childRoutes = [];
    delete route.children;

    if (route.from) route.path = route.from;

    route.onEnter = function (nextState, replace) {
      const location = nextState.location;
      if (typeof window !== 'undefined') {
        window.location = route.to;
        return;
      }

      replace({
        pathname: location.pathname,
        query: location.query,
        state: {
          externalURL: route.to,
        },
      });
    };

    return route;
  };

  static getRoutePattern = (routes, routeIndex) => {
    let parentPattern = '';
    for (var i = routeIndex; i >= 0; i--) {
      const route = routes[i];
      const pattern = route.path || '';
      parentPattern = pattern.replace(/\/*$/, '/') + parentPattern;
      if (pattern.indexOf('/') === 0) break;
    }
    return '/' + parentPattern;
  };

  render() {
    return (
      <div />
    );
  }
}

match.js

match({
  history,
  routes,
  location: request.url,
}, (error, redirectLocation, renderProps) => {
  if (redirectLocation) {
    const {
      pathname,
      search,
      state,
    } = redirectLocation;
    const location = state && state.externalURL || (pathname + search);
    response.writeHead(302, {
      Location: location,
    });
    response.end();
  } else if (renderProps) { ...

Routes.js

export default (
  <Route>
    <Route path="/some/path" component={SomeComponent} />
    
    <ExternalRedirect from="/foo/bar" to="https://canny.io" />
  </Route>
);