title: Create React App inject environment variable
body: <p>I'm new to react and started with the create-react-app template.
  I am developing a SPA, that is consuming a REST API.</p>
  
  <p>For developing purposes, i need to authenticate against this API using OAUTH2 (Access Token).</p>
  
  <p>In the production environment, i don't need to authenticate (as it runs on the same machine).</p>
  
  <p>In order to get this access token in the dev environment, I need to make a POST request to the authentication server (with client_id and client_secret) and then I receive the access token which I need for further request.</p>
  
  <p>As the authentication server does not support cors, I cannot do this post request within the react app.</p>
  
  <p>My solution was to write a node script, that does this post request and inject the token to the client App using environment variables.</p>
  
  <p>In the package.json (I did an eject) I inserted this script (gettoken):</p>
  
  <pre><code>"start": "npm-run-all -p watch-css gettoken-js start-js"
  </code></pre>
  
  <p>In the gettoken.js file I make the post request for getting the access token and set (in the callback function):</p>
  
  <pre><code>process.env.REACT_APP_CRM_API_ACCESS_TOKEN = response.access_token;
  </code></pre>
  
  <p>Now I want to access this variable in the react app - but here process.env.REACT_APP_CRM_API_ACCESS_TOKEN is always undefinied.</p>
  
  <p>What am I doing wrong?
  Is there another way to inject the access_token to the client app?</p>
  
  <p>Here is the getToken script:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var request = require('request');
  
  const endpoint = "https://xxxx/oauth2/token";
  const resource = "https://xxxyyy.com";
  
   const params =  [
    {
      name: 'userName',
      value: 'myuser@user.com'
    },
    {
      name: 'password',
      value: '123'
    },
    {
      name: 'grant_type',
      value: 'password'
    },
    {
      name: 'client_secret',
      value: '11231'
    },
    {
      name: 'client_id',
      value: '123'
    },
    {
      name: 'resource',
      value: resource
    }
  ];
  
  const encodedParams= Object.keys(params).map((key) =&gt; {
    return params[key].name + '=' + encodeURIComponent(params[key].value);
  }).join('&amp;');
  
  request(
      {
          method: 'POST',
          uri: endpoint,
          headers: [
              {
                name: 'content-type',
                value: 'application/x-www-form-urlencoded'
              }
            ],
            body: encodedParams + "&amp;"
          }
      ,
      function (error, response, body) {
  
        //throw new Error("asdfasdf");
          if (error)
          {
              console.log('error', "ERROR GETTING ACCESS TOKEN FROM API: " + error);
          }
          else
          {
            let response = JSON.parse(body);
            process.env.REACT_APP_CRM_API_ACCESS_TOKEN = response.access_token;
            process.env.REACT_APP_CRM_API_ENDPOINT = resource;
            console.log(process.env.REACT_APP_CRM_API_ACCESS_TOKEN);
          }
      }
  );</code></pre>
  </div>
  </div>
  </p>