responsiveImage: base64 with ImgIx parameters?

🆘 Support
1

Hi, is the base64 object in a responsiveImage query meant to respect the ImgIx parameters? It doesn’t seem to be for me. I’ve also tried using the ImgIx parameters in the blurUpThumb and they don’t seem to be respecting the ImgIx parameters either.

Here’s my query:

query MyQuery {
  allProfiles {
    profileImage {
      responsiveImage{
        base64
      }
      responsiveImageDesat: responsiveImage(imgixParams: {sat: "-100"}) {
        base64
      }
      blurUpThumb(imgixParams: {sat: "-100"})
    }
  }
}

And here’s a sample response that shows all base64 images coming back as identical, where two should be desaturated. Am I doing something wrong?

    "profileImage": {
      "responsiveImage": {
        "base64": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLExUVDhgQDRgNDhIODQ0YLx8ZGCIfFiEmHysjHR0oIhwaJDUlKC0vMjIyHSU4PTcwPCsxMi8BCgsLBQUFEAUFEC8cFhwvLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vL//AABEIABgAGAMBIgACEQEDEQH/xAAZAAACAwEAAAAAAAAAAAAAAAAABQQGBwH/xAAeEAACAgICAwAAAAAAAAAAAAAAAgEDBBEFQRITMf/EABQBAQAAAAAAAAAAAAAAAAAAAAD/xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwDYr7IqqZpE9eejX632Subdlw58SnYNt05k739Av1VqskHRfjO3rjYASs+mLseYkR43Gqt+9dgADpKYVIAAA//Z"
      },
      "responsiveImageDesat": {
        "base64": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLExUVDhgQDRgNDhIODQ0YLx8ZGCIfFiEmHysjHR0oIhwaJDUlKC0vMjIyHSU4PTcwPCsxMi8BCgsLBQUFEAUFEC8cFhwvLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vL//AABEIABgAGAMBIgACEQEDEQH/xAAZAAACAwEAAAAAAAAAAAAAAAAABQQGBwH/xAAeEAACAgICAwAAAAAAAAAAAAAAAgEDBBEFQRITMf/EABQBAQAAAAAAAAAAAAAAAAAAAAD/xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwDYr7IqqZpE9eejX632Subdlw58SnYNt05k739Av1VqskHRfjO3rjYASs+mLseYkR43Gqt+9dgADpKYVIAAA//Z"
      },
      "blurUpThumb": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLExUVDhgQDRgNDhIODQ0YLx8ZGCIfFiEmHysjHR0oIhwaJDUlKC0vMjIyHSU4PTcwPCsxMi8BCgsLBQUFEAUFEC8cFhwvLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vLy8vL//AABEIABgAGAMBIgACEQEDEQH/xAAZAAACAwEAAAAAAAAAAAAAAAAABQQGBwH/xAAeEAACAgICAwAAAAAAAAAAAAAAAgEDBBEFQRITMf/EABQBAQAAAAAAAAAAAAAAAAAAAAD/xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwDYr7IqqZpE9eejX632Subdlw58SnYNt05k739Av1VqskHRfjO3rjYASs+mLseYkR43Gqt+9dgADpKYVIAAA//Z"
    }
}
2

hello @jaysmith we respect some parameters actually. Not all of them as we are creating the thumbnails ourselves.

If you need to use the saturation we can have a look if we can add that to our implementation. We’ll be in touch!

3

Thanks @mat_jack1

Is it possible to get a reference of what parameters are respected?

J

4

I would say most of those related to positioning:

immagine

5

Thanks @mat_jack1 - that’s really helpful.

1 Like
6

@jaysmith we just added support for the sat parameter on blurUpThumb. Thought you might be interested :slight_smile:

7

Thank you! That’s very ‘responsive’ :wink:

I’m not seeing the change yet though.

And does this change apply to the base64 item within responsiveImage as well? I.e. should both of these in the query below be the same?

query MyQuery {
 allProfiles {
    profileImage {
        blurUpThumb(imgixParams: {fit: crop, h: "263", w: "263", sat: "-100"})
        responsiveImage(imgixParams: {fit: crop, h: "263", w: "263", sat: "-100"}) {
             base64
        }
    }
  }
}
8

Actually, it looks like maybe it’s only working for positive values of ‘sat’?

I’m trying to desaturate using sat: -100. Should that be working?

9

Yes, it should work. I think you’re seeing a response that has been cached by the CDN before we deployed the new functionality… does it work if you slightly change your GraphQL query (ie. add a new field)? If you tell me your project name/ID I can forcefully purge all cached responses.

10

Nevermind, found it myself. I’ve purged the cache, let me know if now it’s working now :slight_smile:

11

Thanks Stefano!

I was trying to reply on here but the Community site was down. I logged a support ticket with the Project ID instead. Guess you can delete that ticket now.

And, yes, that’s fixed the issue. Thank you again.

Our new website goes live in two weeks so we’ll be able to show you what we’ve been working on!

1 Like