[FIXED] How can i remove port from url to make source for images from xampp database to work properly?

Issue

I'm new to angular and i have a problem with angular and xampp. I'm trying to load images from mySQL database where i stored their destination. Problem is that angular tries to access that destination through this:

My HTML is:

But my url to that image is without port :4200

When i access localhost/bcPraca/php/upload/imageName then that image shows up so it works.

So how can i remove that port from Url. Or what can i do to make it work ?

Everything else is working properly except that source in the image.

Solution

You have to use a proxy in order to be able to communicate with your backend/ In order to use a proxy:

1. Create a proxy.conf.json in the root of your workspace (adapt the following to our needs):

   { "/api": { "target": "http://localhost/api", "secure": false, "changeOrigin": true "logLevel": "debug" } }

2. Start your app with the following command:

   ng serve --proxy-config proxy.conf.json

You can read more about angular proxy here

Answered By - Ismail Dinar

Answer Checked By - Mildred Charles (PHPFixing Admin)