YT Music: webbläsar-headers som primär koppling (TV-OAuth ger HTTP 400 hos youtubei)

Alla autentiserade ytmusicapi-anrop med TV-OAuth-token får 400 'invalid
argument' — känd Google-begränsning. Ny väg: klistra in request-headers
från inloggad music.youtube.com i settings → POST /api/ytmusic/headers
bygger ytmusicapi-kompatibel browser.json i Youtubarrs datamapp.
Youtubarr-forken föredrar browser.json framför oauth.json. Testern
rapporterar header-kopplingen. 2 nya tester, totalt 33.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01824ZrvG2mDYYrmwqypLNup

frontend/src/pages/SettingsPage.vue

@@ -113,6 +113,32 @@ async function pickUser() {
   await saveAndTest('jellyfin')
 }
 
+const rawHeaders = ref('')
+
+async function saveHeaders() {
+  busy.value = { ...busy.value, ytmusic: true }
+  try {
+    const res = await fetch('/api/ytmusic/headers', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ raw: rawHeaders.value }),
+    })
+    const body = await res.json()
+    results.value = {
+      ...results.value,
+      ytmusic: res.ok
+        ? { ok: true, message: 'headers sparade ✓ — kopplingen är aktiv' }
+        : { ok: false, message: body.error },
+    }
+    if (res.ok) {
+      rawHeaders.value = ''
+      saved.value = await (await fetch('/api/settings')).json()
+    }
+  } finally {
+    busy.value = { ...busy.value, ytmusic: false }
+  }
+}
+
 async function connectYtMusic() {
   busy.value = { ...busy.value, ytmusic: true }
   results.value = { ...results.value, ytmusic: null }
@@ -274,6 +300,20 @@ async function connectYtMusic() {
         OAuth-klient av typen "TVs and Limited Input devices" i Google Cloud
         Console (projektet youtubarr → Credentials).
       </p>
+      <details class="sub" open>
+        <summary>Webbläsar-headers <span class="dim">— rekommenderas (TV-OAuth ger ofta fel hos Google)</span></summary>
+        <div class="subbody">
+          <p class="dim">
+            1. Öppna <a href="https://music.youtube.com" target="_blank" rel="noopener">music.youtube.com</a> inloggad →
+            F12 → fliken <strong>Nätverk</strong> → filtrera på <code>browse</code> → klicka ett anrop →
+            högerklicka under <em>Request Headers</em> → <strong>kopiera alla request-headers</strong> och klistra in här:
+          </p>
+          <textarea v-model="rawHeaders" rows="5" placeholder="POST /youtubei/v1/browse…&#10;Cookie: …&#10;User-Agent: …"></textarea>
+          <div class="row">
+            <button :disabled="busy.ytmusic || !rawHeaders.trim()" @click="saveHeaders">Spara headers</button>
+          </div>
+        </div>
+      </details>
       <label>Client ID
         <input v-model="ytmusic.clientId" type="text" :placeholder="saved.ytmusic.clientIdSet ? '(sparad — fyll i för att byta)' : '….apps.googleusercontent.com'" />
       </label>
@@ -460,4 +500,16 @@ legend {
 .check input {
   width: auto;
 }
+
+textarea {
+  font: inherit;
+  font-size: 0.8rem;
+  color: var(--text);
+  background: rgba(255, 255, 255, 0.08);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 0.5rem;
+  padding: 0.5rem 0.7rem;
+  resize: vertical;
+  width: 100%;
+}
 </style>