title: Keep query strings with AWS Amplify Hosting - React
body: <p>I currently have a react app using <code>react-router-dom</code> that works locally but not when deployed using <a href="https://aws.amazon.com/getting-started/tutorials/deploy-react-app-cicd-amplify/" rel="noreferrer">AWS Amplify</a>. </p>
  
  <p>The problem is that when I route to a URL and use query strings, the browser gets a redirect and drops the query strings.</p>
  
  <p>For example when I route to <code>/path?value1=foo&amp;value2=bar</code>, the browser gets a 301 and redirects to url: <code>/0000000X/path/</code> as shown below</p>
  
  <p><a href="https://i.stack.imgur.com/nt8mq.png" rel="noreferrer"><img src="https://i.stack.imgur.com/nt8mq.png" alt="enter image description here"></a> </p>
  
  <p>I have tried using hash values as well as the <code>/path/?value1=foo&amp;value2=bar</code> approach as mentioned in <a href="https://stackoverflow.com/questions/20751301/how-can-i-get-query-strings-in-my-amazon-s3-static-website">this post</a> with no luck. </p>
  
  <p>Below is my implementation: </p>
  
  <p><strong><em>Button.js</em></strong></p>
  
  <p><code>href: '/path?value1=foo&amp;value2=bar'</code></p>
  
  <p><strong><em>Path.js</em></strong></p>
  
  <pre><code>import queryString from 'query-string'
  const values = queryString.parse(this.props.location.search)
  console.log(values.value1) 
  console.log(values.value2) 
  </code></pre>
  
  <p><strong><em>Routes.js</em></strong></p>
  
  <pre><code> &lt;AuthenticatedRoute path="/path" exact component={Path} props={childProps} /&gt;
  </code></pre>
  
  <p>All of this works fine locally, redirects and I can access the query string params, but not in S3. Thanks in advance!</p>