Query string sending only half URL to controller

I have a URL that I am trying to pass as a query string to the controller. But When I do that, I get only half URL. However, console.log prints the whole URL.

export async function sendNotification(PlanId: string, URL: string) {
    console.log("Service URL : - ", URL);
    let url = HttpClient.buildUrl(`api/smsNotification/${PlanId}?URL=${URL}`);
    return await HttpClient.get(url);
}

[HttpGet("Notification/{PlanId}")]
        [ValidateModelState]
        public async Task<IActionResult> SendNotification(Guid PlanId, string URL)
        {
                return NoContent();
        }
console log prints this URL

https://chats.landbot.io/v3/index.html?name=Sys+Admin&planid=a7f8&environment=dev&stack=dev

But at controller, I get this URL

https://chats.landbot.io/v3/index.html?name=Sys Admin

Answer

Query string parameters are separated by & symbol. As you can see, this is exactly where your URL is cut off. For the controller to get full URL, you need to encode it before passing as query parameter:

encodeURIComponent(url)

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent