# Hazır Form Paynet ile ödeme almanın en kolay yolu Paynet.js’i ödeme formunuza eklemektir. Paynet.js sizin için kart bilgilerinin güvenliğini sağlar, tüm doğrulamaları yapar. Hassas kart bilgileri hiçbir şekilde güvensiz ortamlarda dolaşmaz. Siz sadece ödemenizi alırsınız. #### Paynet.js ile ödeme almak iki aşamadan oluşur: * [x] Paynet.js’i web uygulamanızdaki formunuza yerleştirirsiniz. Bu script sayfanıza bir ödeme butonu yerleştirir. * [x] Müşterileriniz ödeme butonuna basıp, kart bilgilerini girip, ödemeyi tamamladıklarında sizin sunucunuza sadece **token\_id** bilgisi gönderilir. Sizde sunucu tarafında bu ödemeyi onaylarsınız. {% hint style="warning" %} Hazır form methodu ile script'i sayfanıza eklemek için Publishable key, ödeme işlemini sunucu tarafında onaylamak için de secret key'e ihtiyacınız vardır. [Bakınız.](https://doc.paynet.com.tr/authentication#secret-key) {% endhint %} | Sistem | URL | | ---------------- | ------------------------------------------------------ | | **Canlı Sistem** | | | **Test Sistemi** | | ## **1.Adım: Paynet.js’i sayfanıza ekleme** Paynet.js’i aşağıdaki şekilde sayfanıza ekleyebilirsiniz. ```markup
``` Eklenen bu script ile sayfanızda **data-button\_label**’da belirtilen metin ile “*Ödeme yap*” butonu çıkar. Müşterileriniz bu butona basarak kredi kartı bilgilerini girip ödeme işlemini yapabilirler. Ödeme işlemi tamamlandığında Paynet.js “**token\_id**” ve “**session\_id**” parametrelerini formunuza hidden olarak ekler ve formunuzdaki diğer input'lar ile beraber **action** adresine formu post eder. Post işleminden sonra formunuza eklediğiniz diğer parametreler ile beraber **session\_id** ve **token\_id** bilgisi sunucunuza ulaşır. Bu değerler ile ödemeyi onaylayabilirsiniz. #### Paynet.js Parametreleri | Data attribute | Zorunlu | Açıklama | | -------------------------------- | ------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | **data-key** | Evet | Publishable key'iniz. | | **data-amount** | Evet | Kredi kartından çekilecek tutar. Ödeme tutarının yüz ile çarpılmış hali. “10.00 TL” => “1000” olarak gönderilmeli. | | **data-name** | Hayır | Ödeme sırasında görünecek başlık. | | **data-description** | Hayır | Ödeme sırasında görünecek işlem açıklaması. Paynet API İşlem listesinde ve Paynet işlem listesinde burada gönderdiğiniz açıklama gösterilir. | | **data-image** | Hayır | Hazır ödeme formunda gösterilecek logo. | | **data-agent** | Hayır | Eğer alt bayileriniz var ise işlemin hangi bayi üzerinden geldiğini bu alana bayi kodu göndererek yapabilirsiniz. | | **data-add\_commission\_amount** | Hayır | Komisyon tutarının ödeme tutarına eklenip eklenmeyeceği belirlenir. True olduğunda komisyon tutarı kredi kartından çekilecek tutara eklenir. | | **data-no\_instalment** | Hayır | true/false, default: false. True olduğunda Taksitli çekime izin vermez, tek çekim yapılır. | | **data-ratio\_code** | Hayır | Paynet.com.tr yönetim ekranlarında “API oran tanımları” sayfasından tanımlayabileceğiniz oran tablolarının “oran kodunu” bu alanda gönderebilirsiniz. Gönderdiğiniz oran koduna ait oran tablosu üzerinden komisyon hesaplaması yapılır. Bu sayede API üzerinden istediğiniz oranlar ile işlem yapabilirsiniz. | | **data-reference\_no** | Hayır | Ödeme işleminin ilişkili olduğu referans numarası. Tekil (unique) bir veri olmalı. ( örn: sipariş numarası ) | | **data-show\_tds\_error** | Hayır | Bankanın 3D sayfasında hata alması durumunda bunu direkt müşterinize göstermek isterseniz "true", onaylama adımında göstermek isterseniz "false". | | **data-invoice\_no** | Hayır | Düzenli ödeme fatura numarası. | | **data-subscription\_id** | Hayır | Düzenli ödeme kodu, mevcut bir düzenli ödemenize manuel ödeme almak istediğinizde invoice\_no ile beraber kullanılır. | | **data-save\_card** | Hayır | Ödeme işlemi ile birlikte kredi kart numarasının da saklanması istiyorsanız bu parametreyi true yollayabilirsiniz. Kart saklama işlemi yapıyorsanız card\_desc zorunlu, card\_owner\_id ya da user\_unique\_id değerlerinden en az birini göndermeniz zorunlu. | | **data-card\_owner\_id** | Hayır | İlk defa kart saklama yapıldıktan sonra, Paynet tarafından user\_unique\_id’ye göre oluşturulan kart sahibinin benzersiz bilgisi. Bir sonraki kart saklama ve karttan ödeme alma işlemlerinde bu değer kullanılır. | | **data-user\_unique\_id** | Hayır | Üye iş yeri tarafından verilen kullanıcıya özgü benzersiz id. İlk defa kart saklama yapılıyorsa zorunlu. İlk kart saklama tamamlandıktan sonra Paynet tarafından bu kullanıcıya benzersiz bir değer atanır( card\_owner\_id). Bu değeri kendi sisteminizde kullanıcınız ile ilişkilendirerek saklamalısınız. Daha sonra bu kullanıcıya yapılan kart saklama işlemlerinde user\_unique\_id yerine Paynet tarafından verilen card\_owner\_id değişkenini kullanmalısınız. | | **data-installments** | Hayır | Eğer müşterinize sadece belirli taksitler ile alış veriş yapmasına izin vermek istiyorsanız, virgül ile ayırarak izinli taksit bilgisini gönderebilirsiniz. 0,3,4,6 gibi | | **data-tds\_required** | Hayır |

true/false, Default: true
False : Eğer işlem yapılacak POS 3D’siz işlemi destekliyor ise, kullanıcının 3D’siz de işlem yapmasına izin verir. True: Eğer işlem yapılacak POS 3D’siz işlemi destekliyor ise, kullanıcının 3D’siz de işlem yapmasını engeller.

| | **data-merge\_option** | Hayır | Bu alanla ilgili daha detaylı bilgi için lütfen destek ekibimiz ile iletişime geçiniz. | | **data-pos\_type** | Hayır | Bu alanla ilgili daha detaylı bilgi için lütfen destek ekibimiz ile iletişime geçiniz. | | **data-ratio\_code\_method** | Hayır | Bu alanla ilgili daha detaylı bilgi için lütfen destek ekibimiz ile iletişime geçiniz. | | **data-payment\_source** | Hayır | Bu alanla ilgili daha detaylı bilgi için lütfen destek ekibimiz ile iletişime geçiniz. | {% hint style="warning" %} **data-amount** parametresi ile karttan çekilecek tutarı 100 ile çarpılmış ve ondalık ayracı olmadan göndermelisiniz. {% endhint %} ## 2. Adım: **Ödemeyi onaylama** Paynet.js tarafından form action sayfanıza post edilen **token\_id** ve **session\_id** değerlerini kullanarak ödemeyi onaylamanız gerekmektedir. Ödeme onaylama servisi ile daha detaylı bilgi için [tıklayınız](https://doc.paynet.com.tr/servisler/islem/odeme-onaylama). {% hint style="danger" %} Ödeme onaylama servisini başarılı şekilde çalıştırmazsanız kredi kartından tahsilat işlemi yapılmaz. {% endhint %} {% content-ref url="../servisler/islem/odeme-onaylama" %} [odeme-onaylama](https://doc.paynet.com.tr/servisler/islem/odeme-onaylama) {% endcontent-ref %} ## Paynet.js method ve eventler Paynet.js javascript kütüphanesi içerisinde aşağıdaki evet ve methodları uygulamanızı özelleştirmek için kullanabilirsiniz. ### Paynet.onPaymentClick Sayfanıza eklenen ödeme butonuna tıklama sonrasında uygulamanızın ihtiyaçlarına yönelik kredi kartı formu açılmadan önce kontrol etmenize olanak sağlayan event. Aşağıdaki şekilde kullanabilirsiniz. ```javascript Paynet.onPaymentClick(function () { if (koşul) { /// do something return true; } else{ alert("Uyarı"); return false; } }); ``` {% hint style="info" %} Geri dönüş değeri "**true**" dönmeniz durumunda ödeme formu açılır ve akış devam eder. "**false**" dönmeniz durumunda ödeme formu açılmaz ve akış sonlanır. {% endhint %} ### **Paynet.updateAmount** Bu method ile "**data-amount**" ile belirtiğiniz kredi kartından çekilecek tutarı ve "**data-ratio\_code**" ile belirtiğiniz oran tablosunu güncelleyebilirsiniz. Aşağıdaki şekilde kullanabilirsiniz. ```javascript Paynet.updateAmount(amount); Paynet.updateAmount(amount,ratioCode); ``` ### Paynet.updateAddCommToAmount Bu parametre ile "data-add\_commission\_amount" ile belirtiğiniz komisyonun kredi kartından çekilecek tutara eklenip/eklenmeyeceğini güncelleyebilirsini. ```javascript Paynet.updateAddCommToAmount(true); Paynet.updateAddCommToAmount(false); ```