API call using angular 7 doesn't read PHP session variables

Question

I need to create simple login with angular and use sessions. for that i've two php files and angular files.

This is PHP file 1

session_start();
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');


$postdata = file_get_contents("php://input");

if(isset($postdata) && !empty($postdata)) {

    $request = json_decode($postdata);
    $username=trim($request->username);
    $password=trim($request->password);

  if($username == 'admin' && $password == 'admin') {
    $_SESSION['user'] = 'admin';
    ?>
{
  "success": true,
  "secret": "This is the secret no one knows but the admin"
}
    <?php
  } else {
    ?>
{
  "success": false,
  "message": "Invalid credentials"
}
    <?php
  }
} else {
  //var_dump($_POST)
  ?>
{
  "success": false,
  "message": "Only POST access accepted"
}
  <?php


}

?>

This is PHP file 2

    <?php
    session_start();
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');

    $user = $_SESSION['user'];

             echo '{
                "message": "'.$user.'",
                 "success": true   
             }';


        ?>

In one of my component's ngOnInit(), i've called both of these APIs (i know first one should be triggered in a login submit button, but for testing purpose i've used both under one.). I have even used settimeout function to delay the second call

 ngOnInit() {


    this.auth.getUserDetails('admin','admin')
    .subscribe(
      data => {
        console.log('success',data);
        if(data.success){

        }
        else{
          window.alert("invalid");
        }

    },
      error=> {
        console.log('failed',error);


      }
  ) 
  var _this=this;
  setTimeout(function(){


    _this.user.getSomeData().subscribe(data=>{

      console.log(data);

    })

    }, 3000);


  }

But still user session is unavailable.. I need help to understand the reason. Please check the image. For first post request is success and but second get request is failed. It says session variable i used (user) is not available.
But that variable has been set by previous request.

This is the error i get

Thank you

Answer 1

I had the same issue working on React and PHP locally, both using localhost but on different ports. This answer helped me.

PHP sessions are stored on cookies, and when making cross-domain (or in this case cross-port) requests those cookies are not shared.

In your first login call to PHP, you need to return the session ID using session_id() and store this somewhere on your app. Then, when making further calls to PHP, make sure to pass it the same session id. You can then use session_id() again to set the id to the one you passed, which will keep the last session active:

if ($request->session_id) {
session_id($request->session_id);
}
start_session();
$json['session_id'] = session_id();
$json['user'] = $_SESSION['user'];
echo json_encode($json);

Answer 2

You are Working on Two Different Server localhost:80 for PHP and Localhost:4200 for angular so your request for a session is Localhost:4200 This request can not access PHP session. so please set headers in angular for the PHP side request.