HTML5 History/State API, AJAX, PHP redirect, URL change

1
votes

My site uses History.js HTML5 History/State API (pushState, statechange event etc) and loads the page into my .content div via AJAX (jQuery).

Works fine until I do a URL redirection server side (CakePHP $this->redirect($url);). The content updates fine with the page I redirected to, but I would like to add a new state to the history.

How should I do this? Is there a way I can check the AJAX response to know if the request was redirected or should I approach the problem from another direction?

Example

Admin listing of blog posts. /posts/index
User selects a post. /posts/open/13
User clicks "Delete post" /posts/delete/13

After deleting from DB, the request gets redirected to the listing, but the address bar is still /posts/delete/13
I would like to replace the current state (/posts/delete/13) with the new URL to the history (/posts/index). But how would I know if the AJAX request was redirected or not?

1
phpajaxurl-redirectionhtml5-history
What exactly do you want to add to the history? - Dave
Original question updated with an example. Thank you - rhinoeli
@rhinoeli Do your server side scripts return JSON encoded respones? Like e.g. {status:200, url:'/posts/index'} - Markus Hofmann
@MarkusHofmann No, response is plain html. - rhinoeli

1 Answers

1
votes

I came up with a (IMO) temporary solution.

Server side redirection: check if the request is async. If yes, do not redirect, instead add a "redirect-to" header to the response and send it (body is empty). Client side check the response if it has the header. If yes, do a replaceState and make a new ajax call for the received "redirect-to" url.

What do you think about this?