Inline content images using wrong path

Questions and Answers Frontend-Vue
1

The closest question I could find to my issue was here

I used the nuxt blog starter

I am trying to add images to my content, on the backend the image has been uploaded and added to the blog post with this markdown

![beautiful-picture.jpg](/uploads/beautiful_picture.jpg)

The problem is on the frontend this path resolves to

http://localhost:3000/uploads/beautiful_picture.jpg

whereas the image is actually here

http://localhost:1337/uploads/beautiful_picture.jpg

How can I configure my frontend to use the backend url when creating image URLs?

I notice banner images on the blog have correct URLs i.e.

http://localhost:1337/uploads/this_shrimp_is_awesome.jpg

This is because they use the getStrapiMedia function to prepend the correct URL to relative paths. Since the inline images are part of the content they are rendered by markdown-it - so how do I configure this to also use getStrapiMedia?

Can this be resolved by deploying my backend?

1 Like
2

Not been working too much with NuxtJS etc, but Iā€™m guessing you could use something like this? @nuxtjs/proxy - npm which you can set the proxy on the port. @Pixelomo

1 Like
3

@Eventyret 's answer helped me resolve this issue because I am using angular with strapi, and I have searched all over the internet. The solution was actually to use a proxy. I got mine from Angular follow the instructions changing /api to /uploads and that was it.