Laravel Blade Component - UTF-8 Encoding issue-CodePudding

I'm currently working on an application with Laravel 8 version. I have build a component named input-group which cause encoding issues that i don't understand. The code of the component look like this :

<div class="form-group" {{ isset($attributes['style']) ? $attributes->merge(['style' => $attributes['style']]) : null }}>
    @if(isset($attributes['label']))
        <label for="{{ $attributes['id'] }}">{{ $attributes['label'] }}</label>
        <input type="text" 
               value="{{ isset($attributes['value']) ? $attributes['value'] : null }}" 
               class="form-control form-control-sm" 
               name="{{ $attributes['name'] }}" 
               id="{{ $attributes['id'] }}" 
               placeholder="{{ isset($attributes['placeholder']) ? $attributes['placeholder'] : null }}">
    @else 
        <input style="width:100%;" type="text" value="{{ isset($attributes['value']) ? $attributes['value'] : null }}" hljs-string">" name="{{ $attributes['name'] }}" id="{{ $attributes['id'] }}" placeholder="{{ isset($attributes['placeholder']) ? $attributes['placeholder'] : null }}">
    @endif
  </div>

Here is the data that I inject into the value attributes => Inspecteur de l'Education Nationale

And here is the output that i got in my <input> : Inspecteur de l'Education Nationale

I precise that my DB (using mySQL) have the Laravel default encoding utf8mb4_unicode_ci. The request that I use to get these datas is a classic Eloquent request (I don't manipulate the encoding)

The configuration of the mysql driver look like this :

        'mysql' => [
            'driver' => 'mysql',
            'url' => env('DATABASE_URL'),
            'host' => env('DB_HOST', '127.0.0.1'),
            'port' => env('DB_PORT', '3306'),
            'database' => env('DB_DATABASE', 'forge'),
            'username' => env('DB_USERNAME', 'forge'),
            'password' => env('DB_PASSWORD', ''),
            'unix_socket' => env('DB_SOCKET', ''),
            'charset' => 'utf8mb4',
            'collation' => 'utf8mb4_unicode_ci',
            'prefix' => '',
            'prefix_indexes' => true,
            'strict' => true,
            'engine' => null,
            'options' => extension_loaded('pdo_mysql') ? array_filter([
                PDO::MYSQL_ATTR_SSL_CA => env('MYSQL_ATTR_SSL_CA'),
            ]) : [],
        ],

CodePudding user response：

{!! !!} will work but I wouldn't use it here.

Especially if the value you're rendering has the potential to be set by a user as it's unescaped. It's a potential vulnerability and you leave yourself open to XSS attacks.

You can instead do:

{{ html_entity_decode($value) }}, you still get the benefit of blade helping prevent XSS attacks.

You can read more on the function here:https://www.php.net/manual/en/function.html-entity-decode.php.

CodePudding user response：

Use {!! !!} instead of {{ }}

I.e :

value="{!! isset($attributes['value']) ? $attributes['value'] : null !!}"

Displaying Unescaped Data

By default, Blade {{ }} statements are automatically sent through PHP's htmlspecialchars function to prevent XSS attacks.