Jquery Datatable saves state but should clear while refreshing page?

I have implemented jquery datatable in my project what i am trying to do is whenever i am on any datatable page and i switch to any another link from that page and after getting back i must land on my same datatable page from which i jumped to link

for this i have done this

 $("#userTable").DataTable({
            "bStateSave": true,
            "fnStateSave": function(oSettings, oData) {
                localStorage.setItem('userTable', JSON.stringify(oData));
            },
            "fnStateLoad": function(oSettings) {
                return JSON.parse(localStorage.getItem('userTable'));
            },
            "bProcessing": true,
            "serverSide": true,
        });

now this tackled my problem but now i am facing another issue which is whenever i am refreshing my page it doesn't starts from 1st page instead i lands on same page and the reason is quite obvious that datatable information is stored in local storage now i am supposing is there any better way to handle this condition

what i have found is something like this

drawCallback: function() {
                // When page is refreshed, draw table with clear state.
                if (performance.navigation.type == 1) {
                    console.log(performance.navigation.type);
                    localStorage.clear();
                }                    
            },

but this method does not helping me properly as sometimes it is working and sometimes not

So is there any robust way to handle this if any please help me with this ?

Thank you !!