CODEWITHSUNDEEP
javascriptamp-html
wojtusKurde
wojtusKurde

Reputation: 23

amp-script Script hash not found. amp-script[script="hello-world"]

I'm trying to use an amp-script but I get this error:

"[amp-script] Script hash not found. amp-script[script="hello-world"].js must have "sha384-BdjJFLYaZaVK-HgidJ2OFtpYsczYQc4N42NgKo7MOkF88iPbpdDWPgf86Y6PyEKO" in meta[name="amp-script-src"]. See https://amp.dev/documentation/components/amp-script/#security-features."

error image

<!doctype html>
<html amp lang="en">
<head>
    <meta charset="utf-8">
    <meta class="trackPerformanceTag" content="AMP">
    <script src="https://cdn.ampproject.org/v0.js" async></script>
    <script async custom-element="amp-script" src="https://cdn.ampproject.org/v0/amp-script-0.1.js"></script>
    <meta name="amp-script-src" content="sha384-generated-sha">
    <title>title</title>
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">

</head>
<body>

    <amp-script layout="container" script="hello-world" class="amp-script-sample">
        <button id="hello2">Click!</button>
    </amp-script>

    <script id="hello-world" type="text/plain" target="amp-script">
        const button = document.getElementById('hello2');
        button.addEventListener('click', () => {
            const h1 = document.createElement('h1');
            h1.textContent = 'Hello World 2!';
            document.body.appendChild(h1);
        });
    </script>

</body>
</html>

Upvotes: 2

Views: 3061

Answers (1)

Piotr Grzywa
Piotr Grzywa

Reputation: 56

You need to copy full hash shown in the error message in dev tools console.

In this case;

sha384-BdjJFLYaZaVK-HgidJ2OFtpYsczYQc4N42NgKo7MOkF88iPbpdDWPgf86Y6PyEKO

and paste it to meta in the header:

<meta name="amp-script-src" content="PUT_THE_SHA_HERE">

Every time you will change something in the script new hash will be generated and you need copy/paste it again.

See the screen with error form the dev tools console

Upvotes: 4

Related Questions