Spotify OAuth + Web Playback SDK 통합 — 3-tier 재생 엔진 (Premium SDK / iTunes preview / YouTube) — POP-SPOT v2.21 S10~S18

// v2.21 S10 — SpotifyAuth.java (신규 엔티티)
@Entity
public class SpotifyAuth {
  @Id @GeneratedValue
  private Long id;

  @Column(nullable = false, unique = true)
  private Long userId;

  @Column(nullable = false, length = 512)
  private String accessTokenEncrypted;  // AES-256-GCM 암호화됨

  @Column(nullable = false, length = 512)
  private String refreshTokenEncrypted;

  @Column(nullable = false)
  private LocalDateTime expiresAt;

  @Column(length = 32)
  private String product;  // "premium" / "free"
}

// v2.21 S10 — TokenEncryption.java (신규). AES-256-GCM 암·복호화
@Service
public class TokenEncryption {
  private final SecretKey key;
  private static final int IV_LENGTH = 12;
  private static final int TAG_LENGTH = 128;

  public TokenEncryption(@Value("${TOKEN_ENCRYPTION_KEY}") String base64Key) {
    byte[] keyBytes = Base64.getDecoder().decode(base64Key);
    if (keyBytes.length != 32) {
      throw new IllegalStateException("TOKEN_ENCRYPTION_KEY 는 32 바이트");
    }
    this.key = new SecretKeySpec(keyBytes, "AES");
  }

  public String encrypt(String plaintext) {
    byte[] iv = new byte[IV_LENGTH];
    secureRandom.nextBytes(iv);

    Cipher cipher = Cipher.getInstance("AES/GCM/NoPadding");
    cipher.init(Cipher.ENCRYPT_MODE, key, new GCMParameterSpec(TAG_LENGTH, iv));
    byte[] cipherText = cipher.doFinal(plaintext.getBytes(UTF_8));

    ByteBuffer buf = ByteBuffer.allocate(IV_LENGTH + cipherText.length);
    buf.put(iv).put(cipherText);
    return Base64.getUrlEncoder().withoutPadding().encodeToString(buf.array());
  }
}

// v2.21 S10 — SpotifyAuthController.initiateLogin()
@GetMapping("/login")
public ResponseEntity<Void> initiateLogin(Authentication auth) {
  String state = oauthStateService.issueState();
  String url = UriComponentsBuilder
      .fromHttpUrl("https://accounts.spotify.com/authorize")
      .queryParam("client_id", clientId)
      .queryParam("response_type", "code")
      .queryParam("redirect_uri", redirectUri)
      .queryParam("scope", "streaming user-read-email user-read-private")
      .queryParam("state", state)
      .build().toUriString();
  return ResponseEntity.status(302).location(URI.create(url)).build();
}

@GetMapping("/callback")
public ResponseEntity<Void> handleCallback(
    @RequestParam String code,
    @RequestParam String state,
    Authentication auth) {
  if (!oauthStateService.consumeState(state)) {
    throw new BadRequestException("유효하지 않은 state");
  }
  TokenResponse tokens = spotifyClient.exchangeCode(code);
  Long userId = Long.parseLong(auth.getName());
  spotifyAuthService.saveTokens(userId, tokens);

  return ResponseEntity.status(302)
      .location(URI.create("/?tab=MUSIC&spotify=connected"))
      .build();
}

// v2.21 S11 — SpotifyAuthMe 의 잘못된 @AuthenticationPrincipal 타입 (UserDetails)
@GetMapping("/me")
public SpotifyAuthMe me(@AuthenticationPrincipal UserDetails user) {
//                      ^^^^^^^^^^^^^^^^^^^^^^^^                    SecurityConfig 가 String 의 주입 → 불일치 → null → NPE → 401
  Long userId = Long.parseLong(user.getUsername());
  // ...
}

// v2.21 S11.1 — 다른 엔드포인트와 동일한 Authentication 패턴으로 교체
@GetMapping("/me")
public SpotifyAuthMe me(Authentication auth) {
  Long userId = Long.parseLong(auth.getName());
  // ...
}

