Servicestack and browserhistory

I have a single page app based on React, React Router and Servicestack for the server side.
I’d like to replace my hashbased url (http://mydomain.com/#/acticles/122) with browserhistory meaning that:
http://mydomain.com/acticles/122
will use the React router on the client side and then fetch some data that will be processed on the server by servicestack at http:/mydomain.com/api/acticles/122

For the /api path I have in my web.config

 <location path="api">
<system.web>

  <httpHandlers>
    <add path="*" type="ServiceStack.HttpHandlerFactory, ServiceStack" verb="*"/>
  </httpHandlers>
</system.web>

<system.webServer>
  <modules runAllManagedModulesForAllRequests="true"/>
  <validation validateIntegratedModeConfiguration="false"/>
  <handlers>
    <add path="*" name="ServiceStack.Factory" type="ServiceStack.HttpHandlerFactory, ServiceStack" verb="*" preCondition="integratedMode"
      resourceType="Unspecified" allowPathInfo="true"/>
  </handlers>
</system.webServer>

How to tell IIS to not process any path but the one with /api for servicestack and the public folder for images and all the rest redirect to index.html?

You can use a fallback route, e.g:

[FallbackRoute("/{PathInfo*}")]
public class FallbackForClientRoutes
{
    public string PathInfo { get; set; }
}

public object Any(FallbackForClientRoutes request)
{
    //Return default.html for unmatched requests so routing is handled on client
    return defaultHtml ?? (defaultHtml = 
        HostContext.ResolveVirtualFile("/default.html", Request).ReadAllText());
}

Examples of where we use this for client-side routing in Single Page Apps:

1 Like