String Parsing with Kotlinx Serialization

During my 100 Days of Code challenge, I encountered a problem. The Image URL I get from the API is in a format that is suitable for display on the web, but not for mobile. This link looks like this:

https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F399977%2Fbd1632ed-3018-495f-855c-a60048e6d099.png

As a result, images don't display on the UI.  The simplest way is to remove all parts before the second hppt appears. I did this before setting up the image on the UI. 

This solution isn't ideal because I fixed the wrong response on the UI side. I can't fix this on the backend side, so I should isolate the problem at the API level. However, I can do this during the mapping of the API model to the domain, but I have one additional mapping level before that:  JSON serialization(I use kotlinx.serialization for this). I think this is the right place to fix this kind of problem. 

I wrote a custom string serializer to deal with this problem.  It is pretty simple; it just removes all parts before the image URL.

object ImageSerializer : KSerializer<String> {
    override val descriptor: SerialDescriptor =
        String.serializer().descriptor

    override fun deserialize(decoder: Decoder): String {
        return decoder.decodeString().cleanUpImageUrl()
    }

    override fun serialize(encoder: Encoder, value: String) {
        encoder.encodeString(value)
    }
}

private fun String.cleanUpImageUrl(): String {
    val firstIndex = this.indexOf("http")
    if (firstIndex != -1) {
        val secondIndex = this.indexOf("http", firstIndex + 1)
        if (secondIndex != -1) {
            return this.substring(secondIndex).decodeURLPart()
        }
    }
    return this.decodeURLPart()
}

Now we have only one question: where should we apply this serializer? Applying it to any string that comes from JSON seems excessive. We should apply it only to fields that are likely to have incorrect formatting. In my case, this field is usually named profile_image_90. So, I applied it only to this field by using the Serializable annotation.

@Serializable(ImageSerializer::class)
@SerialName("profile_image_90")
val profileImage90: String? = null,

That's all. Now I have the correctly formatted URL for the entire application. 

You can find out more about my challenge and how it's going on this page.

I’d be happy to receive your feedback on this article. Feel free to write your comments here, share it with friends, or simply like it. I enjoy sharing my knowledge; you can find more useful content on my LinkedIn page, on X, in Medium or Mastodon.

See you in the next post, and happy coding!