# Example App

In this tutorial we are going to set-up a Laravel application that uses the Orderchamp/orderchamp-api-php (opens new window) client. The client can be used stand alone, for the purpose of this tutorial we are going to use the Laravel package Orderchamp/orderchamp-laravel (opens new window), which is basically a wrapper for the client that can be configured by using environment variables.

# Preparing the project

Let's start by creating a bare Laravel application by using Composer.

$ cd ~/Sites
$ composer create-project --prefer-dist laravel/laravel orderchamp-app
$ cd orderchamp-app

# Adding the Laravel package

$ composer require Orderchamp/orderchamp-laravel

# Updating .env

Open .env file and add the following environment variables:

ORDERCHAMP_CLIENT_ID=ca8bd79cab7987ba8c7ba34
ORDERCHAMP_CLIENT_SECRET=uRc1i3n7s3cr3t097sdf978c987a6
ORDERCHAMP_API_URL=https://api.orderchamp.com/v1
ORDERCHAMP_WEB_URL=https://www.orderchamp.com
ORDERCHAMP_VERIFY=true

# Configure permission scope

Create the file config/orderchamp.php to set the proper permissions you need for your app.

<?php

return [
    'scopes' => [
        'account_read',
        'products_read',
        'products_write',
    ],
];

# Register Orderchamp Laravel Middleware

Open app/Http/Kernel.php to register the Auth Middleware that comes with the laravel package.

<?php
namespace App\Http;
use App\Http\Middleware\OrderchampAuth;
use Illuminate\Foundation\Http\Kernel as HttpKernel;

class Kernel extends HttpKernel
{
    //...

    protected $routeMiddleware = [
        'auth'            => \App\Http\Middleware\Authenticate::class,
        'auth.basic'      => \Illuminate\Auth\Middleware\AuthenticateWithBasicAuth::class,
        'bindings'        => \Illuminate\Routing\Middleware\SubstituteBindings::class,
        'cache.headers'   => \Illuminate\Http\Middleware\SetCacheHeaders::class,
        'can'             => \Illuminate\Auth\Middleware\Authorize::class,
        'guest'           => \App\Http\Middleware\RedirectIfAuthenticated::class,
        'signed'          => \Illuminate\Routing\Middleware\ValidateSignature::class,
        'throttle'        => \Illuminate\Routing\Middleware\ThrottleRequests::class,
        'verified'        => \Illuminate\Auth\Middleware\EnsureEmailIsVerified::class,
        'orderchamp.auth' => OrderchampAuth::class,
    ];

    //...
}

# AuthController and registering route

This route will be used by Orderchamp to be redirected to so the app can validate the authenticated user. Create app/Http/Controllers/AuthController.php

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Redirect;
use Orderchamp\Laravel\Orderchamp;
class AuthController extends Controller
{
    public function login()
    {
        $url = Orderchamp::api()->authorizationUrl(
            config('orderchamp.scopes'),
            url('auth/callback')
        );
        return Redirect::to($url);
    }
    public function logout(Request $request)
    {
        $request->session()->invalidate();
        return Redirect::to('/');
    }
    public function callback(Request $request)
    {
        $token = Orderchamp::api()->requestToken($request->all());
        $request->session()->put('token', $token);
        return Redirect::to('/');
    }
}

Now register the controller in routes/web.php

<?php
Route::get('auth/login', 'AuthController@login');
Route::get('auth/callback', 'AuthController@callback');
Route::get('auth/logout', 'AuthController@logout');

Note: these URL's are publicly available and used to store the ACCESS_TOKEN inside of a session.

# Using protected routes for authenticated users

Use the Laravel Middleware that comes with the orderchamp-laravel package to verify authenticated users in protected routes. It is useful to proxy the GraphQL API so you can make a SPA for your integration.

# Bonus: proxy GraphQL

You can proxy the GraphQL API by registering your own graphql endpoint, this endpoint can be consumed by your frontend application. By registering the 'orderchamp.auth' Middleware for this new route, you ensure that this proxy is restricted to authenticated users only. If an unauthenticated user tries to access this URL it will be redirected to the login page.

Create app/Http/Controllers/GraphiqlController.php

<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Orderchamp\Laravel\Orderchamp;
class GraphiqlController extends Controller
{
    public function proxy(Request $request)
    {
        $params = $this->validate($request, [
            'query'         => 'required|string',
            'variables'     => 'nullable|array',
            'operationName' => 'nullable|string',
        ]);
        return Orderchamp::api()->graphql(
            $params['query'],
            $params['variables'] ?? [],
            $params['operationName'] ?? null
        );
    }
}

Now register the controller in routes/web.php

<?php
Route::middleware(['orderchamp.auth'])->group(function () {
    Route::post('graphql', 'GraphiqlController@proxy');
});
// ...

This will allow you to post GraphQL requests to https://YOUR_APP_URL/graphql.

← Webhooks Example Webhooks →