Chrome 62
PaymentDetailsModifier artık kullanılabilir
Ödeme isteğinde, müşterinin seçtiği ödeme yöntemine bağlı olarak indirim veya ek ücret sunmak istediğiniz durumlar olabilir.
Bunu başarmak için PaymentDetailsModifier
özelliğini kullanabilirsiniz.
PaymentRequest
oluşturucunun ikinci bağımsız değişkenine modifiers
özelliğini, bir PaymentDetailsModifier
nesnesi dizisiyle birlikte ekleyin. Bu, müşterinin istediği ödeme yöntemine bağlı olarak görüntülü reklam öğelerinin ve toplamın nasıl değiştirilmesi gerektiğini belirten bildirimsel kurallardır.
Aşağıdaki örnekte, bir kullanıcıdan kredi kartıyla ödeme yapmayı tercih ettiği için 3 ABD doları işlem ücreti alınacağını nasıl bildirdiğiniz gösterilmektedir.
let methods = [{
supportedMethods: 'basic-card',
data: {
supportedNetworks: ['visa', 'mastercard']
supportedTypes: ['credit', 'debit']
}
}];
let details = {
displayItems: [{
label: 'T-shirt',
amount: { currency: 'USD', value: '68.00' }
}],
total: {
label: 'Total price',
amount: { currency: 'USD', value: '68.00' }
},
modifiers: [{
supportedMethods: 'basic-card',
data: {
supportedTypes: ['credit']
},
additionalDisplayItems: [{
label: 'Processing fee',
amount: { currency: 'USD', value: '3.00' }
}],
total: {
label: 'Credit card price',
amount: {currency: ‘USD’, value: ‘71.00’}}
}]
};
let options = {};
let request = new PaymentRequest(methods, details, options);
Gerçek Ödeme İsteği sayfasında, kullanıcılar kredi kartıyla ödeme yapmaya karar vermeden önce, toplam fiyatı 71,00 ABD doları olan 3 ABD doları ücret içeren "İşlem ücreti" adlı bir ek görüntülü reklam öğesi görür.
PaymentDetailsModifier
şu parametreleri içerir:
Mülk adı | |
---|---|
supportedMethods | Bu kuralın hangi ödeme yönteminin geçerli olduğunu belirtin. |
additionalDisplayItems |
İndirim veya ekstra ödeme eklemek istediğiniz ilave görüntülü reklam öğeleri. |
total | additionalDisplayItems eklendikten sonraki toplam fiyat. |
data | basic-card ödemesinde bu, supportedTypes ile belirli kart türlerini filtrelemenin bir yolu olarak kullanılır. Aksi takdirde, bu parametrenin kullanımı ödeme yöntemine (ödeme uygulaması) bağlıdır. Her ödeme yönteminin sağladığı belgeleri inceleyin. |
modifiers
için toplam fiyat sabit olamayacağı ve dinamik değişiklik gerektirdiği için gönderim seçenekleri olduğunda işler biraz karışabilir.
Bunu sağlamak için shippingaddresschange
ve shippingoptionchange
etkinliğinde modifiers
mülkünün additionalDisplayItems
ve total
değerlerini PaymentDetails
nesnesinin displayItems
özelliğinde yaptığınız gibi değiştirirsiniz.
supportedMethods özelliği artık bir dize alıyor
PaymentMethodData
nesnesindeki (PaymentRequest
oluşturucunun ilk bağımsız değişkeni) supportedMethods
özelliği, ödeme yöntemi belirten bir dize dizisi alıyor. Şu anda tek bir dizeyi bağımsız değişken olarak alıyor.
Dizi verme işleminin şimdilik devam edeceğini unutmayın.
Eskidir. Şu an için çalışmaya devam eder.
var methodData = [{ supportedMethods: ['basic-card'], data: { supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb', 'diners', 'discover', 'mir', 'unionpay'] } }, { supportedMethods: ['https://bobpay.xyz'] }];
Yeni-yeni yöntem.
var methodData = [{ supportedMethods: 'basic-card', data: { supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb', 'diners', 'discover', 'mir', 'unionpay'] } }, { supportedMethods: 'https://bobpay.xyz' }];
Chrome 61
Temel kartta supportedTypes mevcut
supportedMethods
"basic-card
" olduğunda artık "credit
", "debit
" ve "prepaid
" arasında hangi tür kartların desteklendiğini belirtmek için supportedTypes
girebilirsiniz.
var methodData = [{
supportedMethods: 'basic-card',
data: {
supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
'diners', 'discover', 'mir', 'unionpay']
supportedTypes: ['credit', 'debit', 'prepaid']
}
}];
Bu filtreleme, kaynağın nereden alındığına bağlı olarak mükemmel çalışmayabilir.
Chrome 57
PaymentRequest artık iframe'lerin içinde kullanılabilir
Ödeme İsteği API'si artık iframe
öğesine allowpaymentrequest
özelliği eklenerek bir iframe
içinden çağrılabilir.
<iframe src="/totally/fake/url" allowpaymentrequest></iframe>
PaymentMethodData "temel kartı" destekler
PaymentRequest()
oluşturucunun ilk bağımsız değişkeni, bir ödeme yöntemi verileri dizisidir. PaymentMethodData
biçimi bu sürümde değiştirildi.
Eskidir. Şu an için çalışmaya devam eder.
var methodData = [{ supportedMethods: ['visa', 'mastercard', 'amex', 'jcb'] }]; var request = new PaymentRequest(methodData, details, options);
Yeni - yeni yapı.
var methodData = [{ supportedMethods: ['basic-card'], data: { supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb', 'diners', 'discover', 'mir', 'unionpay'] } }]; var request = new PaymentRequest(methodData, details, options);
data
özelliğinin biçimi, supportedMethods
içindeki değere ve Temel Kart spesifikasyonuna dayanır. Spesifikasyonda credit
, debit
veya prepaid
kabul eden supportedTypes
özelliği bulunduğunu ancak Chrome 57'nin bu özelliği yoksaydığını ve supoprtedNetworks
içindeki tüm değerleri kredi kartı olarak değerlendirdiğini unutmayın.
var methodData = [{
supportedMethods: ['basic-card'],
data: {
supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
'diners', 'discover', 'mir', 'unionpay'],
supportedTypes: ['credit'] <= not available
}
}];
Chrome 56
beklemede
Geliştiriciler, ödeme öğesi bilgilerinin bir parçası olarak fiyatın henüz tam olarak belirlenmediğini belirtmek için pending
ekleyebilirler. pending
alanında boole değeri kabul edilir.
{
label: "State tax",
amount: { currency: "USD", value : "5.00" },
pending: true
},
Bu, genellikle gönderim adresi veya gönderim seçeneklerinin seçimine bağlı olan gönderim bedeli veya vergi tutarları gibi satır öğelerini göstermek için kullanılır. Chrome, kullanıcı arayüzünde ödeme isteğiyle ilgili beklemedeki alanları gösterir.
requestPayerName
Geliştiriciler, gönderim seçeneğinin (PaymentRequest
için üçüncü bağımsız değişken) bir parçası olarak, ödeme yapanın adını gönderim adresi bilgilerinden ayrı olarak istemek için requestPayerName
öğesini ekleyebilir.
requestPayerName
, boole değeri kabul eder.
shippingType
Geliştiriciler, gönderim seçeneğinin bir parçası olarak (PaymentRequest
için üçüncü bağımsız değişken), kullanıcı arayüzünde "gönderim" yerine "teslimat" veya "teslim alma" ifadelerini göstermesini istemek için artık shippingType
öğesini ekleyebilir.
shippingType
; shipping
(varsayılan), delivery
veya pickup
dizelerini kabul eder.
PaymentResponse ve PaymentAddress için kullanılabilen serileştirici işlevleri
PaymentResponse nesnesi ve PaymentAddress
nesnesi artık JSON ile serileştirilebilir. Geliştiriciler toJSON()
işlevini çağırarak bir öğeyi JSON nesnesine dönüştürebilir ve hantal toDict()
işlevleri oluşturmaktan kaçınabilir.
request.show().then(response => {
let res = response.toJSON();
});
canMakePayment
API kullanılabilirliğine ek olarak, Payment Request API'yi çağırmadan önce kullanıcının etkin bir ödeme yöntemi olup olmadığını kontrol edebilirsiniz. Kullanıcılar ödeme kullanıcı arayüzünde yeni bir ödeme yöntemi ekleyebileceklerinden bunun isteğe bağlı olduğunu unutmayın.
let request = new PaymentRequest(methods, details, options);
if (request.canMakePayment) {
request.canMakePayment().then(result => {
if (result) {
// Payment methods are available.
} else {
// Payment methods are not available, but users can still add
// a new payment method in Payment UI.
}
}).catch(error => {
// Unable to determine.
});
}