React-Snap is generating every page as a directory which is adding a trailing slash.

[klinskyc]

Feature Request

Is your feature request related to a problem? Please describe.
When running React-Snap, it is taking links like "/about", and putting the generated html into a folder called "about", which makes that link "/about/". This has SEO implications.

Describe the solution you'd like
generate the html as "about.html" instead of "/about/index.html"

Describe alternatives you've considered
I have not been able to find any alternatives, outtside of accepting the new link structure

Teachability, Documentation, Adoption, Migration Strategy
Ideally, react-snap's crawler would auto-detect the trailing slash based on the link it follows

[stereobooster]

To use this thing you will need additional configuration of the server:

/about -> about.html

the idea behind react-snap is so it would work out of the box (about/index.html works on all servers I know about without config).

Difference behind /about and /about/ is very small, so people will get confused by it.

[stereobooster]

I guess I answered question so gonna close

[adrianObel]

@stereobooster why would outputting html files require additional server config? static file servers all render files as is when found. It seems to me that using directories is what requires additional config?

[stereobooster]

Take any standard server (nginx, apache, h2o). Put about.html in the root folder. Visit /about in your browser. Will it server about.html for /about url without additional config?

[adrianObel]

Oh you mean stripping the .html part of the URL. Fair that would have to be done

[ricky11]

most servers will default to index.html if not found, it will default to the error page. hence you can configure your server or even a s3 static server host that for each nested folder look for the index.html file. this would mean that it would insert a trailing / at the end of the route. so /about/

[johnpipi]

I am having the problem where if i go to any page generated by react-snap for example /contact-us will 301 redirect to /contact-us/ with a slash on the end so it's causing major seo issues... how can I make it so it doesn't 301 redirect and put a slash on the end and can just load /contact-us ?

[burakkbilginn]

The question asked by @klinskyc is a vital problem for SEO purposes. The google SEO is not indexing the pages with redirect error. And adding a trailing slash "/" to the end of the url creates this redirect error. Since react-snap is created for SEO purposes, I think this problem of having 301 redirects should certainly be handled.

[johnpipi]

To fix the slash thing, since I am using apache I did this

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /

  # React Snap puts folder/index.html structure
  # have to turn off slashes then put it back with mod rewrite
  DirectorySlash Off
  RewriteCond %{REQUEST_FILENAME} -d
  RewriteRule ^(.*[^/])$ /$1/index.html [L]

  #RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /200.html [L]
</IfModule>

[UppunuthulaPrashanthGoud]

To fix the slash thing, since I am using apache I did this

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /

  # React Snap puts folder/index.html structure
  # have to turn off slashes then put it back with mod rewrite
  DirectorySlash Off
  RewriteCond %{REQUEST_FILENAME} -d
  RewriteRule ^(.*[^/])$ /$1/index.html [L]

  #RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-l
  RewriteRule . /200.html [L]
</IfModule>

working fine thank you..