Question

我正在使用Laravel，Vuejs和编辑器'PHPstorm'构建应用程序

我在 <head></head> 标记内的 app.blade.php 文件中编写了以下代码

@if(!auth()->guest())
        <script type="text/ecmascript-6">
            window.Laravel.userId = <?php echo auth()->user()->id; ?>
        </script>
    @endif


</head>
<body>

它在phpstorm中显示“预期的表达式”错误。有什么解决方案？

（请注意我的问题的新更新）那么我的下一个问题是我想在我的 app.js 文件

中使用它

console.log（window.Laravel.userId）

if（window.Laravel.userId）{

上面的代码是在.js文件中使用它的正确方法还是有更好的解决方案？

（新更新）我的代码

我在这里添加我的代码 app.blade.php

<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Laravel') }}</title>

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">


    <script type="text/ecmascript-6">
        window.Laravel = '<?php echo json_encode([
                'csrfToken' => csrf_token(),
        ]); ?>'
    </script>

@if(!auth()->guest())
        <script>
            window.Laravel.userId = '<?php echo auth()->user()->id; ?>'

         </script>
     @endif


 </head>
 <body>
     <div id="app">
         <nav class="navbar navbar-default navbar-static-top">
             <div class="container">
                 <div class="navbar-header">

                     <!-- Collapsed Hamburger -->
                     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse" aria-expanded="false">
                         <span class="sr-only">Toggle Navigation</span>
                         <span class="icon-bar"></span>
                         <span class="icon-bar"></span>
                         <span class="icon-bar"></span>
                     </button>

                     <!-- Branding Image -->
                     <a class="navbar-brand" href="{{ url('/') }}">
                        {{ config('app.name', 'Laravel') }}
                    </a>
                </div>

                <div class="collapse navbar-collapse" id="app-navbar-collapse">
                    <!-- Left Side Of Navbar -->
                    <ul class="nav navbar-nav">
                        &nbsp;
                    </ul>

                    <!-- Right Side Of Navbar -->
                    <ul class="nav navbar-nav navbar-right">


                        {{--add code here extra for notification--}}
                        @if(Auth::check())
                            <lesson v-bind:lessons="lessons"></lesson>
                        @endif




                    <!-- Authentication Links -->
                        @guest
                            <li><a href="{{ route('login') }}">Login</a></li>
                            <li><a href="{{ route('register') }}">Register</a></li>
                        @else
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" aria-haspopup="true">
                                    {{ Auth::user()->name }} <span class="caret"></span>
                                </a>

                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="{{ route('logout') }}"
                                            onclick="event.preventDefault();
                                                     document.getElementById('logout-form').submit();">
                                            Logout
                                        </a>

                                        <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                                            {{ csrf_field() }}
                                        </form>
                                    </li>
                                </ul>
                            </li>
                        @endguest
                    </ul>
                </div>
            </div>
        </nav>

        @yield('content')
    </div>

    <script src="{{ asset('js/app.js') }}"></script>
</body>
</html>

app.js

require('./bootstrap');

window.Vue = require('vue');

window._=require('lodash');
window.$=window.jQuery =require('jquery');


Vue.component('lesson', require('./components/LessonNotification.vue'));
const app = new Vue({
    el: '#app',
    data:{
        lessons:''
    },
    created(){
       console.log(window.Laravel.userId);
        if(window.Laravel.userId){
            axios.post('/notification/lesson/notification').then(response => {
                this.lessons=response.data;
                console.log(response.data)
            });

            Echo.private('App.User.'+window.Laravel.userId).notification((response) =>{
                data={"data":response};
                this.lessons.push(data);
            });

        }
    }

});

代码的主要任务

实际上，我的代码的主要主题或任务是我想使用或获取任何脚本（特别是 .js 文件）中的已登录用户信息。这就是为什么首先我在app.blade.php中设置或定义记录的用户信息..以下代码的原因

@if（！auth（）-> guest（））                          window.Laravel.userId = user（）-> id; ？>                  @endif

然后，因为我需要已登录用户ID。所以我通过 app.js

中的以下代码对其进行了调用

console.log（window.Laravel.userId）

我的@ vivek_23答复

<script type="text/ecmascript">
        window.Laravel = JSON.parse('<?php echo json_encode([
                'csrfToken' => csrf_token(),
        ]); ?>');
    </script>

<!-- This makes the current user's id available in javascript -->

    @if(!auth()->guest())
        <script>
            window.Laravel.userId = '<?php echo auth()->user()->id; ?>'
        </script>
    @endif

Answer 1

在表达式中添加单引号，否则我建议您更好地使用Laravel刀片语法提供的插值{{}}。

<script type="text/ecmascript-6">
            window.Laravel = {{ json_encode(['csrf_token' => csrf_token()]) }};
</script>

@if(!auth()->guest())
        <script type="text/ecmascript-6">
            window.Laravel.userId = {{ auth()->user()->id }};
        </script>
@endif

#Update：

<script type="text/ecmascript-6">
        window.Laravel = '<?php echo json_encode([
                'csrfToken' => csrf_token(),
        ]); ?>'
</script>

您上面的代码在window.Laravel中有一个字符串（JSON字符串），而不是JSON对象。您可以另外执行JSON.parse()使其成为JSON对象，如下所示。

<script type="text/ecmascript">
        window.Laravel = JSON.parse('<?php echo json_encode([
                'csrfToken' => csrf_token(),
        ]); ?>');
</script>

现在，您正在尝试获取登录的用户ID。

<script>
        window.Laravel.userId = '<?php echo auth()->user()->id; ?>'
</script>

上面的代码按原样工作，因为我们将window.Laravel的类型固定为JSON string到object。

但是最好是将其保留为整数/数字本身。

<script>
      window.Laravel.userId = <?php echo auth()->user()->id; ?>;
</script>

建议：

由于您使用的是Laravel框架，因此始终使用Laravel刀片语法比处理PHP标记要好。因此，它将更改您的代码段，如下所示：

<script type="text/ecmascript">
        window.Laravel = {!! json_encode(['csrfToken' => csrf_token()]) !!};
</script>

<script>
      window.Laravel.userId = {{ auth()->user()->id }};
</script>

注意使用{!! !!}代替{{ }}。这是因为当您使用常规插值时，Laravel会通过htmlspecialchars()传递字符串内容，从而自动转义字符串内容以防止XSS攻击。如果我们尝试打印任何用户提供的信息，则需要使用{{}}。在您的情况下，您正在生成一个csrf令牌并将令牌发送到客户端。因此，打印未转义的数据是安全的。

更多信息是here。

自Laravel 5.5起，我们可以直接使用@json刀片指令。

<script type="text/ecmascript">
        window.Laravel = @json([
                'csrfToken' => csrf_token()
        ]);
</script>

Answer 2

将您的陈述放在这样的引号中

window.Laravel.userId = "<?php echo auth()->user()->id; ?>"

我刚刚测试了它及其工作请尝试

Answer 3

您应在视图中使用blade syntax to display variables：

@if(!auth()->guest())
    <script type="text/ecmascript-6">
        window.Laravel.userId = {{ auth()->user()->id }};
    </script>
@endif

表达式期望window.Laravel.userId = <！-？PHPstorm中的PHP

（新更新）我的代码

代码的主要任务

我的@ vivek_23答复

3 个答案: