Skip to content

Commit

Permalink
Updated Java Payment Example. (square#74)
Browse files Browse the repository at this point in the history
Updated Java Payment Example.
  • Loading branch information
StephenJosey authored Aug 13, 2018
1 parent 237bdd2 commit 87eec1d
Show file tree
Hide file tree
Showing 8 changed files with 422 additions and 428 deletions.
77 changes: 5 additions & 72 deletions connect-examples/v2/java_payment/README.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
# Java Payment Form Example

This example hosts a payment form in a Java. It is a Spring Boot app and requires Java 8 or newer.
It can run locally and is structured to be easily deployable on
[Heroku](https://devcenter.heroku.com/articles/getting-started-with-java) as well.

This example hosts a payment form in Java. It is a Spring Boot app and requires Java 8 or newer.

## Setting up

Expand All @@ -29,81 +26,17 @@ to be set: `SQUARE_APP_ID` and `SQUARE_ACCESS_TOKEN`. Both of these can be copie
[Developer Dashboard](https://connect.squareup.com/apps). Keep in mind that the access token is
sensitive and must remain private.

To get up and running, open a command line terminal and run the following commands.
To get up and running, first clone the repo to your local computer.
Then open a command line terminal and run the following command:

```
git clone https://github.com/square/connect-api-examples.git
cd connect-api-examples/connect-examples/v2/java_payment
# The following command sets environment variables and starts the application locally:
SQUARE_APP_ID=replace_me SQUARE_ACCESS_TOKEN=replace_me mvn spring-boot:run
SQUARE_APP_ID=replace_me SQUARE_ACCESS_TOKEN=replace_me SQUARE_LOCATION_ID=replace_me mvn spring-boot:run
```

After running the above command, you can open a browser and go to
[http://localhost:5000](http://localhost:5000).

The default port used is `5000`, but this can be configured in the `application.properties` file.

If the credentials are not set or are invalid, the app will fail during startup.


## Running on Heroku

Heroku is a cloud platform provider that supports easily deploying applications and has a free tier.
This sample app can be deployed to Heroku without any code changes.

### Prerequisites

* A Heroku account. Sign up at the [Heroku website](https://www.heroku.com/).
* Git command line tools installed, and basic familiarity git.
See [installation instructions](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git).
* The Heroku CLI tool installed.
See [installation instructions](https://devcenter.heroku.com/articles/heroku-cli).


### Deployment Steps

You can run this sample app with just a few commands. For the commands with `replace_me`, you'll
need to copy the values from the [Square Developer Portal](https://connect.squareup.com/apps).

To get started, open up a command line terminal.

```
# Create a directory that will contain the code that will be deployed. Any directory name is fine.
mkdir connect-v2-payment-example
cd connect-v2-payment-example
# Copy the sample code from GitHub
curl -L https://github.com/square/connect-api-examples/tarball/master | tar -xz --strip=4 '*/connect-examples/v2/java_payment'
# Initialize the directory as a new git repository.
git init
git add .
git commit -m 'Initial commit'
# Create a new Heroku app.
# If this command fails, you may need to run this first: heroku login
heroku create
# Set the environment variables required by the application.
# If you don't do this, or set them to invalid values, the application will not start.
# IMPORTANT: Don't forget to replace `replace_me` with real values.
heroku config:set SQUARE_APP_ID=replace_me
heroku config:set SQUARE_ACCESS_TOKEN=replace_me
# Push the code to Heroku, which causes Heroku to build and run the application.
git push heroku master
# Open up the application in your browser.
# There may be a small delay when your app starts up for the first time.
heroku open
```

You can manage or delete your newly created app in the
[Heroku Dashboard](https://dashboard.heroku.com/apps).

If the application is not starting, you may want to check the logs:

```
heroku logs
```
If the credentials are not set or are invalid, the app will fail during startup.
2 changes: 1 addition & 1 deletion connect-examples/v2/java_payment/app.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "Square Payment Form Example App",
"description": "A simple Java app to demonstrate Square's E-commerce API, deployable to Heroku",
"description": "A simple Java app to demonstrate Square's E-commerce API.",
"addons": []
}
13 changes: 7 additions & 6 deletions connect-examples/v2/java_payment/pom.xml
Original file line number Diff line number Diff line change
Expand Up @@ -11,24 +11,24 @@
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>1.5.2.RELEASE</version>
<version>2.0.4.RELEASE</version>
</parent>

<properties>
<java.version>1.8</java.version>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<webjars-bootstrap.version>3.3.6</webjars-bootstrap.version>
<webjars-jquery-ui.version>1.11.4</webjars-jquery-ui.version>
<webjars-jquery.version>2.2.4</webjars-jquery.version>
<thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
<webjars-bootstrap.version>4.1.3</webjars-bootstrap.version>
<webjars-jquery-ui.version>1.12.1</webjars-jquery-ui.version>
<webjars-jquery.version>3.3.1</webjars-jquery.version>
<thymeleaf.version>3.0.9.RELEASE</thymeleaf.version>
</properties>

<dependencies>
<dependency>
<groupId>com.squareup</groupId>
<artifactId>connect</artifactId>
<version>2.3.1</version>
<version>2.20180712.1</version>
<scope>compile</scope>
</dependency>

Expand Down Expand Up @@ -64,6 +64,7 @@
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator</artifactId>
<version>0.34</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,8 @@
import com.squareup.connect.api.LocationsApi;
import com.squareup.connect.api.TransactionsApi;
import com.squareup.connect.auth.OAuth;
import com.squareup.connect.models.ChargeRequest;
import com.squareup.connect.models.ChargeResponse;
import com.squareup.connect.models.Location;
import com.squareup.connect.models.*;
import com.squareup.connect.models.Location.CapabilitiesEnum;
import com.squareup.connect.models.Money;
import com.squareup.connect.models.Money.CurrencyEnum;
import java.util.Map;
import java.util.UUID;
Expand All @@ -48,8 +45,12 @@ public class Main {
// This must be set in order for the application to start.
private static final String SQUARE_APP_ID_ENV_VAR = "SQUARE_APP_ID";

// The environment variable containing a Square location ID.
// This must be set in order for the application to start.
private static final String SQUARE_LOCATION_ID_ENV_VAR = "SQUARE_LOCATION_ID";

private final ApiClient squareClient = Configuration.getDefaultApiClient();
private final Location squareLocation;
private final String squareLocationId;
private final String squareAppId;

public Main() throws ApiException {
Expand All @@ -59,7 +60,7 @@ public Main() throws ApiException {
OAuth oauth2 = (OAuth) squareClient.getAuthentication("oauth2");
oauth2.setAccessToken(mustLoadEnvironmentVariable(SQUARE_ACCESS_TOKEN_ENV_VAR));

squareLocation = lookupCardProcessingLocation();
squareLocationId = mustLoadEnvironmentVariable(SQUARE_LOCATION_ID_ENV_VAR);
}

public static void main(String[] args) throws Exception {
Expand All @@ -78,9 +79,8 @@ private String mustLoadEnvironmentVariable(String name) {

@RequestMapping("/")
String index(Map<String, Object> model) throws ApiException {
model.put("locationId", squareLocation.getId());
model.put("locationName", squareLocation.getName());
model.put("addId", squareAppId);
model.put("locationId", squareLocationId);
model.put("appId", squareAppId);

return "index";
}
Expand All @@ -99,21 +99,13 @@ String charge(@ModelAttribute NonceForm form, Map<String, Object> model) throws
TransactionsApi transactionsApi = new TransactionsApi();
transactionsApi.setApiClient(squareClient);

ChargeResponse response = transactionsApi.charge(squareLocation.getId(), chargeRequest);
ChargeResponse response = transactionsApi.charge(squareLocationId, chargeRequest);

model.put("transactionId", response.getTransaction().getId());

return "charge";
}

private Location lookupCardProcessingLocation() throws ApiException {
LocationsApi locationsApi = new LocationsApi();
locationsApi.setApiClient(squareClient);
// Print the object to the console just to see it
System.out.print(response.getTransaction());

return locationsApi.listLocations().getLocations().stream()
.filter(l -> l.getCapabilities().contains(CapabilitiesEnum.PROCESSING))
.findFirst()
.orElseThrow(() -> new IllegalStateException(
"At least one location must support card processing"));
return "charge";
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,142 @@
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

/* Define how SqPaymentForm iframes should look */
.sq-input {
border: 1px solid #E0E2E3;
border-radius: 4px;
outline-offset: -2px;
display: inline-block;
}

/* Define how SqPaymentForm iframes should look when they have focus */
.sq-input--focus {
border: 1px solid #4A90E2;
box-shadow: 0 0 2px 0 rgba(0,0,0,0.10), 0 2px 2px 0 rgba(0,0,0,0.10);
}

/* Define how SqPaymentForm iframes should look when they contain invalid values */
.sq-input--error {
border: 1px solid red;
box-shadow: 0 0 2px 0 rgba(0,0,0,0.10), 0 2px 2px 0 rgba(0,0,0,0.10);
}

.label {
font-size: 18px;
font-style: normal;
font-variant: normal;
font-weight: 700;
line-height: 19.8px;
padding-right: 12px;
}

.button-credit-card:hover {
background-color: #12df12;
}

/* Customize the "Pay with Credit Card" button */
.button-credit-card {
width: 100%;
min-height: 45px;
background: #0EB00E;
box-shadow: 0 0 2px 0 rgba(0,0,0,0.10), 0 2px 2px 0 rgba(0,0,0,0.10);
border-radius: 4px;
cursor: pointer;
display: block;
font-size: 16px;
color: #FFFFFF;
letter-spacing: 0;
text-align: center;
line-height: 24px;
padding: 15px;
margin-top: 10px;
outline: none;
font-family: "HelveticaNeue-Bold", Helvetica, Arial, sans-serif;
}


/* Customize the "{{Wallet}} not enabled" message */
.wallet-not-enabled {
min-width: 200px;
min-height: 40px;
max-height: 64px;
padding: 0;
margin: 10px;
line-height: 40px;
background: #eee;
border-radius: 5px;
font-weight: lighter;
font-style: italic;
font-family: inherit;
display: block;
}

/* Customize the Apple Pay on the Web button */
.button-apple-pay {
min-width: 200px;
min-height: 40px;
max-height: 64px;
padding: 0;
margin: 10px;
background-image: -webkit-named-image(apple-pay-logo-white);
background-color: black;
background-size: 100% 60%;
background-repeat: no-repeat;
background-position: 50% 50%;
border-radius: 5px;
cursor: pointer;
display: none;
}

/* Customize the Masterpass button */
.button-masterpass {
min-width: 200px;
min-height: 40px;
max-height: 40px;
padding: 0;
margin: 10px;
background-image: url(https://static.masterpass.com/dyn/img/btn/global/mp_chk_btn_147x034px.svg);
background-color: black;
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: 50% 50%;
border-radius: 5px;
border-color: rgb(255, 255, 255);
cursor: pointer;
display: none;
}

#sq-walletbox {
float: left;
margin: 5px;
padding: 10px;
text-align: center;
vertical-align: top;
font-weight: bold;
}

#sq-ccbox {
float: left;
margin: 5px;
padding: 10px;
text-align: center;
vertical-align: top;
font-weight: bold;
}

#sq-card-number::placeholder {
color: black;
}

.hide {
visibility: hidden;
}

#nonce-form {
background-color: #f7f7f7;
padding: 25px;
text-align: right;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
Loading

0 comments on commit 87eec1d

Please sign in to comment.