TMDB API 串接筆記

內容目錄 隱藏

1 API v3 v4 到底用哪一個？

2 React Native 權限驗證流程

3 account_id

4 TMDB API 已知的 bug

4.1 相關文章

一些關於TMDB API的內容紀錄。

API v3 v4 到底用哪一個？

直接先說結論：如果沒有需要用lists功能的話，就不要用v4，因為v4目前完整的只有 lists 功能。

如果要用lists的話，就得v3 v4混合用了。

React Native 權限驗證流程

一、先取得 request_token，post body 指定重定向 URL

const getRequestToken = async () => {
  try {
    const data = await request<
      GetRequestTokenResponse,
      GetRequestTokenBody
    >('post', API_ROUTE.requestToken, {
      data: { redirect_to: 'myapp://' },
    })
    if (data.success) {
      updateRequestToken(data.request_token)
      return data.request_token
    }
    return null
  } catch (error) {
    return null
  }
}

關於 deep links 可以參考 expo docs Overview of Linking, Deep Links, Android App Links, and iOS Universal Links 以及 Linking into your app

二、跳轉至TMDB登入 https://www.themoviedb.org/auth/access?request_token={request_token} 後重定向回APP

useEffect(() => {
  const handleUrl = async (url: string) => {
    // 重定向後請求 access token
  }

  Linking.addEventListener('url', (event) => handleUrl(event.url))

  return () => {
    Linking.removeAllListeners('url')
  }
}, [requestToken])

const onLogin = async () => {
  const request_token = await getRequestToken()
  if (!request_token) return
  Linking.openURL(
    `https://www.themoviedb.org/auth/access?request_token=${request_token}`,
  )
}

三、使用 request_token 獲取 access_token

useEffect(() => {
  const handleUrl = async (url: string) => {
    await createAccessToken(requestToken)
  }

  Linking.addEventListener('url', (event) => handleUrl(event.url))

  return () => {
    Linking.removeAllListeners('url')
  }
}, [requestToken])

const createAccessToken = async (request_token: string) => {
  try {
    const data = await request<
      CreateAccessTokenResponse,
      CreateAccessTokenRequest
    >('post', API_ROUTE.accessToken, { data: { request_token } })
    if (data.success) {
      updateAccessToken(data.access_token)
    }
  } catch (error) {
    console.error(error)
  }
}

四、用 access_token 獲取 v3 的 session_id

const createAccessToken = async (request_token: string) => {
  try {
    const data = await request<
      CreateAccessTokenResponse,
      CreateAccessTokenRequest
    >('post', API_ROUTE.accessToken, { data: { request_token } })
    if (data.success) {
      updateAccessToken(data.access_token)
      await createSession(data.access_token)
    }
  } catch (error) {
    console.error(error)
  }
}

const createSession = async (access_token: string) => {
  try {
    const data = await request<
      CreateSessionResponse,
      CreateSessionRequest
    >('post', API_ROUTE.createSession, { data: { access_token } })
    if (data.success) {
      updateSessionId(data.session_id)
    }
  } catch (error) {
    console.error(error)
  }
}

account_id

v3 account API 其實可以選擇只傳 account_id 或者 session_id 其中一種，這兩種方式拿到的資料都是一樣的。

https://api.themoviedb.org/3/account/account_id/favorite/movies
- params: session_id
https://api.themoviedb.org/3/account/{account_id}/favorite/movies

順帶一提，docs 裡面 account_id 型別寫的是int32，但其實傳 string 也可以，別被這混肴了。