> 웹 프론트엔드 > JS 튜토리얼 > Hardcover&#s Book API의 재미: 빠른 참조

Hardcover&#s Book API의 재미: 빠른 참조

Mary-Kate Olsen
풀어 주다: 2024-10-26 18:41:30
원래의
891명이 탐색했습니다.

나는 오랫동안 Goodreads를 사용하고 있지만 내 책을 추적할 때 항상 더 나은 방법을 시도하고 싶었습니다. 그래서 최근에는 소규모 인디팀이 운영하는 경쟁사인 하드커버를 사용하기 시작했습니다. 아직 초기 단계이고 Goodreads만큼 큰 회사를 이기기는 어렵다는 것을 알고 있지만 희망적입니다!

Hardcover의 가장 큰 장점 중 하나는 Goodreads와 달리 무료로 사용할 수 있고 Hardcover에 저장된 도서의 모든 데이터를 쿼리할 수 있는 API가 있다는 것입니다. 또한 책의 상태를 업데이트하는 등 기본적으로 양장본 UI에서 직접 수행할 수 있는 모든 작업을 수행하는 데에도 사용할 수 있습니다.
독서, 목록에 책 추가 등 다양한 기능을 제공합니다.

Hardcover의 API를 사용하는 방법

지금은 API를 사용하여 내 사이트의 서평 섹션을 생성하고 있습니다. 모든 리뷰를 양장본에서 가져와서 JSON 파일에 저장하고 있습니다. 그런 다음 이 목록의 리뷰를 반복하여 페이지에 모두 렌더링합니다.

매우 짧은 리뷰를 어떻게 해야 할지 확신이 없었기 때문에 지금은 리뷰가 360자 미만인 경우 페이지에 있는 그대로 렌더링하고, 다음과 같은 경우 별도의 페이지로 링크하기로 결정했습니다. 그 이상입니다.

Fun with Hardcover

모든 리뷰를 검색할 수 있는 검색창도 추가했고, 리뷰에 스포일러가 있을 경우 텍스트를 흐리게 설정했습니다.

Fun with Hardcover

향후에는 별점은 물론 장르별로도 필터링할 수 있는 방법을 추가하고 싶습니다.

Hardcover API 시작하기

Hardcover의 API도 아직 초기 액세스 모드에 있으며 아직 적절한 문서가 없으므로 이 게시물에서는 지금까지 유용하다고 생각되는 쿼리 중 일부를 살펴보겠습니다. Hardcover의 Discord 서버는 질문에 대한 답변을 얻을 수 있는 좋은 장소이기도 합니다.

먼저 설정 페이지로 이동하여 Hardcover API 키를 받아야 합니다. 그런 다음 Hardcover의 GraphQL 콘솔에서 쿼리를 테스트할 수 있습니다.

읽은 책 모두 가져오기

기본 GraphQL 쿼리부터 시작하여 status_id를 사용하여 필터링하여 하드커버에서 "읽음"으로 표시한 모든 책의 제목 목록을 가져올 수 있습니다.

{
  me {
    user_books(where: {status_id: {_eq: 3}}) {
      rating
      book {
        title
      }
    }
  }
}
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

귀하의 사용자와 관련된 모든 항목을 쿼리하는 데 사용할 수 있는 정보를 제 안에 넣었습니다.

status_id 값이 작동하는 방식은 다음과 같습니다.

  • 1: '읽고 싶은' 책
  • 2: '지금 읽고 있는' 책
  • 3: '읽은' 책
  • 5: “A가 끝나지 않았습니다” 책

책의 저자 얻기

cached_contributors를 검색하면 책의 '기여자' 목록이 포함된 배열을 얻을 수 있습니다. 여기에는 기여자의 이름, ID, 이미지 등 미리 결정된 데이터 세트가 포함됩니다.

{
  me {
    user_books(where: {status_id: {_eq: 3}}) {
      rating
      book {
        title
      }
    }
  }
}
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

그들이 '저자'가 아닌 '기고자'인 이유는 책을 번역한 사람들의 이름도 포함될 수 있기 때문입니다. 작성자가 여러 명인 경우 해당 작성자도 모두 목록에 표시됩니다. 작가가 한 명인 일반 소설책에 대해 문의하는 경우 일반적으로 목록의 첫 번째 항목을 사용하는 것이 좋습니다.

캐시된 버전이 쿼리하는 것이 더 빠르지만, 원하는 특정 내용이 있는 경우 캐시되지 않은 기여에 대해 쿼리할 수도 있습니다.

