diff --git a/core/frontend/src/components/canvas/customComponent/Picture.vue b/core/frontend/src/components/canvas/customComponent/Picture.vue
index 44e3ceac8e..e1c7255777 100644
--- a/core/frontend/src/components/canvas/customComponent/Picture.vue
+++ b/core/frontend/src/components/canvas/customComponent/Picture.vue
@@ -3,7 +3,7 @@
     <img
       v-if="!showLink"
       :style="imageAdapter"
-      :src="element.propValue"
+      :src="imgUrl"
     >
     <a
       v-if="showLink"
@@ -13,13 +13,15 @@
     >
       <img
         :style="imageAdapter"
-        :src="element.propValue"
+        :src="imgUrl"
       >
     </a>
   </div>
 </template>
 
 <script>
+import { imgUrlTrans } from '@/components/canvas/utils/utils'
+
 export default {
   props: {
     element: {
@@ -33,6 +35,9 @@ export default {
     }
   },
   computed: {
+    imgUrl() {
+      return imgUrlTrans(this.element.propValue)
+    },
     showLink() {
       return this.editMode === 'preview' && this.element && this.element.hyperlinks && this.element.hyperlinks.enable
     },