Эта страница переведена с помощью Cloud Translation API.

Изменения в API запроса платежей

Eiji Kitamura

Хром 62

Модификатор PaymentDetailsModifier теперь доступен

В запросе платежа бывают случаи, когда вы хотите предоставить скидку или дополнительную плату в зависимости от способа оплаты, выбранного клиентом. PaymentDetailsModifier — это функция, которую вы можете использовать для достижения этой цели.

Добавьте свойство modifiers ко второму аргументу конструктора PaymentRequest вместе с массивом объекта PaymentDetailsModifier , который представляет собой декларативные правила того, как отображаемые элементы и общая сумма должны быть изменены в зависимости от способа оплаты по выбору клиента.

В следующем примере показано, как вы объявляете, что с пользователя будет взиматься плата за обработку в размере 3 долларов США за выбор платежа по кредитной карте.

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);

На фактическом листе запроса платежа, как только вы выберете платеж по кредитной карте, пользователь увидит дополнительный элемент отображения под названием «Плата за обработку» с комиссией в размере 3 долларов США и общей стоимостью 71 доллар США.

PaymentDetailsModifier содержит следующие параметры:

Имя свойства
`supportedMethods`	Укажите, к какому способу оплаты применяется это правило.
`additionalDisplayItems`	Дополнительные элементы отображения, к которым вы хотели бы добавить скидки или дополнительные сборы.
`total`	Общая цена после добавления дополнительныхDisplayItems.
`data`	Для оплаты `basic-card` это будет использоваться как способ фильтрации определенных типов карт с помощью `supportedTypes` . В противном случае использование этого параметра зависит от способа оплаты (платежного приложения). См. документацию, предоставляемую каждым способом оплаты.

Когда есть варианты доставки, все становится немного сложнее, потому что общая цена modifiers не может быть статичной и требует динамической модификации.

Для этого вы измените additionalDisplayItems и total свойства modifiers при изменении shippingaddresschange и события shippingoptionchange так же, как вы это делаете для свойства displayItems объекта PaymentDetails .

Свойство supportMethods теперь принимает строку

Свойство supportedMethods в объекте PaymentMethodData (первый аргумент конструктора PaymentRequest ) принимает массив строк, указывающий способ оплаты. Теперь в качестве аргумента принимает одну строку.

Обратите внимание, что предоставление массива пока будет продолжать работать.

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: ['https://bobpay.xyz']
}];

Делать

Новое – новый путь.

var methodData = [{
     supportedMethods: 'basic-card',
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: 'https://bobpay.xyz'
}];

Хром 61

Доступны поддерживаемые типы в базовой карте

Если для supportedMethods установлено значение « basic-card », теперь вы можете указать supportedTypes , чтобы указать, какой тип карт поддерживается: « credit », « debit » и « prepaid ».

var methodData = [{
 supportedMethods: 'basic-card',
 data: {
   supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
     'diners', 'discover', 'mir', 'unionpay']
   supportedTypes: ['credit', 'debit', 'prepaid']
 }
}];

Обязательно дважды проверьте тип карты на своем платежном шлюзе, поскольку эта фильтрация может работать не идеально в зависимости от того, откуда она получена.

Хром 57

PaymentRequest теперь доступен внутри iframe

API запроса платежа теперь можно вызвать из iframe , добавив allowpaymentrequest к элементу iframe .

<iframe src="/totally/fake/url" allowpaymentrequest></iframe>

PaymentMethodData поддерживает «базовую карту»

Первый аргумент конструктора PaymentRequest() — это массив данных метода оплаты. В этом выпуске формат PaymentMethodData был изменен.

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['visa', 'mastercard', 'amex', 'jcb']
}];
var request = new PaymentRequest(methodData, details, options);

Делать

Новое – новая структура.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}];
var request = new PaymentRequest(methodData, details, options);

Формат свойства data зависит от значения в supportedMethods и основан на спецификации базовой карты . Обратите внимание, что спецификация включает в себя supportedTypes , которые принимают credit , debit или prepaid , но Chrome 57 игнорирует это свойство и рассматривает любые значения в supoprtedNetworks как кредитные карты.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay'],
       supportedTypes: ['credit'] <= not available
     }
}];

Хром 56

в ожидании

В информацию о платежных элементах разработчики могут добавить pending , чтобы указать, что цена еще не полностью определена. Поле pending принимает логическое значение.

    {
      label: "State tax",
      amount: { currency: "USD", value : "5.00" },
      pending: true
    },

Обычно это используется для отображения таких позиций, как стоимость доставки или суммы налога, которые зависят от выбора адреса доставки или вариантов доставки. Chrome указывает ожидающие поля в пользовательском интерфейсе для запроса платежа.

запросИмяПайера

В рамках опции доставки (третий аргумент PaymentRequest ) разработчики теперь могут добавить requestPayerName , чтобы запрашивать имя плательщика отдельно от информации об адресе доставки. requestPayerName принимает логическое значение.

Тип доставки

В рамках параметра доставки (третий аргумент PaymentRequest ) разработчики теперь могут добавить shippingType , чтобы в пользовательском интерфейсе отображалось «доставка» или «самовывоз» вместо «доставка». shippingType принимает строки shipping (по умолчанию), delivery или pickup .

ShippingType = 'самовывоз' — Тип доставки="самовывоз"

Функции сериализатора, доступные для PaymentResponse и PaymentAddress.

