Laravel Sanctum场景下如何将meta存储的用户信息转JSON供Vue全局组件调用

你存到meta标签里的用户信息本质是JSON格式的字符串，直接读取后没有做反序列化，所以无法直接读取属性，按以下步骤修改即可：

1. 调整Laravel端的meta标签输出 #

为了避免JSON里的特殊字符和HTML属性引号冲突，输出时用json_encode加安全转义参数，代码替换为：

<meta name="user" content="{{ json_encode(Auth::guard('sanctum')->user(), JSON_HEX_QUOT | JSON_HEX_APOS) }}">

2. 调整Vue全局挂载逻辑 #

读取到meta内容后用JSON.parse转成原生JS对象再挂载：

Vue.prototype.$user = JSON.parse(document.querySelector("meta[name='user']").getAttribute('content'));

注意事项 #

• 未登录状态下Auth::guard('sanctum')->user()会返回null，转成JS后也是null，调用属性前建议加可选链判断this.$user?.id，避免空值报错。
• 如果你使用的是Vue3，全局挂载的语法需要调整为：

app.config.globalProperties.$user = JSON.parse(document.querySelector("meta[name='user']").getAttribute('content'));

内容的提问来源于stack exchange，提问作者K. Loeke