reitit 2023-04-28 | Slack Archive

Loic07:04:06

Hi, I have a question regarding reitit.frontend.easy. I have a full stack website with a backend reitit router with routes like this

[["/posts"
  ["/all"          {:post ring-handler}]
  ["/post"         {:post ring-handler}]
  ["/new-post"     {:post       ring-handler
                    :middleware [[auth/authorization-middleware]]}]]
 ["/users"
  ["/logout"         {:get (auth/logout-handler)}]
  ["/user"           {:post ring-handler}]
  ["/logged-in-user" {:post ring-handler}]]

 ["/*" {:get {:handler index-handler}}]]

You can notice the catch-all routes at the end that returns the index.html My frontend is a SPA using re-frame/reagent. Here are the frontend routers routes:

(def routes
  [["/"
    {:name ::home
     :page-name :home
     :title "home"
     :view #(page :home)}]

   ["/about"
    {:name ::about
     :page-name :about
     :title "About"
     :view #(page :about)}]

   ["/blog"
    [""
     {:name ::blog
      :page-name :blog
      :title "Blog"
      :view #(page :blog)}]
    ["/:post-id"
     {:name ::blog-post
      :page-name :blog
      :title "Blog"
      :view #(page :blog)}]]])

I noticed that when I set the :use-fragment to false, and then type the url "/about", this is what happens: • don't match any server route so returns the index.html (basically reload the page) • somehow my current-view got updated even though on-navigate was not triggered. However, if I type in the url "/blog/some-post-id", I have an error saying:

refused to execute script from '' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

So it looks like the catch-all server route was triggered and serve the html page (same as for /about) but the view was not updated magically on the frontend. I am surprised the "/about" and "/blog" url actually triggered something in the frontend because I thought it was not possible without fragments. Also, accessing "/blog/some-post-id" via the code with (rfe/href ::blog-post {post-id "some-id}) works. but reloading it does not. If I set the use-fragment to true, everything work as expected without server call and the fragment is present in the URL. Can someone explain to me what happens exactly when the fragments are set to false? Thank you

wevrem13:04:59

Your backend server needs to provide the correct content-type on the files it is serving up. Check your middleware.

wevrem13:04:53

Note that the error is happening with one of your resource files, a JS file.

Loic03:04:49

I am wondering if I need some additional figwheel configuration. Because if the frontend route is something like "/a", no problem but if it is like "/a/b" I have the error above. Anyway, I think the proper way to have my post-id in the url is with the fragments on, I was just curious about how it was working without it.

Loic08:06:11

For the record, the issue was that the paths for the js and css in index.html were relative to the route. The is why the js and css files were trying to be found in the nested routes instead of the root. This was why route /a was working but /a/b was not because the css was being looked in /a instead of the root. The solution is then to change the paths to absolute paths in the index.html: • main.js to /main.js • css/style.css to /css/style.css

2023-04-28

Channels