在后端脚本之后重定向到新的URL

Question

I have a signup.php page that contains the login through facebook button. structure of page is something like this

<?php
if(!isset($_SESSION['logged_in']))
{
    echo '<div id="results">';
    echo '<!-- results will be placed here -->';
    echo '</div>';
    echo '<div id="LoginButton">';
    echo '<a href="#" rel="nofollow" class="fblogin-button" onClick="javascript:CallAfterLogin();return false;">Login with Facebook</a>';
    echo '</div>';
}
else
{
    echo 'Hi '. $_SESSION['user_name'].'! You are Logged in to facebook, <a href="?logout=1">Log Out</a>.';
}
?>

ajax code used on this page calls another page process_facebook.php and processes data at the backend. code used for ajax in signup.php page is

<script type="text/javascript">
window.fbAsyncInit = function() {
    FB.init({
        appId: '<?php echo $appId; ?>',
        cookie: true,xfbml: true,
        channelUrl: '<?php echo $return_url; ?>channel.php',
        oauth: true
        });
    };
(function() {
    var e = document.createElement('script');
    e.async = true;e.src = document.location.protocol +'//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);}());

function CallAfterLogin(){
    FB.login(function(response) {       
        if (response.status === "connected") 
        {
            LodingAnimate(); //Animate login
            FB.api('/me', function(data) {

              if(data.email == null)
              {
                    //Facbeook user email is empty, you can check something like this.
                    alert("You must allow us to access your email id!"); 
                    ResetAnimate();

              }else{
                    AjaxResponse();
              }

          });
         }
    },
    {scope:'<?php echo $fbPermissions; ?>'});
}

//functions
function AjaxResponse()
{
     //Load data from the server and place the returned HTML into the matched element using jQuery Load().
     $( "#results" ).load( "process_facebook.php" );
}

//Show loading Image
function LodingAnimate() 
{
    $("#LoginButton").hide(); //hide login button once user authorize the application
    $("#results").html('<img src="img/ajax-loader.gif" /> Please Wait Connecting...'); //show loading image while we process user
}

//Reset User button
function ResetAnimate() 
{
    $("#LoginButton").show(); //Show login button 
    $("#results").html(''); //reset element html
}

</script>

Now the issue is that the process_facebook.php page works with fb data at backend, and after that gets redirected back to signup.php page and displays the data that process_facebook.php page had printed(optional). What i want is that instead of redirecting from process_facebook.php page back to signup.php page and displaying its data, i wish to redirect to another page, not only the new data should get loaded from the new page but the url should also get changed.(i.e www.example.com/app/signup.php should change to www.example.com/app/profile.php)

i forgot to mention but i have tried using header() to redirect but it is simply fetching data of profile.php page but showing the www.example.com/app/signup.php url.. Now the problem in it is that if i refresh the page for any reason, then the data of old signup.php page gets loaded

Answer 1

Headers need to go at the top of the page, before any HTML is output to the client. You can also output the data as the server goes down the page "writing" the HTML to the client.

Before any HTML, but after opening PHP use this:

header('Location: http://www.example.com/');

Referr to: http://php.net/manual/en/function.header.php