How to connect the Angular admin panel with many third-party services?

Question

API

Good afternoon.
We have a front on angular.
We have deployed applications: proxmox (server management), billmanager (payment and support management), zabbix (server monitoring), etc. The

question is actually in building a connection between all of this. It seems to me that it is logical that there should be an API layer (for example, django, laravel) with which the front will communicate. And this shim will already distribute requests to proxmox, zabbix, billmanager, etc... Or is this shim not needed? And connect the front to angular directly with all services (proxmox, zabbix, etc.)?

A simple example. If a user registers on a site (Angular), he must be registered at the same time in zabbix, proxmox, billmanager and from the heels of applications that are needed to provide hosting services.

And there are two options (maybe more).
1) Angular will make requests to each application in turn and register an account for the user there. Only 7 requests
2) Angular makes one request to some intermediate API (for example, to laravel). And this intermediate API already registers accounts in all other APIs.

For clarity, I will attach an image with a diagram.



Perhaps there is a third option, which I do not know about)

I would be grateful for advice.

Answer 1

It's best to always have a gateway at least for security and access control. And if necessary for asynchronous or parallel operations and much more

Answer 2

The second option in the picture is bad because an unstable Internet connection on the client does not guarantee the atomicity of the operation, that is, a request will occur for three services, and the connection will fall on the 4th.
it seems to me that in the first and second cases you have a problem with the atomicity of the operation, with transactionality, and you probably need to look at the saga pattern from the microservice architecture, but I did not implement it in practice

Answer 3

Thanks everyone for the replies.
Based on the recommendations received (not only on this resource), I came to the conclusion that Option 1 (with API Gateway) is the only correct one.
However, an equally important question arose. How to be with authorization of users?
I think it would be logical in the same proxmox, and even more so in billmanager, to automatically create a new user when registering a new account. Otherwise, how will billmanager send email notifications about debts, and proxmox will keep logs under one administrator account, which will complicate the search for errors.
And if we dwell on the fact that it is still necessary to create a separate account in some services, what about passwords? I will not be able to use the password that the user set during registration, as it is stored in encrypted form. There are no problems with email. Accordingly, a new password is required. And here again there are several options for the development of events:
1) Generate a random password for each service, save it in the database and register accounts with this password. However, in order to be able to authenticate, we will have to store the password in the database in clear text, which is not a very good idea.
2) Use one universal password for all accounts. Are there any weaknesses in this option?
3) Using LDAP? But I'm not sure that there is a solution for prox, billmanager and laravel that does not require much improvement to solve the problem.
I'm sure that people on the resource have already encountered this problem, I will be glad if you tell me the best practice in this matter.