Enabling both preload and integrity hashes causes double asset download

[massimilianobraglia]

As you can see in the screenshots below, having both preload and integrity enabled causes issues like double asset download. This seems to be caused by the tag renderer that does not sets the link header with the integrities.

[m-vo]

I'm facing the same issue. IMHO it's web-link, that must also set integrity="<hash>" on the headers.

At least when doing so, the problem disappears. :smile:

It feels these two bundles should not rely too heavily on each other. But they probably would need to a bit if this the right way to fix the issue. Maybe @weaverryan can shed some light on this, then I'll have a go with a PR?

[alexander-schranz]

I did also stumble over this issue. I did currently workaround the following way:

webpack_encore:
    preload: false

        {% set assetCss = asset('build/website/app.css') %}
        {% do preload(assetCss, { as: 'style', integrity: app_integrity('website', assetCss) }) %}

        {{ encore_entry_link_tags('app', null, 'website') }}

<?php

namespace App\Twig;

use Symfony\WebpackEncoreBundle\Asset\EntrypointLookupCollectionInterface;
use Twig\Extension\AbstractExtension;
use Twig\TwigFunction;

class IntegrityExtension extends AbstractExtension
{
    /**
     * @var EntrypointLookupCollectionInterface
     */
    private $entrypointLookupCollection;

    public function __construct(
        EntrypointLookupCollectionInterface $entrypointLookupCollection
    ) {
        $this->entrypointLookupCollection = $entrypointLookupCollection;
    }

    public function getFunctions(): array
    {
        return [
            new TwigFunction(
                'app_integrity',
                [$this, 'getIntegrity'],
                [
                    'is_safe' => ['html'],
                ]
            ),
        ];
    }

    public function getIntegrity(string $buildname, string $path): string
    {
        $integrityList = $this->entrypointLookupCollection->getEntrypointLookup($buildname)->getIntegrityData();

        return $integrityList[$path];
    }
}

[oleg-andreyev]

Faced same issue today. Initially wanted to do it manually <link type="preload" but then found that after using encore_entry_css_files or encore_entry_js_files, encore_entry_script_tags and encore_entry_link_tags will not return any results. Then found encore supports preload out-of-the-box but faced current issue.

[joanfabregat]

According to this comment on Stackoverflow, both the integrity and crossorigin parameters are required on both the Link header and on the <link> tags.

Using Symfony 6.3.2 and Encore 1.17.1 both the parameters are present on the <link> tags:

However only the crossorigin parameter is specified on the Link header:

My current Encore config is:

webpack_encore:
    crossorigin: 'anonymous'
    preload: true

[hracik]

Having the same issue now with newer symfony/webpack-encore-bundle 2.1.1 and symfony 5.4.