stereobooster / react-snap

👻 Zero-configuration framework-agnostic static prerendering for SPAs
MIT License
5.04k stars 391 forks source link

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

Closed klinskyc closed 5 years ago

klinskyc commented 5 years ago

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 commented 5 years ago

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 commented 5 years ago

I guess I answered question so gonna close

adrianObel commented 5 years ago

@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 commented 5 years ago

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 commented 5 years ago

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

ricky11 commented 3 years ago

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 commented 10 months ago

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 commented 7 months ago

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 commented 7 months ago

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>