I have two pages, one to show the list of agencies, and one to add a new one. I can easily access to http://localhost:8000/create from http://localhost:8000, but if I try to reload the page I get the error that no route found for 'GET http://localhost:800/create'
Main.js
import React from 'react';
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import AgencyList from "./pages/AgencyList"
import AgencyCreate from "./pages/AgencyCreate"
function Main() {
return (
<Router>
<Routes>
<Route exact path="/" element={<AgencyList/>} />
<Route path="/create" element={<AgencyCreate/>} />
</Routes>
</Router>
);
}
export default Main;
Stacktrace of the error :
Symfony\Component\HttpKernel\Exception\NotFoundHttpException:
No route found for "GET http://localhost:8000/create"
at C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\http-kernel\EventListener\RouterListener.php:128
at Symfony\Component\HttpKernel\EventListener\RouterListener->onKernelRequest(object(RequestEvent), 'kernel.request', object(TraceableEventDispatcher))
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\event-dispatcher\Debug\WrappedListener.php:115)
at Symfony\Component\EventDispatcher\Debug\WrappedListener->__invoke(object(RequestEvent), 'kernel.request', object(TraceableEventDispatcher))
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\event-dispatcher\EventDispatcher.php:230)
at Symfony\Component\EventDispatcher\EventDispatcher->callListeners(array(object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener), object(WrappedListener)), 'kernel.request', object(RequestEvent))
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\event-dispatcher\EventDispatcher.php:59)
at Symfony\Component\EventDispatcher\EventDispatcher->dispatch(object(RequestEvent), 'kernel.request')
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\event-dispatcher\Debug\TraceableEventDispatcher.php:153)
at Symfony\Component\EventDispatcher\Debug\TraceableEventDispatcher->dispatch(object(RequestEvent), 'kernel.request')
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\http-kernel\HttpKernel.php:129)
at Symfony\Component\HttpKernel\HttpKernel->handleRaw(object(Request), 1)
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\http-kernel\HttpKernel.php:75)
at Symfony\Component\HttpKernel\HttpKernel->handle(object(Request), 1, true)
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\http-kernel\Kernel.php:202)
at Symfony\Component\HttpKernel\Kernel->handle(object(Request))
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\symfony\runtime\Runner\Symfony\HttpKernelRunner.php:35)
at Symfony\Component\Runtime\Runner\Symfony\HttpKernelRunner->run()
(C:\Users\TheDr\Desktop\Projets\kooshii\vendor\autoload_runtime.php:29)
at require_once('C:\\Users\\TheDr\\Desktop\\Projets\\kooshii\\vendor\\autoload_runtime.php')
(C:\Users\TheDr\Desktop\Projets\kooshii\public\index.php:5)
Thanks
It looks like /create
is a React route but it is caught by Symfony. My guess is when you navigate to /create
from React, but if you reload, it is actually the HTTP server that gets the request first (not React) and it's sending that request to Symfony thus the exception.
Since you don't give a lot of details on your app, I'm gonna make some assumptions.
So, if all this is true you could use the following approach:
/api
Then assuming (again) that you are using Symfony 5.1+ and annotations for your routes definition (you could easily change it to attributes should you use PHP 8.x), you could have a DefaultController that looks something like this.
<?php
declare(strict_types=1);
namespace App\Controller;
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\Routing\Annotation\Route;
final class DefaultController extends AbstractController
{
/**
* @Route("/{reactRouting}", name="index", priority="-1", defaults={"reactRouting": null}, requirements={"reactRouting"=".+"})
*/
public function index(): Response
{
return $this->render('default/index.html.twig');
}
}
Then have all your other routes start with /api/
which is optional but might be a good idea to avoid route collision between React and Symfony.
Since your route /{reactRouting}
has the lowest priority, it will be matched only if no other routes are matched (catch-all).