Why when I refresh the page, it shows that the page was not found?

[raana96]

I used nextjs-dynamic-routes in my router. all links is worked, but before refresh page , Shows me not found.

--pages
   |
   |- -index
   | --blogs
   |     |     
   |     |--index
   |     |--[post]

[post].js

class Post extends React.Component{
    state={
        data:null,
        post:'',
        title:'',
        content:'',
        imageUid:'',
        status:0,
        loading:true
    }
    componentDidMount(){
        console.log(this.props);
        this.setState({loading:true});
        const post = Router.router.query.post;
        if(post != undefined){
            if(this.state.data == null){
                this.getPost(post);
            }
        }
        
    }
    getPost = async (post)=>{
        const res = await this.props.setPostDetalis(post);
        this.setState({loading:false}),1000;
        this.setState({
            title: res.data.data.object.title,
            content: res.data.data.object.content,
            imageUid: res.data.data.object.attachments[0].uid,
            data: res.data.data,
            status:res.data.status
        });
        

    }
    componentDidUpdate(){
        const post = Router.router.query.post;
        if(post != undefined){
            if(this.state.data == null){
                this.state.loading=true;
                this.getPost(post);
            }
            
        }
        
        
    }
    Keywords = () => {
        const data = this.state.data.tags.map((item) => item.title);
        return data.toString();
    }
    render(){
        return (

            <div>
                  {this.state.title}
          </div >

        )
    }
}

const pagePost = withRouter(Post);

const mapStateToProps = (state)=>{
    return state
}
const mapDispatchToProps = {
    setPostDetalis : setPostDetalis
}
const pagePostIndex = pagePost;

export default connect(mapStateToProps,mapDispatchToProps)(pagePostIndex);

router.js

const Router = require('nextjs-dynamic-routes')
 
const router = new Router()
 
 
router.add({ name: 'post', pattern: '/blogs/:post' })

 
module.exports = router

server.js

const express = require('express');
const next = require('next');
const { parse } = require('url');

const DEV = process.env.ENVIRONMENT !== 'production';
const PORT = 9000;

const app = next({dir: '.', dev: DEV});
const handle = app.getRequestHandler();

const getRoutes = require('./routes');

const routes = getRoutes();
  app.prepare().then(() => {
    const server = express();
    //server.get('/blog/:id', (req, res) => ssrCache({ req, res }))
    server.get('*', (req, res) => {
      const parsedUrl = parse(req.url, true);
      const { pathname, query } = parsedUrl;
      const route = routes[pathname];
      if (route) {
        return app.render(req, res, route.page, route.query);
      }
      return handle(req, res);
    });

    server.listen(PORT, (err) => {
      if (err) throw err;
      console.log(`> READY FOR LIFOTFF http://localhost:${PORT}`);
    });
  });