Outputting HTML

Sanitising HTML

You should always use the sanitise_html() function (which uses the Purifier library) before outputting the HTML, to prevent users injecting JavaScript or invalid HTML.

If you need to customise the allowed tags/attributes, publish the configuration:

scripts/artisan.sh vendor:publish --provider='Mews\Purifier\PurifierServiceProvider'

Then edit config/purifier.php - specifically, the settings.default section.

You can also use the Purifier library directly if you need more control.

Blade

It is recommended to sanitise the HTML in the view:

{{ sanitise_html($example->content_html) }}

Note: It returns an instance of HtmlString, so you do not need to use {!! ... !!} tags.

Nexus

It is recommended to sanitise the HTML in the controller:

return Inertia::render('Examples/PageShow', [
    'example' => data($example, [
        'content_html' => fn($html) => sanitise_html($html),
    ]),
]);

And either output it directly using v-html:

<template>
    <div v-html="example.content_html" />
</template>

Or use the <FormatHtml> component:

FormatHtml

<script>
    import FormatHtml from '@alberon/nexus-wysiwyg/vue/FormatHtml';

    export default {
        components: {
            // ...
            FormatHtml,
            // ...
        },
    }
</script>

<template>
    <FormatHtml :value="example.content_html" />
</template>

This outputs a "—" if the field is empty (or only contains empty tags such as <p></p>), like many of the other Nexus <Format***> components.

To remove the bottom margin from the last element, add the prop remove-bottom-margin. This ensures it is flush against the bottom edge.

<template>
    <CardSimple title="Example">
        <FormatHtml remove-bottom-margin :value="example.content_html" />
    </CardSimple>
</template>