Cara Membuat Restful API di Lumen #7 : Enable CORS di Lumen


Cara Membuat Restful API di Lumen #7 : Enable CORS di Lumen

Cara Membuat Restful API di Lumen #7 : Enable CORS di Lumen - Halo teman-teman semuanya, pada kesempatan kali ini kita semua akan belajar bagaimana cara mengaktifkan CORS di Lumen.

CORS merupakan singkatan dari Cross Origin Resource Sharing, yaitu sebuah teknik menggunakan permintaan HTTP untuk mengizinkan browser pada suatu domain mendapatkan akses ke server pada sumber yang berbeda.

Ini digunakan agar Retful API yang sudah kita buat sebelumnya bisa digunakan atau bisa di akses oleh aplikasi lain seperti aplikasi Android atau Front-End Developer.

Langkah 1 - Membuat Requests Provider

Langsung saja kita mulai, silahkan teman-teman buat sebuah file baru dengan nama CatchAllOptionsRequestsProvider.php di dalam folder app/Providers. Dan silahkan masukkan kode dibawah ini :

<?php namespace App\Providers;

use Illuminate\Support\ServiceProvider;

/**
 * If the incoming request is an OPTIONS request
 * we will register a handler for the requested route
 */
class CatchAllOptionsRequestsProvider extends ServiceProvider {

    public function register()
    {
        $request = app('request');

        if ($request->isMethod('OPTIONS'))
        {
            app()->options($request->path(), function() { return response('', 200); });
        }
    }

}

Langkah 2 - Membuat Middleware CORS

Selanjutnya kita akan membuat sebuah middleware baru untuk menghandle CORS di Restful API kita, langsung saja kita mulai.

Silahkan teman-teman buat file baru dengan nama CorsMiddleware.php di dalam folder app/Http/Middleware. Dan silahkan masukkan kodenya seperti berikut ini :

<?php namespace App\Http\Middleware;

use Closure;

class CorsMiddleware
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        $headers = [
            'Access-Control-Allow-Origin'      => '*',
            'Access-Control-Allow-Methods'     => 'POST, GET, OPTIONS, PUT, DELETE',
            'Access-Control-Allow-Credentials' => 'true',
            'Access-Control-Max-Age'           => '86400',
            'Access-Control-Allow-Headers'     => 'Content-Type, Authorization, X-Requested-With'
        ];

        if ($request->isMethod('OPTIONS'))
        {
            return response()->json('{"method":"OPTIONS"}', 200, $headers);
        }

        $response = $next($request);
        foreach($headers as $key => $value)
        {
            $response->header($key, $value);
        }

        return $response;
    }
}

Langkah 3 - Register Provider & Middleware

Oke, langkah terakhir adalah kita akan meregister Provider dan Middleware yang sudah kita buat di atas di Lumen.

Silahkan teman-teman buka file app.php di dalam folder bootstrap dan tambahkan kode dibawah ini

/*
|--------------------------------------------------------------------------
| Register Middleware
|--------------------------------------------------------------------------

 $app->middleware([
     App\Http\Middleware\CorsMiddleware::class
 ]);


/*
|--------------------------------------------------------------------------
| Register Service Providers
|--------------------------------------------------------------------------

$app->register(App\Providers\CatchAllOptionsRequestsProvider::class);

Oke, kurang lebih seperti itu, silahkan teman-teman bisa mencoba menggunakan Restful API dari aplikasi lain, misalnya seperti Android, Vue JS, React JS dan yang lainnya.

Sampai disini pembahasan tentang cara meng-enable CORS di Lumen. Jika teman-teman ada pertanyaan silahkan bisa memberikan komentar di postingan ini.

Terima Kasih.


Fika Ridaul Maulayya
Full-Stack Developer, Content Creator and CO-Founder SantriKoding.com

Suka dengan tulisan di SantriKoding? Kamu bisa memberikan dukungan dengan berdonasi atau bagikan konten ini di sosial media. Terima kasih atas dukungan Anda!

KEBIJAKAN KOMENTAR

Saat memberikan komenatar silahkan memberikan informasi lengkap tentang error, seperti: screenshot, link kode, dll. Baca aturan komentar kami