Объект PaymentResponse и объект PaymentAddress теперь сериализуются в формате JSON. Разработчики могут преобразовать его в объект JSON, вызвав функцию toJSON() и избегая создания громоздких функций toDict() .

request.show().then(response => {
     let res = response.toJSON();
});

canMakePayment

Помимо доступности API, вы можете проверить, есть ли у пользователя активный способ оплаты, прежде чем вызывать API запроса платежа. Помните, что это необязательно, поскольку пользователи все равно могут добавить новый способ оплаты в платежном интерфейсе.

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.
     });
}

Eiji Kitamura

Хром 62

Модификатор PaymentDetailsModifier теперь доступен

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);

PaymentDetailsModifier содержит следующие параметры:

Имя свойства
`supportedMethods`	Укажите, к какому способу оплаты применяется это правило.
`additionalDisplayItems`	Дополнительные элементы отображения, к которым вы хотели бы добавить скидки или дополнительные сборы.
`total`	Общая цена после добавления дополнительныхDisplayItems.
`data`	Для оплаты `basic-card` это будет использоваться как способ фильтрации определенных типов карт с помощью `supportedTypes` . В противном случае использование этого параметра зависит от способа оплаты (платежного приложения). См. документацию, предоставляемую каждым способом оплаты.

Свойство supportMethods теперь принимает строку

Обратите внимание, что предоставление массива пока будет продолжать работать.

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: ['https://bobpay.xyz']
}];

Делать

Новое – новый путь.

var methodData = [{
     supportedMethods: 'basic-card',
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: 'https://bobpay.xyz'
}];

Хром 61

Доступны поддерживаемые типы в базовой карте

var methodData = [{
 supportedMethods: 'basic-card',
 data: {
   supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
     'diners', 'discover', 'mir', 'unionpay']
   supportedTypes: ['credit', 'debit', 'prepaid']
 }
}];

Хром 57

PaymentRequest теперь доступен внутри iframe

API запроса платежа теперь можно вызвать из iframe , добавив allowpaymentrequest к элементу iframe .

<iframe src="/totally/fake/url" allowpaymentrequest></iframe>

PaymentMethodData поддерживает «базовую карту»

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['visa', 'mastercard', 'amex', 'jcb']
}];
var request = new PaymentRequest(methodData, details, options);

Делать

Новое – новая структура.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}];
var request = new PaymentRequest(methodData, details, options);

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay'],
       supportedTypes: ['credit'] <= not available
     }
}];

Хром 56

в ожидании

    {
      label: "State tax",
      amount: { currency: "USD", value : "5.00" },
      pending: true
    },

запросИмяПайера

Тип доставки

Функции сериализатора, доступные для PaymentResponse и PaymentAddress.

request.show().then(response => {
     let res = response.toJSON();
});

canMakePayment

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.
     });
}

Eiji Kitamura

Хром 62

Модификатор PaymentDetailsModifier теперь доступен

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);

PaymentDetailsModifier содержит следующие параметры:

Имя свойства
`supportedMethods`	Укажите, к какому способу оплаты применяется это правило.
`additionalDisplayItems`	Дополнительные элементы отображения, к которым вы хотели бы добавить скидки или дополнительные сборы.
`total`	Общая цена после добавления дополнительныхDisplayItems.
`data`	Для оплаты `basic-card` это будет использоваться как способ фильтрации определенных типов карт с помощью `supportedTypes` . В противном случае использование этого параметра зависит от способа оплаты (платежного приложения). См. документацию, предоставляемую каждым способом оплаты.

Свойство supportMethods теперь принимает строку

Обратите внимание, что предоставление массива пока будет продолжать работать.

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: ['https://bobpay.xyz']
}];

Делать

Новое – новый путь.

var methodData = [{
     supportedMethods: 'basic-card',
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}, {
    supportedMethods: 'https://bobpay.xyz'
}];

Хром 61

Доступны поддерживаемые типы в базовой карте

var methodData = [{
 supportedMethods: 'basic-card',
 data: {
   supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
     'diners', 'discover', 'mir', 'unionpay']
   supportedTypes: ['credit', 'debit', 'prepaid']
 }
}];

Хром 57

PaymentRequest теперь доступен внутри iframe

API запроса платежа теперь можно вызвать из iframe , добавив allowpaymentrequest к элементу iframe .

<iframe src="/totally/fake/url" allowpaymentrequest></iframe>

PaymentMethodData поддерживает «базовую карту»

Первый аргумент конструктора PaymentRequest() — это массив данных о способе оплаты. В этом выпуске формат PaymentMethodData был изменен.

Не

Старый - пока работает.

var methodData = [{
     supportedMethods: ['visa', 'mastercard', 'amex', 'jcb']
}];
var request = new PaymentRequest(methodData, details, options);

Делать

Новое – новая структура.

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay']
     }
}];
var request = new PaymentRequest(methodData, details, options);

var methodData = [{
     supportedMethods: ['basic-card'],
     data: {
       supportedNetworks: ['visa', 'mastercard', 'amex', 'jcb',
         'diners', 'discover', 'mir', 'unionpay'],
       supportedTypes: ['credit'] <= not available
     }
}];

Хром 56

в ожидании

    {
      label: "State tax",
      amount: { currency: "USD", value : "5.00" },
      pending: true
    },

запросИмяПайера

Тип доставки

Функции сериализатора, доступные для PaymentResponse и PaymentAddress.

request.show().then(response => {
     let res = response.toJSON();
});

canMakePayment

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.
     });
}