Page redirect not working consistently in PHP or JavaScript
Asked Answered
M

5

5

I have read various sources here and have created the following ways to redirect a user after 10 seconds. Not employed at the same time.

First attempt in PHP:

header("refresh:10;url=?switch=1")

Then, second attempt in JavaScript:

window.setTimeout(function () {
    location.href = '?switch=1';
}, 10000);

They both work nearly all of the time. They are used on a page using reveal.js (like this one). Sometimes when the URL fragments change, the page no longer redirects at all - though, more often than not, the redirection does indeed work.

Can anyone let me know what the issue might be, or a good resource to read about the issue?

Edit: Changing to setInterval in the JavaScript version results in it trying again.

Moyers answered 18/1, 2017 at 23:17 Comment(9)
why after 10 seconds?Gayl
@Gayl as part of a quiz/memory gameMoyers
I don't think the problem is with the commands but with your code and we can't help you with so little info. Also an other way to refresh/redirect the page is by using the <meta http-equiv="refresh" content="10; url=?switch=1"> meta.Planula
what do you mean by URL fragments change ? provide exampleWallford
Could it be that the redirect is happening; but you're not seeing it because the Reveal JS (or other JS) is changing your address bar instantly again?Myocardium
I think we need to see more of the php to solve this issue. That said, I'm inclined to agree with Gerrit's suggestion of building it as a single page app.Leoleod
Not enough information, to solve such problems you should copy few lines of code and paste here. As @ThanasisGrammatopoulos said, you could use a meta-tag. Have you checked if the header is inside of wrong if, variable gets changed to not this name, etp.? For me, it looks like too localized question.Hoenir
@SanderBackus Yes, this is exactly what happens. If the user swipes a screen or uses the arrow keys at the same time (within a few dozen milliseconds) - resulting in a url fragment change - the redirect stops. I switched setTimeout to setInterval and it will now eventually it redirect successfully.Moyers
Maybe use setTimeout / setInterval and first disable all Reveil JS code, so redirect can happen uninterrupted after that?Myocardium
D
4

When setting headers with php you must do so before any output is generated, it's possible that you are generating some kind of output in certain circumstances before the php header is set.

"It is important to note that headers are actually sent when the first byte is output to the browser. If you are replacing headers in your scripts, this means that the placement of echo/print statements and output buffers may actually impact which headers are sent." - from http://php.net/manual/en/function.header.php You may find that page to be useful reading (If you haven't already gone through it), I have found it useful when encountering header related problems.

I would add more context (and relevant code) to your question if you want more in-depth answers. We cannot know what's wrong with code we cannot see. If you include the code which utilizes the URL fragments you are setting we may have a better understanding of what your code is actually doing, and may be able to catch errors which you have missed. Here's a wikki on fragments. just for completeness. https://en.wikipedia.org/wiki/Fragment_identifier

Finally, with the JavaScript example I'm at a loss. It works fine on my system. (although the reload may be a few microseconds off). You could try using setInterval() instead?

Diseuse answered 19/2, 2017 at 0:57 Comment(0)
E
14

A quiz/memory game that moves from one question to another every ten seconds?

Rather reloading the application every x amount of seconds, build a one-page app that pulls in the data from your PHP script and then displays it every x seconds.

A very quick example (non-tested):

<!doctype html>
<html>
<head>
    <title>Example</title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
</head>
<body>

Question #<span id="question_number"></span><br />
<p id="question"></p>

<script>
var questionCounter = 0;

function loadQuestion(questionNumber) {
        questionCounter++;

        $.get( "<your_php_script_url>?question="+questionCounter, function( data ) {
                $( "#question_number" ).html( questionCounter );
                $( "#question" ).html( data.question );

                setTimeout(function() {
                    loadQuestion(questionCounter);
                }, 10000);
        });
}
loadQuestion(questionCounter);

</script>

</body>
</html>
Encumber answered 18/2, 2017 at 17:31 Comment(0)
D
4

When setting headers with php you must do so before any output is generated, it's possible that you are generating some kind of output in certain circumstances before the php header is set.

"It is important to note that headers are actually sent when the first byte is output to the browser. If you are replacing headers in your scripts, this means that the placement of echo/print statements and output buffers may actually impact which headers are sent." - from http://php.net/manual/en/function.header.php You may find that page to be useful reading (If you haven't already gone through it), I have found it useful when encountering header related problems.

I would add more context (and relevant code) to your question if you want more in-depth answers. We cannot know what's wrong with code we cannot see. If you include the code which utilizes the URL fragments you are setting we may have a better understanding of what your code is actually doing, and may be able to catch errors which you have missed. Here's a wikki on fragments. just for completeness. https://en.wikipedia.org/wiki/Fragment_identifier

Finally, with the JavaScript example I'm at a loss. It works fine on my system. (although the reload may be a few microseconds off). You could try using setInterval() instead?

Diseuse answered 19/2, 2017 at 0:57 Comment(0)
C
1
    <!doctype html>
    <html>
    <head>
    <title>Example</title>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
    </head>
    <body>

    Question #<span id="question_number"></span><br />
    <p id="question"></p>

    <script>
    var questionCounter = 0;

    function loadQuestion(questionNumber) {
        questionCounter++;

        $.get( "<your_php_script_url>?question="+questionCounter, function( data            ) {
                $( "#question_number" ).html( questionCounter );
                $( "#question" ).html( data.question );

                setTimeout(function() {
                    loadQuestion(questionCounter);
                }, 10000);
        });
}
loadQuestion(questionCounter);

</script>

</body>
</html>

this is a good example, I have used this code too.

Cleland answered 23/2, 2017 at 12:36 Comment(0)
B
0

Try this so simple example

setTimeout(function() {
    window.location='?switch=1'
}, 10000);
Barnett answered 24/2, 2017 at 11:24 Comment(0)
K
0

Use this jquery code

window.setTimeout(function (){
window.location.replace("?name=Munish");
},10000);
Kepi answered 24/2, 2017 at 17:15 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.