// v2.21 S12 — useSpotifyPlayer.ts (신규). Spotify Web Playback SDK 래퍼
export function useSpotifyPlayer() {
  const [player, setPlayer] = useState<Spotify.Player | null>(null);

  useEffect(() => {
    window.onSpotifyWebPlaybackSDKReady = () => {
      const p = new window.Spotify.Player({
        name: 'POP-SPOT Player',
        getOAuthToken: async (cb) => {
          const token = await fetchAccessToken();  // 백엔드에서 육입·갱신
          cb(token);
        },
        volume: 0.8,
      });
      p.connect();
      setPlayer(p);
    };

    const script = document.createElement('script');
    script.src = 'https://sdk.scdn.co/spotify-player.js';
    script.async = true;
    document.body.appendChild(script);
  }, []);

  return player;
}

// v2.21 S13 — usePreviewPlayer.ts (신규). HTML5 audio 래퍼
export function usePreviewPlayer() {
  const audioRef = useRef<HTMLAudioElement | null>(null);

  useEffect(() => {
    audioRef.current = new Audio();
  }, []);

  const play = async (url: string) => {
    if (!audioRef.current) return;
    audioRef.current.src = url;
    try {
      await audioRef.current.play();
    } catch (e) {
      // 자동재생 차단 — 다음 클릭 시 재시도
      console.warn('autoplay blocked');
    }
  };

  return { play };
}

// v2.21 S14 — MusicPlayerProvider.tsx. 3-tier 라우팅
export function MusicPlayerProvider({ children }) {
  const spotifyPlayer = useSpotifyPlayer();
  const previewPlayer = usePreviewPlayer();
  const youtubePlayer = useYouTubePlayer();

  async function play(track: Track) {
    const isPremium = await checkPremium();

    // tier 1: Spotify SDK (풀트랙)
    if (isPremium && spotifyPlayer && track.spotifyTrackId) {
      await spotifyPlayer.resume({ uri: `spotify:track:${track.spotifyTrackId}` });
      return;
    }
    // tier 2: iTunes preview (90 초)
    if (track.itunesPreviewUrl) {
      await previewPlayer.play(track.itunesPreviewUrl);
      return;
    }
    // tier 3: YouTube (폴백)
    if (track.youtubeVideoId) {
      await youtubePlayer.play(track.youtubeVideoId);
      return;
    }
    // 아무것도 안 되면
    onError({ message: '재생 소스 없음' });
  }

  return <Context.Provider value={{ play }}>{children}</Context.Provider>;
}

// v2.21 S13 까지 — 올바른 Spotify 필드는 spotifyTrackId. 이 코드는 itunesTrackId 를 쓰니 대부분 null → tier 3 으로 떨어짐
if (isPremium && spotifyPlayer && track.itunesTrackId) {  // 필드 이름 잘못!

// v2.21 S13.1 — spotifyTrackId 로 수정
if (isPremium && spotifyPlayer && track.spotifyTrackId) {

// v2.21 S15 — ITunesPreviewService.java (신규). Spotify preview_url 중단 대체
@Service
public class ITunesPreviewService {
  private final RestTemplate restTemplate;

  public Optional<String> findPreviewUrl(String artist, String title) {
    String url = UriComponentsBuilder
        .fromHttpUrl("https://itunes.apple.com/search")
        .queryParam("term", artist + " " + title)
        .queryParam("entity", "song")
        .queryParam("limit", 5)
        .queryParam("country", "KR")
        .build().toUriString();

    ITunesResponse response = restTemplate.getForObject(url, ITunesResponse.class);
    if (response == null || response.results().isEmpty()) {
      return Optional.empty();
    }
    return response.results().stream()
        .filter(r -> matchesArtist(r.artistName(), artist))
        .findFirst()
        .map(ITunesResponse.Result::previewUrl);
  }
}

// v2.21 S17 — 이벤트 없이도 500ms 폴링으로 진행바 갱신
useEffect(() => {
  const interval = setInterval(async () => {
    if (!spotifyPlayer) return;
    const state = await spotifyPlayer.getCurrentState();
    if (state && !state.paused) {
      setPosition(state.position);
      setDuration(state.duration);
    }
  }, 500);
  return () => clearInterval(interval);
}, [spotifyPlayer]);