# Image URL Links

**URL:** <https://community.weweb.io/t/image-url-links/1966>\
**Category:** Tips and Hacks\
**Created:** [March 4, 2023, 1:58am UTC](https://community.weweb.io/t/image-url-links/1966 "2023-03-04T01:58:33Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![felixtanhm](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/felixtanhm/32/1544_2.png) [@felixtanhm](https://community.weweb.io/u/felixtanhm)\
**Post date:** [March 4, 2023, 1:58am UTC](https://community.weweb.io/t/image-url-links/1966/1 "2023-03-04T01:58:33Z")

</div>

This is just a helpful tip to anyone who might be running into issues with image urls in WeWeb.

When an image or file is uploaded to WeWeb, you would expect that the URL would be formatted in such a way that is compatible with other services.

For instance, if an image on your computer is named **“Nice Eiffel Tower Image”** and you upload that on WeWeb, the file url would be saved as **“[https://storage-cdn.weweb.io/4def5e49-d6cc-441a-89b4-6ceb2d3e678e/users-storage/50fc1d05/Nice](https://storage-cdn.weweb.io/4def5e49-d6cc-441a-89b4-6ceb2d3e678e/users-storage/50fc1d05/Nice) Eiffel Tower Image.jpg”**

!!! Note the spaces in the URL link.  
Edit: ^See how even the forum can’t parse the URL properly because of the spaces?

When this is sent to other services via API, like Xano, it would result in an error because it is web standard to have spaces in URLs replaced with encoding (such as “%20”) or some other filler value like “-”. URLs can’t have spaces in them.

---

<div class="post-metadata">

**Author:** ![gbeaudoin](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/gbeaudoin/32/3221_2.png) [@gbeaudoin](https://community.weweb.io/u/gbeaudoin)\
**Post date:** [March 4, 2023, 2:21am UTC](https://community.weweb.io/t/image-url-links/1966/2 "2023-03-04T02:21:42Z")

</div>

You can also use the [encodeURI()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI) javascript function to encode it so that you have a valid URL.

The resulting encoded URL in your example is [https://storage-cdn.weweb.io/4def5e49-d6cc-441a-89b4-6ceb2d3e678e/users-storage/50fc1d05/Nice%20Eiffel%20Tower%20Image.jpg](https://storage-cdn.weweb.io/4def5e49-d6cc-441a-89b4-6ceb2d3e678e/users-storage/50fc1d05/Nice%20Eiffel%20Tower%20Image.jpg)

Not sure if there are any reasons why those wouldn’t be automatically encoded by the platform. Maybe someone from weweb can chime in on that, but it seems to me like it should be the case that provided URLs are always properly encoded.

---

<div class="post-metadata">

**Author:** ![felixtanhm](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/felixtanhm/32/1544_2.png) [@felixtanhm](https://community.weweb.io/u/felixtanhm)\
**Post date:** [March 4, 2023, 5:45am UTC](https://community.weweb.io/t/image-url-links/1966/3 "2023-03-04T05:45:22Z")

</div>

I would expect that as well. 🙂

I implemented encoding on my backend for all file uploads as a result, but it can certainly be done on the frontend as well.

---

<div class="post-metadata">

**Author:** ![Everton](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/everton/32/7804_2.png) [@Everton](https://community.weweb.io/u/Everton)\
**Post date:** [February 22, 2024, 10:06pm UTC](https://community.weweb.io/t/image-url-links/1966/4 "2024-02-22T22:06:13Z")

</div>

I created a Regex replaceAll formula, follow the example  
**3 Parameters**

**search** text

**replacement** text  
Test value  
+

**textoOrigem** text

* * *

JS  
let texto = textoOrigem  
let textoSubstituido = texto.replaceAll(search,replacement);  
return textoSubstituido

component _uploadfile_  
Current value  
"[https://storage-cdn.weweb.io/75cef5c5-df84-444e-89c8-f3a5d1cc70e9/users-storage/b3906169/Captura+de+img.png](https://storage-cdn.weweb.io/75cef5c5-df84-444e-89c8-f3a5d1cc70e9/users-storage/b3906169/Captura+de+img.png) "
