How can I make Signature header on a client which is NOT a plugin...?

[KLA6]

As I've understood from the codes, the below can generate a API header set.

\Fresns\WebEngine\Helpers\ApiHelper::getHeaders();

However, I'm trying to make a client which is NOT on the same server, and NOT on the same domain.
And my client can NOT have Laravel, because it is just a simple JS codes.
In this case, how is the process to get a API header set to access the server's APIs?

Thank you for reading my question.

[KLA6]

Hm, I've just made a successful API connection, but I'm still not sure this is the right way or not.

Step 1. I made my custom API on the server to generate a header set, and the core is below.

header( 'Content-Type: application/json' );
$header = \Fresns\WebEngine\Helpers\ApiHelper::getHeaders();
echo json_encode( $header );

Step 2. My client's PHP part accesses the above custom API to achieve a header set. Actually, this can be done by JS as well, but I just wanted to hide my custom API endpoint URL.

$header = json_decode( file_get_contents( 'the-above-api-url' ), true );

Step 3. My client's JS part uses only these headers to access the server's API.

$.ajax( {
  dataType: 'json',
  headers : {
    "X-Fresns-App-Id"             : '<?= $header['X-Fresns-App-Id'             ] ?>',
    "X-Fresns-Client-Platform-Id" :  <?= $header['X-Fresns-Client-Platform-Id' ] ?> ,
    "X-Fresns-Client-Version"     : '<?= $header['X-Fresns-Client-Version'     ] ?>',
    'X-Fresns-Client-Device-Info' : '<?= $header['X-Fresns-Client-Device-Info' ] ?>',
    "X-Fresns-Signature"          : '<?= $header['X-Fresns-Signature'          ] ?>',
    "X-Fresns-Signature-Timestamp":  <?= $header['X-Fresns-Signature-Timestamp'] ?> ,
  },
  success( response ) {
    console.log( JSON.stringify( response, null, 2 ) )
  } // success
} ) // ajax

Anyway, it is working, but I feel this is just a kind of wrong approach, because if don't make another security part on the above step 1, anyone can achieve the siganture.

So, I need to make another access control part for the above step 1, but if there is any recommended (or already-made) way to achieve signature from the client safely, I want to know more.

Thank you for reading my article.

[jevantang]

The signature generated by App Secret is used to access the public API, for the user API you need to get the user token through the login interface.