Creating an Uber Clone - Part XXXI - Transcript.pdf
- 1. Creating an Uber Clone - Part XXXI The last two "big ticket items" are billing and social login. I won't implement them with adherence to the way they were implemented by Uber. I want to keep both of these features simple as they are both very volatile. Features and requirements within both of these API's can change literally overnight.
- 2. Billing ✦A bit different from the native Uber app ✦To keep billing simple I'll just charge $1 per minute ✦I won’t use in-app-purchase ✦I’ll use Braintree © Codename One 2017 all rights reserved I will implement billing as a request before the ride starts. I'll use Braintree to do this mostly because it's already implemented in Codename One. The original implementation in Uber checks whether a billing method already exists. This is possible to do in Braintree but it would require some extra work. To keep billing simple I'll just charge $1 per minute and do the charge in the server side. In app purchase is one of the big ticket features in mobile apps. We support this rather well in Codename One but we can't use in app purchase for this case. In app purchase was devised as a tool to buy "virtual goods" inside an application. This reduces friction as no credit card is needed (Google/Apple already have it) and makes purchases more fluid. The definition of "virtual goods" has some gray areas but generally the idea is that a good or service sold would be something that has no immediate physical cost. Good examples for virtual goods would be: in game item, upgrade of software functionality, app subscription etc. However, physical items and services are explicitly prohibited from using in app purchase. This isn't a bad thing. In app purchase takes a hefty commission of 30% which isn't viable for most physical goods sold. Braintree is a part of PayPal and provides an easy to integrate mobile payment SDK for selling physical goods and services. In theory we could just collect a credit card and call it a day but that's naive. Securing online transactions is a nuanced task by using a trusted 3rd party a great deal of the risk and liability is transferred to them. One of the core concepts when working with Braintree is opacity. The developer doesn't get access to the credit card or billing information. Instead a nonce & token are passed between the client and server. Even if a security flaw exists in the app a hacker wouldn't gain access to any valuable information as the values expire.
- 3. Braintree © Codename One 2017 all rights reserved This diagram and covers the process of purchasing via Braintree. Lets dig into the pieces within it
- 4. Braintree © Codename One 2017 all rights reserved The client code (our mobile app) asks our server for a token. The server generates a token with the Braintree server code and returns it. A client token is a signed data blob that includes configuration and authorization information needed by Braintree to associate the transaction correctly. It can't be reused and should be hard to spoof in an attack
- 5. Braintree © Codename One 2017 all rights reserved The mobile app invokes the Braintree UI with the token. That UI lets the user pick a credit card or other payment option (e.g. PayPal, Android Pay, Apple Pay etc.) then communicates with Braintree's servers. The result of all this is a nonce which is a unique key that allows you to charge this payment method
- 6. Braintree © Codename One 2017 all rights reserved Our app now sends the nonce our Spring Boot server
- 7. Braintree © Codename One 2017 all rights reserved The server uses the server side Braintree API and the nonce to charge an amount to the payment method. Notice that the amount charged is completely up to the server and isn't a part of the client side UI!
- 8. <dependency> <groupId>com.braintreepayments.gateway</groupId> <artifactId>braintree-java</artifactId> <version>2.71.0</version> </dependency> POM The Braintree SDK for Java is pretty easy to use. We already have it in Maven but just in case you skipped those lines this needs to be in the POM file
- 9. @Service public class BraintreeService { private final static BraintreeGateway gateway = new BraintreeGateway( Environment.SANDBOX, "your_merchant_id", "your_public_key", "your_private_key" ); @Autowired private RideRepository rides; public String getClientToken() { return gateway.clientToken().generate(); } public void saveNonce(long rideId, String nonce) { Ride r = rides.findOne(rideId); r.setNonce(nonce); rides.save(r); } public void pay(BigDecimal amount, String nonce) { TransactionRequest requestT = new TransactionRequest() .amount(amount) .paymentMethodNonce(nonce) .options() .submitForSettlement(true) .done(); } } BraintreeService Next we add a `BraintreeService` class which is remarkably simple. These values should be updated from Braintree and SANDBOX should be updated to production once everything is working
- 10. @Service public class BraintreeService { private final static BraintreeGateway gateway = new BraintreeGateway( Environment.SANDBOX, "your_merchant_id", "your_public_key", "your_private_key" ); @Autowired private RideRepository rides; public String getClientToken() { return gateway.clientToken().generate(); } public void saveNonce(long rideId, String nonce) { Ride r = rides.findOne(rideId); r.setNonce(nonce); rides.save(r); } public void pay(BigDecimal amount, String nonce) { TransactionRequest requestT = new TransactionRequest() .amount(amount) .paymentMethodNonce(nonce) .options() .submitForSettlement(true) .done(); } } BraintreeService This is the client token that we use to identify the transaction. Notice we generate a new one for every request
- 11. @Service public class BraintreeService { private final static BraintreeGateway gateway = new BraintreeGateway( Environment.SANDBOX, "your_merchant_id", "your_public_key", "your_private_key" ); @Autowired private RideRepository rides; public String getClientToken() { return gateway.clientToken().generate(); } public void saveNonce(long rideId, String nonce) { Ride r = rides.findOne(rideId); r.setNonce(nonce); rides.save(r); } public void pay(BigDecimal amount, String nonce) { TransactionRequest requestT = new TransactionRequest() .amount(amount) .paymentMethodNonce(nonce) .options() .submitForSettlement(true) .done(); } } BraintreeService We save the nonce into the Ride object. This assumes payment authorization happens before the ride is completed. Once the ride is finished the nonce is instantly available to do perform the charge
- 12. @Controller @RequestMapping("/pay") public class BraintreeWebservice { @Autowired private BraintreeService payment; @RequestMapping(method=RequestMethod.GET,value = "/token") public @ResponseBody String getClientToken(long id) { return payment.getClientToken(); } @RequestMapping(method=RequestMethod.GET,value="/nonce") public @ResponseBody String nonce( @RequestParam(name="ride", required = true) long rideId, @RequestParam(name="nonce", required = true) String nonce) { payment.saveNonce(rideId, nonce); return "OK"; } } BraintreeWebservice Before we proceed further the obvious next step is the webservice to match. It's mostly trivial but I'd like to point out a small nuance: pay isn't mapped. We invoke pay in the server so we don't need to expose it to the client side.
- 13. private String nonce; public String getNonce() { return nonce; } public void setNonce(String nonce) { this.nonce = nonce; } Ride That code required some unexpected changes which I will get to shortly. The first change was pretty predictable though. We just had to add a nonce field to the Ride class
- 14. private Long currentRide; public Long getCurrentRide() { return currentRide; } public void setCurrentRide(Long currentRide) { this.currentRide = currentRide; } Ride Here's the part I didn't expect. I need to add the ride id to the User object. A driver has a reference to the Ride object which is why we didn't need this up until now. However, when the user tries to pay he can't set this anywhere else... Unfortunately there is no other place where the nonce would fit. Since it's transient we can't add it to the User as we'd want some logging. The Ride object is the "right place" for the nonce.
- 15. public long acceptRide(String token, long userId) { User driver = users.findByAuthToken(token).get(0); User passenger = users.findOne(userId); if(!passenger.isHailing()) { throw new RuntimeException("Not hailing"); } passenger.setHailing(false); passenger.setAssignedUser(driver.getId()); driver.setAssignedUser(userId); Ride r = new Ride(); r.setDriver(driver); r.setPassenger(passenger); rides.save(r); driver.setCurrentRide(r.getId()); passenger.setCurrentRide(r.getId()); users.save(driver); users.save(passenger); return r.getId(); } acceptRide To get this to work I had to make a few changes to the acceptRide method. I added the ride reference to both the driver and passenger for future reference.
- 16. public long acceptRide(String token, long userId) { User driver = users.findByAuthToken(token).get(0); User passenger = users.findOne(userId); if(!passenger.isHailing()) { throw new RuntimeException("Not hailing"); } passenger.setHailing(false); passenger.setAssignedUser(driver.getId()); driver.setAssignedUser(userId); Ride r = new Ride(); r.setDriver(driver); r.setPassenger(passenger); rides.save(r); driver.setCurrentRide(r.getId()); passenger.setCurrentRide(r.getId()); users.save(driver); users.save(passenger); return r.getId(); } acceptRide I moved these lines downward because the ride ID will only be available after the rides.save() call
- 17. public void finishRide(long rideId) { Ride current = rides.findOne(rideId); current.setFinished(true); if(current.isStarted() && current.getNonce() != null) { Set<Waypoint> s = current.getRoute(); Iterator<Waypoint> i = s.iterator(); if(i.hasNext()) { long startTime = i.next().getTime(); long endTime = -1; while(i.hasNext()) { endTime = i.next().getTime(); } if(endTime > -1) { BigDecimal cost = BigDecimal.valueOf(endTime - startTime). divide(BigDecimal.valueOf(60000)); current.setCost(cost); payments.pay(current.getCost(), current.getNonce()); } } } rides.save(current); } finishRide Since payment is handled on the server side we can go directly to it even before we do the client side... I've decided to do this in the finishRide method. A ride that was finished before it was started is effectively canceled. A ride without a nonce can't be charged
- 18. public void finishRide(long rideId) { Ride current = rides.findOne(rideId); current.setFinished(true); if(current.isStarted() && current.getNonce() != null) { Set<Waypoint> s = current.getRoute(); Iterator<Waypoint> i = s.iterator(); if(i.hasNext()) { long startTime = i.next().getTime(); long endTime = -1; while(i.hasNext()) { endTime = i.next().getTime(); } if(endTime > -1) { BigDecimal cost = BigDecimal.valueOf(endTime - startTime). divide(BigDecimal.valueOf(60000)); current.setCost(cost); payments.pay(current.getCost(), current.getNonce()); } } } rides.save(current); } finishRide I use the route which is ordered based on time to find the start time of the ride
- 19. public void finishRide(long rideId) { Ride current = rides.findOne(rideId); current.setFinished(true); if(current.isStarted() && current.getNonce() != null) { Set<Waypoint> s = current.getRoute(); Iterator<Waypoint> i = s.iterator(); if(i.hasNext()) { long startTime = i.next().getTime(); long endTime = -1; while(i.hasNext()) { endTime = i.next().getTime(); } if(endTime > -1) { BigDecimal cost = BigDecimal.valueOf(endTime - startTime). divide(BigDecimal.valueOf(60000)); current.setCost(cost); payments.pay(current.getCost(), current.getNonce()); } } } rides.save(current); } finishRide I then go to the last element and find the end time of the ride
- 20. public void finishRide(long rideId) { Ride current = rides.findOne(rideId); current.setFinished(true); if(current.isStarted() && current.getNonce() != null) { Set<Waypoint> s = current.getRoute(); Iterator<Waypoint> i = s.iterator(); if(i.hasNext()) { long startTime = i.next().getTime(); long endTime = -1; while(i.hasNext()) { endTime = i.next().getTime(); } if(endTime > -1) { BigDecimal cost = BigDecimal.valueOf(endTime - startTime). divide(BigDecimal.valueOf(60000)); current.setCost(cost); payments.pay(current.getCost(), current.getNonce()); } } } rides.save(current); } finishRide Assuming the ride has more than one Waypoint (otherwise endTime would be -1) we can just charge 1USD per 60 seconds. And payment is effectively done on the server. Again I oversimplified a lot and ignored basic complexities like the driver forgetting press “Finish".