client - get browser fingerprint and set header

client/app/routes.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { BrowserRouter, Route, Switch } from 'react-router-dom';
 import { Provider } from 'mobx-react';
+import { initializeAxios } from './axios/axios';
 import { Footer, Header } from './components';
 import { Forum, Home, NotFound, Oauth, Realms, Thread, UserAccount } from './pages';
 import { stores } from './stores/stores';
@@ -10,11 +11,31 @@ import './scss/index.scss';
 
 interface Props {}
 
-interface State {}
+interface State {
+  ready: boolean;
+}
 
 export class Routes extends React.Component<Props, State> {
 
+  constructor(props: Props) {
+    super(props);
+    this.state = {
+      ready: false,
+    };
+  }
+
+  async componentDidMount() {
+    await initializeAxios();
+    this.setState({ ready: true });
+  }
+
   public render() {
+
+    // make sure we initialize axios with request headers before we load the app
+    if (!this.state.ready) {
+      return <div></div>;
+    }
+
     return (
       <Provider {...stores}>
         <BrowserRouter>