6

According to the Google Books API documentation each volume yields 6 different imageLinks (smallThumbnail, thumbnail, small, medium, large, extraLarge).

Unfortunately, for all the queries I've tried (and I've tried a lot) only smallThumbnail and thumbnail were returned. (Example query)

Also, apart from being fairly small those two images have this little fake dog-ears in the bottom right corner

Example thumbnail

Did they deprecate the high quality image links? Is there another way to fetch those images? Other APIs I tried are either deprecated (Goodreads) or less extensive (Open Library)

Androidicus
  • 1,688
  • 4
  • 24
  • 36

3 Answers3

3

I'm having the same issue. The search query only yields the smallThumbnail and thumbnail keys for the imageLinks. If you query the volume directly (like this), then you'll get all the options for the imageLinks.

This won't 100% solve your problem though. For some of the books, the small/medium/large links point to the first page of the book instead of the actual cover.

Meera
  • 31
  • 1
2

You might not be able to get high-resolution images all the time. Also, for some book results, you might not get any images at all.

I am working on a similar project and I had to manually check the resolution of each of the images I got in the response and I chose only the 'good' ones. Here's what I had to do:

        let newArr = [];
        let lowResImage = 0;
        let dataWithoutImage = 0;
        let highResImage = 0;
genreResults?.forEach((book, index) => {

        if (book?.volumeInfo?.imageLinks?.smallThumbnail) {//the current book has an image

            mypromise(book.volumeInfo.imageLinks.smallThumbnail).then((res) => {
                ++highResImage;
                newArr.push(book)
            }).catch(error => {
                ++lowResImage;
            }).finally(() => {
                if (dataWithoutImage + highResImage + lowResImage === genreResults.length) {
                    console.log("---------data populated----------");
                    console.log("highResolutionImages", highResImage);
                    console.log("low resolution images:", lowResImage);
                    console.log("booksWithoutImages", dataWithoutImage);
                    console.log("genreResults size", genreResults.length)
                    setBooks(newArr)
                }
            });

        }
        else //this book does not contain an image
            ++dataWithoutImage

    })

The function to check the resolution looks like this:

let mypromise = function checkImageResolution(url) {
    return new Promise((resolve, reject) => {
        var img = new Image();
        img.src = url;
        img.onload = function () {
            console.log("image dimensions", this.width, this.height);
            if (this.width < 125 || this.height < 100) //if either of these is true, reject the image
                reject("low quality image");
            else
                resolve("high quality ,let's have this one");
        }
    });
}
mnagdev
  • 384
  • 3
  • 11
0

Replace the following:

thumbnail=thumbnail.replaceAll("1","10");

But it works only for some books and for the remaining it will only load the first page of the book.

elcortegano
  • 2,444
  • 11
  • 40
  • 58
  • Welcome to Stack Overflow! Please take a moment to read through the [editing help](//stackoverflow.com/editing-help) in the [help]. Formatting on Stack Overflow is different than other sites. – Kevin M. Mansour Aug 24 '21 at 00:58