简体   繁体   English

使用laravel身份验证时,如何检查用户是否已在“反应”组件中“登录”?

[英]How do I check if user is 'logged in' in a react component when using laravel authentication?

I have setup laravel authentication in my website. 我在我的网站上设置了laravel身份验证。 It works very well but I want to know how I can check if a user is logged in when inside a react component and display his/her specific content. 它工作得很好,但我想知道如何检查用户是否在反应组件内部登录并显示他/她的特定内容。

One approach I have used to solve the problem with checking if the user is logged in is to attach it in your main blade file as 'global data'. 我用来检查用户是否已登录的问题的一种方法是将其作为“全局数据”附加到主刀片文件中。 First set up your controller. 首先设置你的控制器。

public function index()
{        
    return view('welcome')->with(["globalData" => collect([
        'user' => Auth::user()
    ]);
}

Then in your root blade file 然后在您的根刀片文件中

<script>
    let globalData = "{!! $globalData->toJson() !!}";
</script>

Then you can access a user property anywhere in your components by refering to globalData.user and thus test if user is an object or null/empty. 然后,您可以通过globalData.user来访问组件中任何位置的用户属性,从而测试user是对象还是null / empty。


Example from a React project with version 15.4.2 来自版本为15.4.2的React项目的示例

Controller 调节器

class GuiController extends Controller
{
    public function __construct() {
        $this->data = [
            'projects' => $this->projects(), 
            'packs' => Pack::all(),
            'stimpack_io_token' => env('STIMPACK_IO_TOKEN'),
            'stimpack_data_url' => env('STIMPACK_DATA_URL'),
            'manipulatorData' => ManipulatorController::attachStartupData()
        ];
    }

    public function index()
    {        
        return view('welcome')->with(["data" => collect($this->data)]);
    }

View 视图

<body>            
    <div id="main"></div>
    <script>
        let data = {!! $data->toJson() !!};
    </script>
    <script src="{{asset('js/app.js')}}" ></script>                
</body>

Usage inside component 组件内部的用法

upload() {
    var compiler = new Compiler(this.props.engine);
    var compiled = compiler.compile();
    $.ajax({
        type: "POST",
        beforeSend: function(request) {
            request.setRequestHeader("stimpack-io-token", data.stimpack_io_token);
        },

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 当访问正确的 url 并且用户未登录时,如何安装我的 React 组件? - How can I make my React Component mount, when the right url is accessed and the user is not logged in? 使用 firebase 身份验证刷新页面时如何让用户保持登录状态 - How do I keep a user Logged in when refreshing a page with firebase authentication 如果用户未登录,如何处理中继和graphql身份验证? - how do I handle relay and graphql authentication if user is not logged in? 您如何重定向未使用护照身份验证登录的用户 - how do you redirect a user who is not logged in using passport authentication 如何在反应中检查用户是否使用密码方法登录? - How to check if user is logged in using password method in react? 如何检查用户是否使用 React 和 Embedded RuBy (erb) 登录? - How to check if user logged in using React and Embedded RuBy (erb)? 在反应中使用 firebase 检查用户是否登录 - Check if user is logged in or not using firebase in react React Context 的用户授权/身份验证有问题。 如何访问 class 组件中的变量? - Having issues with user Authorisation/Authentication with React Context. How do I access the variables in a class component? 一旦用户使用 React 和 Firebase 登录(从“登录”到“个人资料”),我如何更新我的导航栏? - How do I update my NavBar once a user is logged-in (from 'log in' to 'profile') using React & Firebase? 我需要访问登录时最初存储在 redux 商店中的用户信息..我该怎么做? React-redux - i need to access user info which are initially store in redux store when logged in.. How can i do that? React-redux
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM