31

As the needs of web apps have grown, I have found myself writing more and more API driven web applications. I use frameworks like AngularJS to build rich web clients that communicate with these APIs. Currently I am using PHP (Lumen or Laravel) for the server side / API.

The problem is, I find myself repeating business logic between the client and the server side often.

When I say business logic I mean rules like the following for an order form:

  • You can buy X if you buy Y.
  • You cannot buy Y if you have Z.
  • If you buy 10 of these you get 10% off.
  • Height x Width x Depth x Cost = Final Cost.
  • Height must be between 10 and 20 if your width is greater than 5.
  • Etc etc.

To make this app both responsive and fast, the logic for calculations (along with other business logic) is being done on the client side. Since we shouldn't trust the client, I then re-verify those numbers on the server side. This logic can get pretty complex and writing this complex logic in both places feels dangerous.

I have three solutions in mind:

  1. Make everything that require business logic make an ajax call to the API. All the business logic would live in one place and can be tested once. This could be slow since the client would have to wait for each and every change they make to the order form to get updated values and results. Having a very fast API would help with this. The main downside is that this may not work well when users are on poor connections (mobile devices).

  2. Write the business logic on the client side AND on the server side. The client gets instant feedback as they make changes on the form, and we validate all data once they submit on the server. The downside here is that we have to duplicate all the business logic, and test both sides. This is certainly more work and would make future work fragile.

  3. Trust the client!?! Write all the business logic on the client side and assume they didn't tamper with the data. In my current scenario I am working on a quote builder which would always get reviewed by human so maybe this is actually ok.

Honestly, I am not happy about any of the solutions which is why I am reaching out to the community for advice. I would love to hear your opinions or approaches to this problem!

webdev5
  • 467
  • 1
  • 8
  • 22
Roeland
  • 3,698
  • 7
  • 46
  • 62
  • Isn't your problem simply has MVC design pattern as the solution? – Abhishek May 29 '16 at 06:32
  • Using PHP on server ajax is the coolest approach, and should not get more than few ms, also you can set loading screens or warnings if it does take more. You can move to a framework like meteor/node were you code the whole thing once, and explicit some details only for server or client. You can do basic validations on HTML forms and then the big ones on the server. You can do libraries in js accessible to the client and accessible from the server. Take a look at this http://php.net/manual/en/v8js.executestring.php – Cristo May 31 '16 at 21:09
  • May this other tuto I found interest you: http://www.phpied.com/server-side-react-with-php/ – Cristo May 31 '16 at 21:27
  • Maybe you could work with a websocket? It is very fast and you can use javascript. I honestly don't know if it uses much bandwidth. You could consider connecting to this websocket when needed and disconnect when the transaction is done. Websockets are fun and are very easy to implement. Look at [this](http://socket.io/) . – Thomas Van der Veen Jun 02 '16 at 14:21
  • 1
    I would use both server-side & client-side validation; but i don't like the idea of repeating code so most likely I'd have the server pass the validation rules to client & have the client consume these rules so it's 1 function that validates all cases (All changes would be done from server side therefore whatever changes the client would still be able to validate correctly) then I'd validate before saving on server side (final submit) – ahmad Jun 04 '16 at 14:10
  • Use code generation to avoid duplicating logic (er, effort). Use server side components for server validation and have them emit HTML & JS (templates, validation code, etc.) for the client side. – nothingisnecessary Jun 07 '16 at 14:48
  • Definitely do NOT trust the client. Recent case in point: the Dominos Pizza app http://motherboard.vice.com/read/bug-in-dominos-pizza-app-allowed-hackers-to-get-free-pizza-for-life – nothingisnecessary Jun 07 '16 at 14:48

9 Answers9

9

You can do one more thing.

Create your validation and business logic code with JavaScript only. But make it very loosely coupled, as much as possible. If possible, only take JSON as input and give JSON as output.

Then set up a separate NodeJS server alongside the existing PHP server to serve that logic to the client, so that on the client side it can be used without an AJAX call.

Then from the PHP server, when you need to validate and run all those business logic rules, use cURL to call the NodeJS business logic and validate the data. That means an HTTP call from the PHP server to the NodeJS server. The NodeJS server will have additional code which will take the data, validate with the same code, and return the result.

