Using pushState not working in shared url

Attention to the framework7 developer team,

I am using “framework7 Core desktop” to build a website with data from API. For removing hash in URL parameter I had used pushState method, it’s work properly but the user can’t find or the URL(Not Found message

) when it’s shared or opened in another tab or browser.

I’m using the latest version of Framework7 (v4.4.6)

Thanks in advance.

You need to configure your server to response with same index file for any routes requests

Could you kindly explain furthermore in this issue?
In my project folder structure, I implemented pushState in app.js like this,

//pushState
view: {
pushState: true,
pushStateSeparator: “#”,
pushStateOnLoad: false
}

and in my routes.js I have this path,

var routes = [
{
path: ‘/’,
component: HomePage,
},
{
path: ‘/about/’,
component: AboutPage,
}

which give me URL like “http://localhost:8080/#/about/”. And if I empty the pushStateSeperator parameter then I get “http://localhost:8080/about/” but if I use this URL directly to another tab or browser I get “Cannot GET /about/” message.

Also, I used this method,
https://developers.google.com/search/docs/ajax-crawling/docs/specification
but didn’t work.

Thanks in advance

It is not F7 related. You need to configure SERVER where app is located to handle correctly such requests, e.g. if you request /about/, it must respond with /index.html file

1 Like

To server configuration, could you provide any documation or methods?

Thanks in advance