Search code examples
htmlangularxampp

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

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:

enter image description here

My HTML is:

enter image description here

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