By this way you can make

  1. Faster development - one place to unit test your logic.
  2. Faster client code execution - no need for AJAX, since the same validation JavaScript code is being served by NodeJS to your client.
  3. All business logic lives in the NodeJS server - when business logic changes, you only need to touch this part; so that in the near future, if you need to create some other additional interfaces, then you can use this server to validate your data. It will work just like your Business Rule Server.

The only thing you need to do is setup a NodeJS server alongside your PHP server. But you do not need to change all of your code to run on the NodeJS server.

Bondolin
  • 2,793
  • 7
  • 34
  • 62
Partha Sarathi Ghosh
  • 10,936
  • 20
  • 59
  • 84
8

I had the same issue when I decided to create an application using Laravel for back end, and Angular 2 for front-end. And it seems to me there is no solution to avoid the business logic duplicate so far, because:

At the moment PHP and JavaScript cannot be converted from one to another. Would it be nice if we can use same language for writing the business logic and then embed them into both back-end and front-end. From this point it leads me to another point:

To achieve the goal, we should write the business logic in one language only, and so far JavaScript is the best solution. As you know TypeScript/EMCA Script help us to write the code in the OOP way. Meteor framework NodeJS infrastructure help us to write code in JavaScript for running in both sides Back-end and front-end.

So from my point of view, we can use TypeScript/EMCA to write packages for business logic, for example a class for validation written in JavaScript can be implemented both side, so you just write one time only, but it will be called twice from front-end and back-end also.

That's my point. Hope to see some other solutions for this very interesting topic.

Tinh Dang
  • 448
  • 4
  • 11
  • The caveat to this is that it requires a language change (to nodejs from php). It does seem like this may be the only way to do this without any duplication :( – Roeland Jun 01 '16 at 18:14
  • You can use business logic in pure javascript and deploy it on nodejs. Rest of the code you can place on PHP server. In this way you do not need to switch your entire code on nodejs and you can save your duplicate work. Look at my answer. – Partha Sarathi Ghosh Jun 07 '16 at 10:22
7

One possible solution is to declare your validation rules in a declarative abstract language like XML or JSON Schema.

Then in the client side, say AngularJS -- you can transform these rules into a an off the shelf form renderer. So now on the client side you end up with forms that validate the declared rules.

Then on your server side API you need to create a reusable validation engine that will validate based on the defined rules.

What you end up with is a single place, your JSON Schema or where ever you declaratively define your rules, that your form and validation rules are defined.

Martin
  • 15,820
  • 4
  • 47
  • 56
4

I was also in this position when I worked on some of my own projects. It is always tempting to make use of the power of the client's device to do the heavy lifting and then just validate the results on the server side. Which will result in the business logic appearing twice, both front-end and back-end.

I think option 1 is the best option, it makes the most sense and seems most logical as well. If you want to expand your web app to native mobile apps in the future you will be able to re-use all of the business logic through calling those APIs. To me, this is a massive win.

If the worry if making too many API requests and this could impact mobile performance, then maybe try to group together some of the requests and perform a single check at the end? So instead of doing a check for each field in a form, do a check when the user submit the entire form. Also most internet connection will be sufficient if you keep to request and response data to the minimum, so I won't worry about this.

A bigger problem I normally come across is that since your web app will be broken down into sections, with each section calling the relevant APIs. The state of the app is much more complex to understand, since the user could jump between these states. You will need to think very carefully about the user journey and ensure that the process is not buggy.

Here are some of the common issues I had to deal with:

  • Does the front-end display error if the API returns one?
  • If the user made a mistake and submitted the form, he/she should see an error. But once the user fixed the mistake and submits again, the error should hide and success message should now show.
  • What if the API is buggy or internet connection is unstable, so nothing is returned. Will the front-end hang?
  • What if there are multiple errors messages, can/does the front-end display them all?

I would recommend have a lot of Unit tests on the front-end to ensure it is stable, even if the business logic is only on the back-end.

csukcc
  • 752
  • 7
  • 8
2

First of all: Never trust the client.

That being said, I deal with this all the time, and sadly I haven't find an easy solution. You need to do validation on both sides, BUT, you don't need to do the whole validation on them both.

What I do is try to balance it out. On client side, you do most of the simple (but valuable) validation, normal stuff, numbers must be numbers, dates must be dates, data within range, etc, so than when you submit it, it goes to the server to get fully validated, but you are making sure, on client side, that most of the information is at the very least in its proper format, and some (or most) of it, its already validated, however, the real business logic is done server side, but as most of the data is already correct, the server side validation will most likely approve the request, so you will avoid a lot resubmits.

Now, how to make it so that when you need to change something, you don't need to change it on both sides? Well, sometimes you won't be able to avoid this, when major changes are required, BUT, business logic parameters can be shared, and like you suggested, this can be done through ajax. You make a php file, where you have all your business logic parameters, and with an ajax request, you load this on client side, only once (when the script is loaded), you need to optimize this, so you get only the parameters values, everything else should be already there on the client side, so if some parameter value in the business logic changes, you only change it on your parameter file. (If a parameter is changed after the script was loaded, validation will fail on server side, now you need to decide if you force them to reaload script, so parameters are realodaded, or not, I make them reload them)

I think you get the idea. This is what I do, and it works pretty ok for me, saves me a lot of recoding.

I hope you find this helpful.

Lauro182
  • 1,597
  • 3
  • 15
  • 41
0

I feel option 1 is the best going forward in the future. API first development allows all business logic to be tested and work properly and allow interfaces to access. You should NEVER ever ever trust the user!

The power API first development has is unlimited compared to coding the same logic again and again for each interface needed.

Gco Software
  • 3
  • 4
0

Here's a similar thread about whether to put logic client-side or server-side. At the end of the day, each situation is unique and warrants a different plan, but there are some good, guiding tips in this thread.

Client-side vs. Server-side

Community
  • 1
  • 1
jtmingus
  • 804
  • 5
  • 10
0

Today the solution is clearly the one from @ParthaSarathiGhosh, but the near future will certainly give us another solution...

WebAssembly is a low level assembly language that can be deployed with your application and run in the browser. It will allow you to request some logic from the JavaScript by calling the compiled code in the assembly. This is recommended for heavy scripts that runs client side, but will at the same time allow you to reuse your backend code in the front. In that way, you will be able to write your logic for your backend, and reuse it in the front.

Today this technology is already supported in most modern browser, but it's only available from c/c++. So you can already use it if you've these skills.

It's surely planned to expand it to other language also (as there is already some researches for c# - ex: blazor - and other languages). But the maturity level seems not stable enough for production (even the blazor developer team don't recommend it yet for production).

It's only my own opinion but => Logic in NodeJS is a solution to reuse the javascript code, but I still feel the need for a strongly typed language when it comes to big maintainable logic code. (Yes, I know TypeScript and it's really good, but I miss something). WebAssembly is still a bit young, but will for sure bring a big improvement to respect the DRY principle.

ylerjen
  • 4,109
  • 2
  • 25
  • 43
0

Very interesting problem - another caveat can be that we want to support offline mode, i.e. app must run offline as well.

Another further complication will be if lets say your nice server side was all in one technology like java or .Net etc. and on client side you are choosing between something like native tools or Xamarin but unfortunately not the same as server.

So Partha's approach seems most promising - but as it is stated, that will not work in completely offline mode. So a slightly modified approach will be to consider validation rules as data. But not simple data - rather say that "the whole damn code is data". You can choose any interpreted code language you like - Groovy, JavaScript, CScript etc. - but one rule you will follow 100% is that ALL BUSINESS LOGIC IS IN THAT CODE!

If you are able to achieve this, then in offline mode - when you are syncing data --- you will also sync this very special type of data, i.e. the code! (so no risk of "trusting" client)

And then the offline API and online API is 100% same code - but code is in our interpreted language. I think this approach will not only solve this problem but also make business logic maintainence much simpler. We often created highly complex data models to support rules; when in fact in 2019 - you could simply create the rule with ifs/elses and it will be much simpler. We could train end users in a very simple scripting tool and achive less code to do better things.

I have put together a blog post with these ideas: https://medium.com/@thesaadahmad/business-logic-conundrum-offline-mobile-apps-a06ecc134aee

Saad Ahmad
  • 393
  • 1
  • 7