Terugknop Browser doet niet wat hij moet doen

Ik meen dat je iets met 'pushstates' kan doen, zodat je de URL mee kan laten veranderen bij een AJAX-request.
Ik neem aan dat de URL nu niet verandert?

- Ariën - op 15/11/2019 17:57:21

Ik meen dat je iets met 'pushstates' kan doen, zodat je de URL mee kan laten veranderen bij een AJAX-request.
Ik neem aan dat de URL nu niet verandert?

Dat klopt, URL blijft de hele tijd het zelfde.
Ik zal eens zoeken op pushstates :)

Dat is een optie, maar je kunt dit misschien ook oplossen door een correcte (her)initialisatie van de totdan toe geldende toestand.

Dit hangt (wederom) af van wat je concreet aan het doen bent. Kun je daar iets meer over vertellen?

Zodra de terugknop wordt ingedrukt van de browser, laadt de hele pagina opnieuw.

Dus je zat al op die pagina dan? Dat is mogelijk ook interessant. Dus soms wordt de pagina wel ververst, en soms niet?

Marco Hopster op 15/11/2019 17:30:37

Hallo allemaal,

Ik heb een site, deze is gemaakt met AJAX.

Als de gebruiker op een link in het menu klikt dan wordt een gedeelte van de pagina overschreven met behulp van AJAX.

Maar hiermee ben je er inderdaad nog niet. Wat je wilt is dat je ook direct op een andere pagina kunt komen afhankelijk van de URL die gevolgd wordt. Er zijn zeker een aantal stappen nodig om dit op een juiste manier te laten werken. Dit is wat je (bijvoorbeeld) wilt:


https://mysite.nl/ --> index.php --> show index content
https://mysite.nl/index.php --> index.php --> show index content
https://mysite.nl/contact.php --> index.php --> show contact content
https://mysite.nl/aboutme.php --> index.php --> show aboutme content


Je zult er dus eerst voor moeten zorgen dat ongeacht de URL die wordt gebruikt de gebruiker altijd naar de index.php doorgestuurd wordt. Dit kan (apache) met een .htaccess bestand geregeld worden.

Nadat je bovenstaande werkend hebt gekregen kun je in index.php aan de hand van de informatie in de $_SERVER array bepalen welke pagina de gebruiker wil zien. Zorg dat de gebruiker de juiste krijgt te zien. (AJAX is tot zover nog niet nodig).

Nu komt pas de AJAX stap: Indien gebruiker een interne link gebruikt wordt de pagina ververst met behulp van AJAX. Maar daarnaast moet je nog zorgen dat je met javascript de URL verandert. Dit kan met PushState(). Belangrijk hierbij (voor je vindbaarheid) is dat de URL's die je genereert met pushState() ook direct gebruikt kunnen worden. (keyboard focus op de URL balk van je browser en druk op Enter).

Om hier even op in te haken:
Vroeger zag ik dat sommige sites gebruik maakten van URL's zoals:
www.example.org/#!/nogiets

Waarbij die # en ! een bepaalde rol speelden?
Iemand die hier wat over weet, of is dit oude techniek die ingehaald is door pushState() ?

In elk geval wijst de # naar in een Anchor.
Met javascript kun je uiteraard dan een bepaalde pagina inhoud laten vervangen maar dit komt de SEO niet ten goede lijkt me. Aan de andere kant zal dit onder bijna iedere browser werken waar pushState() enkel in HTML5 (compatible browsers) zal werken. Maar goed we zijn bijna in 2020 aangekomen. HTML5 is al gemeengoed toch?