🚨 Black Friday: 85% OFF Flatlogic Generator! 🚨 Build your custom CRM, ERP, or SaaS app with full code ownership—don’t miss out!
Get Now
Ask A Question
General Discussion

Impossible to do an http request from the template

Angular Templates
Gravatar
Kris-I

Hello,

Something make me crazy. The code I give is wotking in a sample project but not when the same code is implemented in the template.

I get this error : core.js:6210 ERROR Error Code: undefined Message: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL

I use the exact same code than here : https://stackblitz.com/edit/angular-ivy-ue5zf4

The code of my project on Dropbox : https://www.dropbox.com/s/mznt3c0c76xhg1b/Flatlogic.rar?dl=0 URL : http://localhost:3000/#/app/users/userlist

Any idea ?

Thanks,

Gravatar
Islambek

Hi,

Please look following:

file: app.interceptor.ts

line: req = req.clone({url: this.config.baseURLApi + req.url});

You need to change config.baseURLApi to send the request to another domain.

Best Regards

Gravatar
Kris-I

Hello,

There is no file 'app.interceptor.ts'.

I don't understand why I can't use an url from my service to call a webapi. I copy/paste the code in pastbin, the exact same code in a blank project (ng new myproject) and works fine. The same code used from the template generate an error : ERROR Error Code: undefined Message: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL

The code is here : https://pastebin.com/BT6izCJ5

Look the small project here : https://www.dropbox.com/s/t7f5lgb4pqspkbw/FlatlogicDemo.rar?dl=0

Launch it and go to : http://localhost:3000/#/app/users/userlist You will see the error

Thanks,

User profile image
Eugene Stepnov

Hi Kris,

We are investigating your request and try to come back to you as soon as possible!

Best,
Eugene

Gravatar
Kris-I

Hello,

The exact same code (I just copied the files) in an another template (one of your competitor)is working fine.

Have a nice day,

Gravatar
Islambek

Hi Kris,

directory of app.interceptor.ts file:

src -> app -> app.interceptor.ts

Please read about HTTP interceptor here: https://angular.io/api/common/http/HttpInterceptor

In sing-app-angular template, there is a configuration file for host API. Open the project and take a look for the app.config.ts file, inside of that file you see the baseURLApi variable which is responsible for all requests.

To send a request to the external api, you can try the following:

  • change baseURLApi variable's value to your external api

for ex: baseURLApi='https://jsonplaceholder.typicode.com'

Best regards!

Gravatar
Kris-I

Hello,

I don't want a single baseURLApi for all requests because there will be more than one WebApi. I just want use the service the "normal" way. I suppose you didn't download the sample, I have a service and I want use the URL from the service.

Best regards,

Gravatar
Islambek

Hi, We already downloaded and checked your code, actually, everything is okay. At the moment template has a configuration to send requests to only one API. But, you can make any customization to your code, off course you can send requests to multiple WebApi as much as you want. To do that, change just configuration and you need to have an understanding of interceptors.

We are sorry, we could not help to make any customization to your code. If you have any problems feel free to ask.

Thanks!

Best Regards!