I'm trying to get my routes to work with IIS and React Router v4 using BrowserRouter.
On my localhost I have all my routes working as expected. React Router handles everything like I want it to:
Now, in IIS I've set up a rule that ignores '/appfolder/api/*' for the purpose of serving an api for my app. That works.
How do I get IIS to redirect to 'http://www.example.com/appfolder/dest/CODE' and have React Router handle it according to its rules. If I redirect to '/appfolder/index.html' I loose my 'CODE' which I'd like to keep for ReactRouter to handle.
If I try to redirect to 'http://www.example.com/appfolder/dest/CODE' by using regexp capture groups, I get a 'ERR_TOO_MANY_REDIRECTS'.
I currently have this rule in my web.config:
<rule name="ReactRouter Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/appfolder/api/" negate="true" />
</conditions>
<action type="Redirect" url="/appfolder/dest/CODE" />
<!-- also tried this -->
<!-- action type="Redirect" url="/appfolder/index.html" /-->
</rule>
I found the solution. I changed my action type to Rewrite and it worked like a charm.
IIS rule final solution:
<rule name="ReactRouter Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/appfolder/api/" negate="true" />
</conditions>
<action type="Rewrite" url="/appfolder/index.html" />
</rule>
The only way I was able to get things to work for me using react-router v4 was to use a HashRouter: https://reacttraining.com/react-router/web/api/HashRouter
No web.config changes required!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With