My application in React of page error not found if I type the url

Asked

Viewed 195 times

0

Hello when I type the second url on my site Route works leading to requested page, but when I did build hospedei and repeated the same procedure the same does not work giving page not found anyone knows how to fix this problem? Follow in Attachment the image of my App.js.

react react-native

  • Problem solved, I needed to create a . htaccess file in the simple and easy public folder. But on another server that was having the same problem I created a file called "_Redirects" and in added the line " /* /index.html 200 " I was also successful. Note: Two solutions that solve the same problem on different host servers.

  • Hello, could you show your component code Routes ?

2 answers

1

import React from 'react';
import { Switch, BrowserRouter } from 'react-router-dom';

import RouteHandler from './components/RouteHandler';

import Home from './pages/Home';
import Leitura from './pages/Leitura';
import Admin from './pages/Admin';
import NotFound from './pages/NotFound';
import SignIn from './pages/SignIn';
import SignUp from './pages/SignUp';
import AddConteudo from './pages/AddConteudo';
import Listagem from './pages/Listagem';

export default () => {
    return (
        <Switch>
            <RouteHandler exact path="/">
                <Home />
            </RouteHandler>
            <RouteHandler exact path="/ad/:id">
                <Leitura />
            </RouteHandler>
            <RouteHandler private exact path="/admin">
                <Admin />
            </RouteHandler>
            <RouteHandler exact path="/signin">
                <SignIn />
            </RouteHandler>
            <RouteHandler exact path="/signup">
                <SignUp />
            </RouteHandler>
            <RouteHandler private exact path="/addconteudo">
                <AddConteudo />
            </RouteHandler>
            <RouteHandler exact path="/listagem">
                <Listagem />
            </RouteHandler> 
            <RouteHandler>
                <NotFound />
            </RouteHandler>
        </Switch>
    );
}

Observe que RouteHandler herda de outro componente Segue a baixo...

import React  from 'react';
import { Route, Redirect } from 'react-router-dom';
import { isLogged } from '../helpers/AuthHandler';

export default ({ children, ...rest }) => {
    let logged = isLogged();
    let autorizado = (rest.private && !logged) ? false : true;
    return (
        <Route 
            {...rest}
            render={ () => 
                autorizado ? children : <Redirect to="/entrar" />}
        />
    );
}

-1

puts to htaccess:

Rewriteengine On

Rewritecond %{SCRIPT_FILENAME} ! -f

Rewritecond %{SCRIPT_FILENAME} ! -d

Rewriterule . * index.html

Options -Indexes

Browser other questions tagged react react-native

You are not signed in. Login or sign up in order to post.