サーバーサイドプログラムが生成した値をJavascriptに渡す際、直接scriptタグ内に変数を出力すべきか、<head>の<meta>タグのcontentとして持たせるべきか決めかねています。

具体例として、CSRF対策用のトークンを使って非同期通信などでデータを取得する際、最初は次のようにしてデータをHTMLに直接出力していました。

<script>
var config = {
    api_url: '<?php echo $apiUrl;?>',
    token: '<?php echo $csrfToken;?>',
};
</script>

複数のリンクされたJSファイルからこの情報を利用するため、グローバル変数を定義する必要がありました。（ブラウザ要件によりconstは使えません）

しかし使用しているフレームワーク(Laravel)の公式ドキュメントによるとこのような変数を用いず、<meta>のcontentを使うよう説明がありました。

<meta name="csrf-token" content="<?php echo $token;?>">

// jQueryでの使用例
<script>
$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});
</script>

たしかにこちらの方法のほうが書き換えられる心配が少ないのでグローバル変数を使うよりも綺麗にかけるので良いのですが、Javascript の定数を宣言するために積極的に meta タグを利用すべきなのでしょうか？

似たものとして例を挙げると APIサーバーのURL、認証用のアプリケーションIDやワンタイムパスワード、ログイン中のユーザーIDなどがあると思います。これらの値を複数のJSファイルで使いまわす可能性がある場合どのような形で定義すべきかのルールや傾向などありましたら教えて下さい。