How to conver URL to HREF for SVG Image

How can I convert an amazon presigned url to a correct href attribute value for the svg image?

For example, here I have a url:

https://s3.us-east-1.amazonaws.com/zed-content/Dialogue%20Items/a0A1r00002sLxg9EACLeft/testImg.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAJ7V4MJWO3GNAM6WA%2F20180710%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20180710T133927Z&X-Amz-Expires=604800&X-Amz-Signature=1044208e8a3fc4167fcd738637316d31a6b9a843063ec5658f8e7720c8963fb0&X-Amz-SignedHeaders=host

It url displays an image, but I do not know how to put the image situated behind the url as an svg image.

I am storing image using the .jpg extension. Now I would like to get the href for that image so that to display it using the image svg element.

In other words I want to have something like

<svg>
  <image href="IDoNotKnowWhatToPutInHere.jpg"/>
</svg>

Solution

You can do it like this. Change the width and height to your liking's.

.svg-main,
.svg-image {
  width: 200px;
  height: 200px;
}

<svg class="svg-main">
  <image class="svg-image" href="https://s3.us-east-1.amazonaws.com/zed-content/Dialogue%20Items/a0A1r00002sLxg9EACLeft/testImg.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAJ7V4MJWO3GNAM6WA%2F20180710%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20180710T133927Z&X-Amz-Expires=604800&X-Amz-Signature=1044208e8a3fc4167fcd738637316d31a6b9a843063ec5658f8e7720c8963fb0&X-Amz-SignedHeaders=host"/>
</svg>