book {
  cached_contributors
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

책의 하드커버 URL 가져오기

하드커버에 있는 책의 링크를 얻으려면 해당 슬러그를 쿼리하세요.

book {
  title
    contributions {
      author {
        name
       }
    }
 }
로그인 후 복사
로그인 후 복사
로그인 후 복사

슬러그는 웹사이트의 도메인 이름 뒤에 오는 문자열입니다. emgoto.com/hardcover-book-api에서 "hardcover-book-api" 비트는 슬러그입니다.

따라서 슬러그를 받은 후에는 https://hardcover.app/books/를 시작 부분에 추가하여 하드커버 URL을 생성하면 됩니다.

책에 장르 태그 가져오기

하드커버의 장르 태그 시스템은 사용자가 생성합니다. 캐시된_태그에 대해 쿼리하면 태그가 가장 많이 지정된 것부터 태그가 적은 것 순으로 태그를 반환합니다.

book {
  slug
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

전체 태그 목록이 있으면 캐시된_태그['Genre']를 사용하여 장르별 태그를 얻을 수 있습니다.

많은 사람들이 특정 책을 소설로 태그했다면 해당 책이 목록에 가장 먼저 나타나는 장르가 될 것입니다. 흥미롭게도 사람들은 자신의 책에 판타지라는 태그를 붙이는 것을 좋아하기 때문에 이 장르는 소설이라는 태그보다 먼저 나타나는 경우가 많습니다. 사람들은 자신의 책에 판타지라는 태그를 붙이는 것을 너무나 좋아해서 Dune과 같은 공상과학 책에는 공상과학 태그와 판타지 태그가 모두 붙기도 합니다.

이 데이터를 사용하려면 먼저 약간의 정리 작업을 수행하는 것이 좋습니다. 예를 들어 책의 장르 태그가 판타지와 공상과학을 모두 포함하는 경우 목록에서 첫 번째로 나오는 항목만 사용하고 다른 항목은 삭제하세요. 그게 더 정확할 가능성이 높기 때문입니다.

'읽을 책' 목록에 책 추가하기

지금까지는 데이터 가져오기만 다루었지만 Hardcover의 API를 사용하여 데이터를 조작할 수도 있습니다. 물론 다른 사람의 것을 건드릴 수는 없지만 자신의 Hardcover 계정에서 할 수 있는 모든 작업은 공정한 게임입니다. .

책 ID가 있는 경우 status_id를 1:로 설정하여 '읽을 책' 목록에 추가할 수 있습니다.

book {
  cached_tags
}
로그인 후 복사
로그인 후 복사

도서 리뷰 받기

이것은 제가 하드커버에 작성한 모든 리뷰를 가져오는 데 사용하는 것입니다.

{
  me {
    user_books(where: {status_id: {_eq: 3}}) {
      rating
      book {
        title
      }
    }
  }
}
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

내 책과 리뷰는 거의 모두 Goodreads에서 가져오는데, 가져오는 과정에서 데이터가 약간 뒤죽박죽되는 경우가 가끔 있는 것 같아요. dated_add와 review_at를 기준으로 정렬하는 것이 더 정확하다는 것을 알았습니다.

review_raw 값을 사용하여 줄 바꿈과 같은 형식이 포함되지 않은 리뷰 텍스트를 가져왔습니다. 이는 불행하게도 리뷰에 여러 단락이 있는 경우 API가 다음과 같이 모든 단락을 하나의 긴 단락으로 표시한다는 의미입니다.

book {
  cached_contributors
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

JavaScript를 사용하여 다음과 같은 정규식을 수행하여 이 문제를 해결했습니다.

book {
  title
    contributions {
      author {
        name
       }
    }
 }
로그인 후 복사
로그인 후 복사
로그인 후 복사

뒤에 공백이 없는 마침표가 있는 경우 이것이 새 단락이어야 한다고 추측하고 이중 줄바꿈 nn을 추가할 수 있습니다. 새 단락이 생성됩니다.

또 다른 단점은 스포일러 태그도 없어 수동으로 추가해야 한다는 점입니다.

review_html 값도 있는데, 이 값이 더 유용할 것 같았지만 안타깝게도 항상 null인 것 같습니다. 마찬가지로 스포일러가 포함된 리뷰의 경우 review_has_spoilers 값이 있는데 제가 Goodreads에서 수입한 책들은 모두 이 값이 false이므로 신뢰하지 못할 수도 있습니다.

제목 및/또는 저자로 책 검색

Hardcover의 도서 검색은 꽤 정확하지만 API에 이에 대한 1-1 버전이 없습니다. 검색 동작을 모방할 수 있는 방법은 많지만 가장 빠르게 시작하는 방법은 _eq:
를 사용하여 제목을 검색하는 것입니다.

book {
  slug
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

책 목록을 users_read_count로 주문했는데, 독자 수가 가장 많은 Dune이라는 책이 당신이 찾고 있는 Dune일 가능성이 높기 때문입니다.

제목 작성자로 필터링하려는 경우 필터 쿼리는 다음과 같습니다.

book {
  cached_tags
}
로그인 후 복사
로그인 후 복사

정확한 문자열 일치를 원하지 않는 경우 대신 _ilike 쿼리를 사용할 수 있습니다. 이 쿼리는 대소문자가 일치하지 않으므로 소문자를 사용해도 작동합니다.

mutation addBook {
  insert_user_book(object: {book_id: 123, status_id: 1}) {
    id
  }
}
로그인 후 복사

_ilike와 함께 % 문자를 와일드카드로 사용할 수도 있으므로 그렇게 할 수 있습니다

{
  me {
    user_books(
      where: { _and: [ 
        {has_review: {_eq: true}},
        {status_id: {_eq: 3 }}
      ]}
      order_by: [
        { date_added: desc },
        { reviewed_at: desc }
      ]
    ) {
      reviewed_at
      date_added
      review_raw
      rating
      book {
        title
      }
    }
  }
}
로그인 후 복사

“frank”라는 단어가 포함된 모든 저자와 일치합니다.

참고로, Hardcover는 Hasura를 사용하기 때문에 "Hasura에서 X를 수행하는 방법"을 검색하면 일반적으로 이러한 종류의 더 복잡한 쿼리를 수행할 수 있는 방법이 표시됩니다.

하드커버 목록에 책 가져오기

하드커버에는 표준 '읽고 싶은 항목' 및 '읽고 싶은 항목' 목록뿐 아니라 별도의 맞춤 목록 기능도 있습니다. 모든 목록과 그 안의 책을 가져오려면 다음을 수행하세요.

this is the end of one paragraph.And this is the start of the next
로그인 후 복사

목록에 책 추가하기

목록에 책을 추가하려면 먼저 목록 ID와 책 ID를 가져와야 합니다. 그러면 다음과 같이 쉽습니다.

{
  me {
    user_books(where: {status_id: {_eq: 3}}) {
      rating
      book {
        title
      }
    }
  }
}
로그인 후 복사
로그인 후 복사
로그인 후 복사
로그인 후 복사

JavaScript로 API 호출하기

GraphQL 콘솔에서 나가려면 fetch()를 사용하여 API 호출을 할 수 있습니다. 아주 간단한 예로, 모든 리뷰를 가져오는 방법은 다음과 같습니다(약간 축약했습니다).

book {
  cached_contributors
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

가져오기 호출을 더 쉽게 구성하기 위해 필요한 프로그래밍 전문가 팁은 다음과 같습니다.

  • 하드커버 보러가기
  • 네트워크 탭에서 graphql을 검색하세요
  • 유용해 보이고 정보를 반환하는 항목을 찾으세요
  • 네트워크 호출을 마우스 오른쪽 버튼으로 클릭하세요. > 복사 > 가져오기로 복사

위에 붙여넣은 것과 비슷한 가져오기 호출이 복사되어 사용자 고유의 코드에서 사용할 수 있습니다.

Fun with Hardcover

속도 제한에 대한 참고 사항

GraphQL 콘솔에서 나와 스크립트로 작업을 시작한 후 동시에 너무 많은 작업을 시도하면 오류나 속도 제한 문제가 발생할 수 있습니다.

예를 들어 목록에 새 책을 추가할 때 두 권의 책을 동시에 추가하려고 하면 API에서 오류가 발생하는 것을 발견했습니다. 아마도 두 권의 책을 목록의 동일한 위치에 추가하려고 하기 때문일 것입니다.

마찬가지로 제목을 기준으로 책을 검색하기 위해 100번의 호출을 시도하면 일부 호출은 시간이 초과됩니다. 다음과 같이 분산시키고 매초마다 하나씩 수행하면 아무런 문제가 없을 것입니다.

book {
  title
    contributions {
      author {
        name
       }
    }
 }
로그인 후 복사
로그인 후 복사
로그인 후 복사

또한 하드커버에서 책의 이미지 URL을 가져온 다음 페이지에 100권의 책 이미지를 동시에 로드하려고 시도하면 API가 속도를 제한하고 일부 이미지가 로드되지 않습니다. . 다음과 같이 이미지 태그에 loading=lazy를 넣는 것이 좋습니다.

book {
  slug
}
로그인 후 복사
로그인 후 복사
로그인 후 복사

이렇게 하면 사용자가 이미지를 보기 위해 아래로 스크롤할 때만 이미지가 로드됩니다.

그리고 그게 다입니다! 나는 양장본이 다음에 어디로 갈지 알고 싶습니다. 그것이 잘 되기를 바라며, 마침내 우리는 Goodreads-killer를 손에 넣었습니다. 제 하드커버를 팔로우하고 싶으시다면 제가 우연히 @emma 핸들을 잡았습니다.

위 내용은 Hardcover&#s Book API의 재미: 빠른 참조의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