Kamil Owczarek
Published on

Fixing YouTube Error 153: The GDPR-Compliant Way

Authors

The Error Nobody Understands

Users started reporting that embedded YouTube videos wouldn't play on some of our product pages. The console showed a cryptic error:

YouTube Error 153: The video is not available

The frustrating part? The same videos played fine on YouTube directly. Only when embedded on our site did they fail—and not consistently. Some browsers worked, others didn't. Some users saw the error, others didn't.

What Error 153 Actually Means

After digging through YouTube's developer documentation (what little exists), I found that Error 153 typically indicates:

  1. Embedding restrictions: The video owner may have disabled embedding
  2. Privacy mode conflicts: Browser privacy features blocking YouTube tracking
  3. Referrer policy issues: YouTube rejecting the embed based on referrer
  4. Cookie consent problems: GDPR-related cookie blocking interfering with playback

In our case, it was a combination of #2, #3, and #4. Users with stricter privacy settings or those who hadn't accepted cookies were getting blocked.

The Solution: youtube-nocookie.com

YouTube provides an alternative embed domain specifically for privacy-conscious implementations: youtube-nocookie.com. This domain doesn't set tracking cookies until the user actually plays the video.

Before: The Problematic Embed

<iframe
  src="https://www.youtube.com/embed/VIDEO_ID"
  title="YouTube video player"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
  allowfullscreen
/>

After: The Fixed Embed

<iframe
  src="https://www.youtube-nocookie.com/embed/VIDEO_ID?rel=0&modestbranding=1"
  title="YouTube video player"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  allowfullscreen
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
/>

Let me break down each change:

The Changes Explained

1. Switch to youtube-nocookie.com

- src="https://www.youtube.com/embed/VIDEO_ID"
+ src="https://www.youtube-nocookie.com/embed/VIDEO_ID"

This is the key change. The -nocookie domain:

  • Doesn't set tracking cookies until playback starts
  • Works better with GDPR cookie consent flows
  • Bypasses some privacy extension blocks
  • Same video quality and features as regular YouTube

2. Add Clean UI Parameters

+ ?rel=0&modestbranding=1
  • rel=0: Don't show related videos from other channels at the end
  • modestbranding=1: Minimal YouTube branding (cleaner look)

3. Remove Deprecated Attributes

- frameborder="0"

The frameborder attribute is deprecated in HTML5. Use CSS instead:

iframe {
  border: none;
}

4. Add Lazy Loading

+ loading="lazy"

This is a huge performance win. The iframe won't load until it's near the viewport, saving bandwidth and improving initial page load times. Especially important on pages with multiple videos.

5. Add Referrer Policy

+ referrerpolicy="strict-origin-when-cross-origin"

This tells the browser to send a limited referrer header, which:

  • Improves privacy for your users
  • Reduces potential embed rejections
  • Follows modern web security practices

6. Update Allow Permissions

- allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+ allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"

Added web-share to enable the share button in fullscreen mode.

Handling Autoplay Videos

For videos that should autoplay (like background/hero videos), you need extra parameters:

<iframe
  src="https://www.youtube-nocookie.com/embed/VIDEO_ID?autoplay=1&mute=1&loop=1&playlist=VIDEO_ID&rel=0&modestbranding=1"
  title="YouTube video player"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  allowfullscreen
  loading="lazy"
  referrerpolicy="strict-origin-when-cross-origin"
/>

Key additions for autoplay:

  • autoplay=1: Start playing immediately
  • mute=1: Required for autoplay to work (browser policy)
  • loop=1: Restart when finished
  • playlist=VIDEO_ID: Required for loop to work (yes, you repeat the ID)

Creating a Reusable Component

For Vue/Nuxt projects, create a reusable component:

<!-- components/YoutubeVideo.vue -->
<template>
  <iframe
    :src="embedUrl"
    title="YouTube video player"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
    referrerpolicy="strict-origin-when-cross-origin"
    allowfullscreen
    loading="lazy"
    class="aspect-video w-full"
  />
</template>

<script setup lang="ts">
const props = defineProps<{
  videoId: string
  autoplay?: boolean
}>()

const embedUrl = computed(() => {
  const base = `https://www.youtube-nocookie.com/embed/${props.videoId}`
  const params = new URLSearchParams({
    rel: '0',
    modestbranding: '1',
  })

  if (props.autoplay) {
    params.set('autoplay', '1')
    params.set('mute', '1')
    params.set('loop', '1')
    params.set('playlist', props.videoId)
  }

  return `${base}?${params.toString()}`
})
</script>

Usage:

<!-- Regular video -->
<YoutubeVideo video-id="dQw4w9WgXcQ" />

<!-- Autoplay video -->
<YoutubeVideo video-id="dQw4w9WgXcQ" autoplay />

The Results

After deploying these changes across 9 embedded videos:

  • Error 153 reports dropped to zero
  • Page load times improved (lazy loading)
  • GDPR compliance improved (no cookies until play)
  • Cleaner video UI (no random related videos)
  • Better privacy (limited referrer headers)

Quick Checklist

When embedding YouTube videos in 2024+, make sure you:

  • Use youtube-nocookie.com instead of youtube.com
  • Add loading="lazy" for performance
  • Add referrerpolicy="strict-origin-when-cross-origin"
  • Remove deprecated frameborder attribute
  • Include rel=0 to hide unrelated video suggestions
  • For autoplay: include mute=1 and playlist=VIDEO_ID for loop

Common Mistakes to Avoid

1. Forgetting playlist param for loops

// Won't loop
src = '...?autoplay=1&mute=1&loop=1'

// Will loop
src = '...?autoplay=1&mute=1&loop=1&playlist=VIDEO_ID'

2. Expecting autoplay with sound

Browsers block autoplay with audio. Always include mute=1 for autoplay videos.

3. Using the wrong allow permissions

Make sure autoplay is in the allow attribute if you want autoplay to work:

allow="autoplay; ..."

Beyond Error 153

Even if you're not seeing Error 153, consider migrating to youtube-nocookie.com anyway. It's:

  • Better for GDPR compliance
  • More respectful of user privacy
  • Less likely to be blocked by privacy extensions
  • The same video quality and features

The migration is straightforward—just find/replace the domain and add the recommended attributes.

Real fix from an e-commerce site serving European markets, where GDPR compliance matters.

Discuss on Twitter • View on GitHub