history state (due to pushState) issues

oferlaor
User w
User w
Posts: 10
Joined: Wed Jan 27, 2021 2:24 pm

history state (due to pushState) issues

Post by oferlaor »

Hi,

I've been struggling to debug a strange behavior that the plugin exhibits.

How to reproduce on this forum:
1. Scroll in the forum list to the bottom
2. click the last forum (e.g., Apache and Server related)
3. Press back on the browser - it jumps to the correct location, but to the top of the page and note that the URL remains the same as the previous page (not the list of forums).
4. Press back on the browser again - NOW it jumps both to the correct location on the page and the correct URL.

I've been able to track down what I think is the root cause. It looks like when you click, the code in the phpbb overall_footer will notice that it is an internal call and convert the A-click into a message to the parent of the IFRAME.

$(document).on("click", "a", function(e) {
......
if ('parentIFrame' in window){
if( typeof w3allNOappend == 'undefined' || w3allNOappend == false ){
window.parentIFrame.sendMessage(w3allappend);
}
}

The message of the IFRAME does the pushState with the correct URL. However, there are now two events in the system - pushState with the correct state and the original A-click (seen above) which doesn't preventDefault.

I tried a few things, but no luck. I tried replaceState so that the state would override the A click's state, but that doesn't work (I think because theres' not always a state to replace). I also tried to preventDefault on the A tags' click event. No luck. The only thing that works is to change the location of the root of the iframe - but that's really inefficient as it loads everything from the beginning.

ideas or suggestions?
User avatar
axew3
w3all User
w3all User
Posts: 2677
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: history state (due to pushState) issues

Post by axew3 »

so you may mean this, i try to explain:
when you land into page forum, no history is pushed then what you say happen. The push happen on click, when phpBB footer code response, and only in this case (for some click event, response is avoided on phpBB footer code as you saw, may something more need to be adjusted on it, we'll see). But this is not the problem in this case maybe.

To try a fix for this on fly test, i've do this:

open page-forum.php (or whatever you named it) into your active template folder
and search for this code on the very bottom:

Code: Select all

</script>";
?>
</div>
<!-- END iframe div -->
<?php get_footer(); ?>
just before the closing </script> tag, add the follow:

Code: Select all

w3allpurl = '/wordpress/forum';
history.pushState({w3allpurl: w3allpurl}, \"Forums\", w3allpurl);
note that you have to adjust
/wordpress/forum
to correctly point to your page forum in wordpress, test by reloading the page and see what url is pushed and you'll see if you're correct with this setting.
Now the index is correctly pushed and when you go to return back then it will be loaded into address bar.

This example anyway, as i propose you, works if you land pointing to the index: if you point to another page, like ex
https://subdomain.w3host.com/phpbb3/viewforum.php?f=2
it will be by the way pushed as index page: it is necessary to push any landed page rebuilding correct pairs
And to do this, the correct url need to be rebuilt to be pushed as base64encoded and with proper fancy url.

Thank you for report, it will be fixed on v6 code if you do not return here with a code solution.

Have i forgot or misunderstand something?
Guest

Re: history state (due to pushState) issues

Post by Guest »

1. this is an example of how
https://www.youtube.com/watch?v=gVQrm3x ... e=youtu.be

2. BTW, we've been able to fix some of the issues your users face:

a. reloading the page after login (i.e., the typical scenario is that a user jumps to a part of the page, gets logged in automatically and it causes the forum to jump to the top index rather than the correct location (his original request). This is particularly annoying when users jump to an unread post and get into the home page. Also, note that internally, phpbb sometimes logs you out and back in implictly (if you're logged in multiple computers and the session timeout expired), so this fix is very useful.

b. Another issue is the email to unread. When the user gets the link, he opens up the URL, this marks the topic as read, and the header will reload the image, causing the page to redirect to the WP wrapper, but losing the #unread. Our fix is ugly and requires modification of phpbb core files, basically we encode the base64 call so that there's no need for the redirect

c. Users Logging in too many times. This is a problem with phpbb. There's a stupid verification key that lives inside the forms, and they validate origin IP, time, and many other items. I'm not really sure what this is used for, but if you're behind a CDN, have smart caching, or your users use mobile phones, their IP and other properties can fail and users either get logged in too many times, or they actually get rejected when they try to post. There are many settings in the default phpbb configuration that are much too harsh for large scale normal situations. just had an "submitted form was invalid" error on this forum because uploading the video took a while. Ironic.

To see what we've done, you can look at the modified code here: https://htmag.co.il/forum
User avatar
axew3
w3all User
w3all User
Posts: 2677
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: history state (due to pushState) issues

Post by axew3 »

Great!

About
read/unread email notification
did you applied something like this?
viewtopic.php?f=2&t=1618

Going to check asap, so useful info, and also the site and the template is nice.
Awesome, my compliments!

I will may return to ask you something if something not clear, thank you for the report.
The final solution may will push the url to the address bar.
oferlaor
User w
User w
Posts: 10
Joined: Wed Jan 27, 2021 2:24 pm

Re: history state (due to pushState) issues

Post by oferlaor »

The unread solution that we did ultimately was to change the URL the user receives to the BASE64 encoded method, it required core file change in post.php:

'U_NEWEST_POST' => generate_board_url(true) . "/forum?q=" . base64_encode("viewtopic.{$this->php_ext}?f={$this->get_data('forum_id')}&t={$this->item_parent_id}&e=1&view=unread#unread"),

The unread trick you did there is to detect which items were unread and then using that for the redirect point. The scrolling would work, but the items wouldn't be marked as new (we actually change the shade a bit to make it more apparent).

A cleaner way to do it, is to modify htaccess to redirect "view=unread" and redirect to an endpoint that would encode it. One could also modify the notification email text template to point to that unread end point.
User avatar
axew3
w3all User
w3all User
Posts: 2677
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: history state (due to pushState) issues

Post by axew3 »

The js unread trick above, just let the code follow to the overall_footer code, if the request is for unread:
at the time the page load, then you get the last unread and redirect exactly to this post.
Since normally this is what happen on default behavior, it is exactly what is expected as result.
Yes the htaccess is more consistent and offer several benefits under many aspects. The first is the page reload that you can avoid to happen.

The old htaccess concept of the v1 and v2 code deserve to be improved and it will be.
It is long time that i think to have ready snippets for both js or htaccess.

v6 code will contain several improvements, also based on what we discussed and you suggested here.

i'm over these days on finish with Audio/Video recorder into phpBB posts extension.
So we can start to use the phpBB forum as never we had think it could be.
Easy, unbelievable light, allowing to record mp3 for audio and webm for video, that can be recorded directly on post.
You can listen the result, then just click to insert the audio or video into the post as attachment.
It will be possible to play and listen each single audio, but also a button to listen/play all topic's audio video sequentially, like you would do into a telegram/whatsapp message will be provided (that's quite easy as concept: you'll not believe that all this would be possible without changing/adding nothing into phpBB events and code). phpBB contain all the necessary by default.
I'm sure that many will love it.

About video:
Unfortunately, webm is still not completely supported on ios safari?
Time ago i did a video/audio recorder plugin for wordpress (it is still working fine here on my localhost under last wp5.6 and even php8, but i never released as free, i will do when asap i will have the time to review the code i did years ago), and for video i had to install ffmpeg on server to convert streams into mp4, the unique video format supported by all browsers.
Well, the extension ideally will provide both solutions: more advanced could install and use ffmpeg, but the default will be webm.
Just charging my old ipad, i will update and test things on it to check where we are with webm on safari in 2021.

p.s yes checked, webm is still unsupported into ios: tested firefox and safari, both not working, webm is not recognized

Will be possible to use only for video/audio, or only audio, or both. It will be awesome, and as said, unbelievable easy and light.

https://caniuse.com/?search=webm


Post a new topicREC1.png
Post a new topicREC1.png (13.49 KiB) Viewed 5070 times
videoAudioToPost.png
videoAudioToPost.png (13.06 KiB) Viewed 5070 times
Post Reply