How to get Express route's body parameters as 'string' instead of 'any' in Typescript? - node.js

Question

I'm sending a string productId using a hidden input type through a <form>:
<form action="/cart" method="POST">
<button class="btn" type="submit">Add to Cart</button>
<input type="hidden" name="productId" value="<%= product.id %> "> // EJS template engine
</form>
And then receiving the productId in an Express route as follows:
export const postCart = async (request: Request, response: Response): Promise<void> => {
const productId = request.body.productId // This is inferred as type 'any'
const allProducts = //...Array<Product>
const requestedProduct = allProducts.find((product) => product.id === productId) // Problem: this is always false
}
Problem
The condition product.id === productId is always false because the type of product.id from the database is string and type of productId received from the body is any. I need a way for both of them to be of same type.
What I tried so far
I tried annotating and casting the type of productId:
const productId: string = request.body.productId // Doesn't work
const productId: string = request.body.productId as string // Doesn't work
const productId: string = request.body.productId + '' // Doesn't work
The only thing that works is, if I create the Numbers from the ids:
Number(product.id) === Number(productId)
But this can't be a solution because I'm using UUID strings for representing the product id. And casting UUIDs to the numbers may not be a good idea.
Any input would be much appreciated.

Answer 1

So we chatted out in the comment section but the problem seems to have been the trailing space in the html:
<input type="hidden" name="productId" value="<%= product.id %> ">
updated to:
<input type="hidden" name="productId" value="<%= product.id %>">