Apa yang bisa kami bantu?

A. Pendahuluan

Dalam aplikasi web, sering kali kita perlu mengambil data dari domain atau server yang berbeda. Untuk mengatur keamanan akses tersebut digunakan Cross-Origin Resource Sharing (CORS), yaitu aturan yang menentukan siapa saja yang boleh mengakses resource dari luar domain.

Pada layanan Object Storage yang kompatibel dengan Amazon S3, konfigurasi CORS penting agar file seperti gambar atau data dapat diakses oleh aplikasi tanpa terblokir oleh browser. Proses pengaturannya dapat dilakukan dengan mudah menggunakan tools command line seperti S3cmd.

B. Install S3cmd

Apabil Anda belum melakukan instalasi s3cmd maka bisa install terlebih dahulu sesuai panduan yang ada pada Knowledge Base berikut ini Cara Koneksikan Layanan Object Storage NEO Menggunakan S3CMD, DragonDisk, S3 Browser

C. Konfigurasi Cors

1 . Buat file CORS (WAJIB XML) 

nano cors.xml

Isi

<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedHeader>*</AllowedHeader>
        <ExposeHeader>ETag</ExposeHeader>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
    </CORSRule>
</CORSConfiguration>

Berikut ini detailnya

Gambar 3.1 konfigurasi cors

2. Pastikan S3cmd Sudah Terkonfigurasi

Apabila belum silakan jalan:

s3cmd --configure
Enter new values or accept defaults in brackets with Enter.
Refer to user manual for detailed description of all options.

Access key and Secret key are your identifiers for Amazon S3. Leave them empty for using the env variables.
Access Key: xxxxxxxxxxxxxxxxxxxxxxx
Secret Key: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
Default Region [US]: ID

Use "s3.amazonaws.com" for S3 Endpoint and not modify it to the target Amazon S3.
S3 Endpoint [s3.amazonaws.com]: nos.wjv-1.neo.id
Use "%(bucket)s.s3.amazonaws.com" to the target Amazon S3. "%(bucket)s" and "%(location)s" vars can be used 
if the target S3 system supports dns based buckets.
DNS-style bucket+hostname:port template for accessing a bucket [%(bucket)s.s3.amazonaws.com]: 443

Encryption password is used to protect your files from reading
by unauthorized persons while in transfer to S3
Encryption password: xxxxxxxxxxxxxxxx
Path to GPG program [/usr/bin/gpg]:

When using secure HTTPS protocol all communication with Amazon S3 
servers is protected from 3rd party eavesdropping. This method is 
slower than plain HTTP, and can only be proxied with Python 2.7 or newer
Use HTTPS protocol [Yes]: yes

On some networks all internet access must go through a HTTP proxy.
Try setting it here if you can't connect to S3 directly
HTTP Proxy server name:

New settings:
    Access Key: xxxxxxxxxxxxxxxxxxxx
    Secret Key: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
    Default Region: ID
    S3 Endpoint: nos.wjv-1.neo.id
    DNS-style bucket+hostname:port template for accessing a bucket: 443
    Encryption password: xxxxxxxxxxxx
    Path to GPG program: /usr/bin/gpg
    Use HTTPS protocol: True
    HTTP Proxy server name:
    HTTP Proxy server port: 0

Test access with supplied credentials? [Y/n] y
Please wait, attempting to list all buckets...
Success. Your access key and secret key worked fine :-)
Now verifying that encryption works...
Success. Encryption and decryption worked fine :-)
Save settings? [y/N] Y
Configuration saved to '/root/.s3cfg'

 

3. Terapkan CORS ke Bucket

Gunakan perintah berikut:

s3cmd setcors cors.xml s3://nama-bucket
Gambar 3.2 cors ke bucket

4. Pastikan  File Bisa Diakses

s3cmd setacl s3://kbs3cmd/namafile.jpg --acl-public
Gambar 3.3 akses file

5. Verifikasi Konfigurasi

s3cmd info s3://kbs3cmd
Gambar 3.4 verifikasi konfigurasi

6. Tes CORS

curl -i -X OPTIONS https://kbs3cmd.nos.wjv-1.neo.id/gio.jpg \
  -H "Origin: https://example.com" \
  -H "Access-Control-Request-Method: GET"
Gambar 3.5 Tes CORS

7. Untuk melihat CORS + download

curl -i -o test.jpg https://kbs3cmd.nos.wjv-1.neo.id/gio.jpg \
  -H "Origin: https://example.com"
Gambar 3.6 melihat cors dan download

D. Kesimpulan

CORS pada NEO Object Storage berfungsi untuk mengizinkan browser mengakses resource dari domain lain. Dengan konfigurasi melalui S3cmd di layanan Biznet Gio, request seperti GET, POST, dan PUT dapat dilakukan tanpa terblokir, serta preflight (OPTIONS) berjalan dengan benar. Dari hasil pengujian, CORS sudah aktif dan berfungsi normal sehingga storage siap digunakan untuk kebutuhan frontend.

 

Semoga artikel yang telah kami sampaikan dapat membantu Anda. Anda juga dapat menemukan artikel lainnya melalui halaman Knowledge Base Biznet Gio. Jika Anda masih memiliki kendala teknis terkait dengan layanan Biznet GIO, Anda dapat menghubungi kami melalui  email support@biznetgio.com atau dapat melalui live chat di website Biznet GIO, melalui chat WhatsApp dan bisa juga melalui telepon ke nomor (021) 5714567..