Skip to content

Latest commit

 

History

History
238 lines (170 loc) · 21.5 KB

010 интеграция email.md

File metadata and controls

238 lines (170 loc) · 21.5 KB

юkassa / документация / http, cms, email⬅️, тестирование, решение ошибок, демо, 54-ФЗ

🎓 Интеграция оплаты в ЮKassa. Схема: E-mail

Это пошаговая инструкция как сделать платежную форму, разместить ее на вашем сайте и начать принимать платежи через сервис ЮKassa. Потребуется порядка 15 минут, чтобы ознакомиться с инструкцией и выполнить все необходимые действия (обратите внимание, что для выполнения этой инструкции нужно, чтобы тот, кто ее будет выполнять, минимально понимал язык html). Кроме того, в конце страницы есть пример, какое письмо об оплате вы будете получать, какие поля будут видны в письме. А также ответы на популярные вопросы.

Требования к интеграции

  • Зарегистрируйтесь в ЮKassa (доступно только для юридических лиц и ИП);
  • Получите от нас идентификаторы shopId и scid;
  • Отредактируйте пример формы (см.ниже) прописав в ней полученные shopId и scid, разместите код на одной из страниц своего сайта или на новой странице, выполните тестовый платеж.

Получение shopId и scid

Для начала интеграции необходимы shopId и scid. Вы получите их в письме после того, как менеджер ЮKassa выполнит процесс вашей регистрации:

shopId (идентификатор магазина) = 100500
scid (номер витрины) = 555777
это пример идентификаторов из письма

54фз

Если вы используете платежную форму и вам надо передавать данные по 54фз, посмотрите необходимые примеры как это сделать.

Шаг 1. Платежная форма

Ниже представлены примеры платежных форм в html формате (стандартная и для wix.com). Скопируйте код нужной вам формы от начала и до конца. Пропишите в форме ваши shopid и scid (в примерах указано где это нужно сделать). Вставьте созданный код в html-документ или добавьте на страницу своего сайта. Минимальная платежная форма готова. 🐾

Выбор редактора (программа для редактирования html), с помощью которого вы делаете платежную форму, на ваше усмотрение. Это может быть встроенный редактор в системе вашего сайта (wix.com, ucoz.ru), либо один из известных вам текстовых редакторов (блокнот, notepad++ и т.д.); пожалуйста, не пользуйтесь программой MS Word, т.к. она заменяет знак кавычек на неподдерживаемую "ёлочку" в html. Если требуется собственный дизайн платежной формы, обратитесь к специалистам по дизайну или верстке html. С нашей стороны нет никаких ограничений, Вы можете модифицировать текущие примеры под свои требования.

Код стандартной платёжной формы

<!-- Пример заголовков на странице оплаты, которые вы можете показать пользователю ======= -->
    <h2>Пример платежной страницы для оплаты товара</h2>
    <div>Стоимость товара: 1 руб.</div><hr>
    <h4>Параметры заказа</h4>

<!-- Эти поля обязательные, их нельзя удалять из платежной формы =============================
     в полях value="" в строках shopid и scid пропишите требуемые значения                 -->
    <form action="https://yoomoney.ru/eshop.xml" method="post">
    <input required name="shopId" value="впишите-сюда-значение-своего-shopId" type="hidden"/>
    <input required name="scid" value="впишите-сюда-значение-своего-scid" type="hidden"/>
    <input required name="sum" value="" type="number" min="1" placeholder="Укажите сумму платежа"><br>
    <!-- сумма name="sum" указана для примера (1 руб.); напишите свое значение             -->

<!-- Поле name="customerNumber" обязательное, его удалить нельзя. ============================
     Вы можете назвать его по своему, например вместо "Номер телефона" написать "Идентификатор
     заказа", "Номер клиента", "Номер заказа" и т.д.;
     т.е. поле может иметь ваше название, но name="customerNumber" переименовывать нельзя.
     Внимание! Значение поля может быть только однострочным! Если вы сделаете его многострочным,
     то платеж будет завершаться с ошибкой "Платеж не прошел из-за технической ошибки".    -->
     Номер телефона (<font color="red">*</font>):<br>
     <input required name="customerNumber" value="" size="64"/><br>

<!-- Любые из этих групп строк можно убрать (если они не нужны) или переименовать ============
     например, вместо "Имя покупателя" написать "Цвет глаз" или "Номер автомобиля".
     Важный момент: то, как вы назовёте поля, это будет видно только в вашей платежной форме,
     названия полей не попадут в письмо об оплате (см. ниже информацию о письме), в письмо
     попадут только значения полей.						           -->
     Имя покупателя:<br>	
     <input name="custName" value="" size="64"/><br>

     Адрес доставки:<br>	
     <input name="custAddr" value="" size="64"/><br>

     Email покупателя:<br>	
     <input name="custEmail" value="" size="64"/><br>
	
     Комментарии к заказу:<br>	
     <textarea name="orderDetails" value="" rows="5" cols="64" wrap="soft"></textarea><br>	

<!-- Кнопку "Оплатить", можно назвать по своему, например value="Оплатить за курсы вождения"
     или value="Оплатить подписку на журнал" и т.д.                                        -->
     <input type="submit" value="Оплатить">	
     </form>

Код формы для сайтов на Wix

В wix работает только email схема. Чтобы вставить в Wix нашу форму, надо, чтобы в форме был тег _blank, например

<form target="_blank">

Editing HTML To Your Wix

- Go to “Widgets” > HTML
- Select your HTML widget of choice: Facebook, Viemo, Google Calender etc
- Click “Settings”
- Paste your embed code into “Insert HTML code” box (right text box of the HTML widget)
**Tip: Be sure to delete any existing code.
- Update Width & Height: If you don’t have the measures, look for width=”XX” / height=”XX” inside your code. For example, “width=334″ . Then add 334 to the width field
- Click “OK”
- To view your HTML Widget you must save your document. Go to “My Account” roll over your Wix and click view.
<!-- Пример заголовков на странице оплаты, которые вы можете показать пользователю ======= -->
    <h2>Пример платежной страницы для оплаты товара</h2>
    <div>Стоимость товара: 1 руб.</div><hr>
    <h4>Детали заказа</h4>

<!-- Эти поля обязательные, их нельзя удалять из платежной формы =============================
     в полях value="" в строках shopid и scid пропишите требуемые значения                 -->
    <form action="https://yoomoney.ru/eshop.xml" method="post" target="_blank">
    <input required name="shopId" value="впишите-сюда-значение-своего-shopId" type="hidden"/>
    <input required name="scid" value="впишите-сюда-значение-своего-scid" type="hidden"/>
    <input required name="sum" value="" type="number" min="1" placeholder="Укажите сумму платежа"><br>
    <!-- сумма name="sum" указана для примера (1 руб.); напишите свое значение             -->
    <br>

<!-- Поле name="customerNumber" обязательное, его удалить нельзя. ============================
     Вы можете назвать его по своему, например вместо "Номер телефона" написать "Идентификатор
     заказа", "Номер клиента", "Номер заказа" и т.д.;
     т.е. поле может иметь ваше название, но name="customerNumber" переименовывать нельзя.
     Внимание! Значение поля может быть только однострочным! Если вы сделаете его многострочным,
     то платеж будет завершаться с ошибкой "Платеж не прошел из-за технической ошибки".    -->
     Номер телефона (<font color="red">*</font>):<br>
     <input required name="customerNumber" value="" size="64"/><br>

<!-- Любые из этих групп строк можно убрать (если они не нужны) или переименовать ============
     например, вместо "Имя покупателя" написать "Цвет глаз" или "Номер автомобиля".
     Важный момент: то, как вы назовёте поля, это будет видно только в вашей платежной форме,
     названия полей не попадут в письмо об оплате (см. ниже информацию о письме), в письмо
     попадут только значения полей.						           -->
     Имя покупателя:<br>	
     <input name="custName" value="" size="64"/><br>

     Адрес доставки:<br>	
     <input name="custAddr" value="" size="64"/><br>

     Email покупателя:<br>	
     <input name="custEmail" value="" size="64"/><br>
	
     Комментарии к заказу:<br>	
     <textarea name="orderDetails" value="" rows="5" cols="64" wrap="soft"></textarea><br>	

<!-- Кнопку "Оплатить", можно назвать по своему, например value="Оплатить за курсы вождения"
     или value="Оплатить подписку на журнал" и т.д.                                        -->
     <input type="submit" value="Оплатить">	
     </form>

Шаг 2. Письмо об оплате

Пример письма, которое вы получите, после того, как ваш плательщик оплатил заказ. Обратите внимание, что в письмо попадут значения следующих полей:

  • sum, customerNumber (обязательно);
  • custName, custAddr, custEmail и orderDetails (если их не использовать, то в письме эти поля не будут заполнены).

В платежной форме поля customerNumber, custName, custAddr, custEmail и orderDetails можно называть по своему, но в письме они будут иметь то название поля, которое прописано в нашем шаблоне (см. пример ниже, где показано какое поле в каком месте шаблона будет отображено и как называется это строка). Шаблон письма изменить нельзя, он единый для всех. Например, в своей форме вы сделаете так: Номер автомобиля: <input name="custName" value="">, пользователь заполнит это поле значением: А100500БВ. В письме вы увидите это значение в строке: Ф.И.О.: А100500БВ.

От: ЮKassa Demo Payment Center <[email protected]>
Кому: email адрес, который вы указали в своей технической анкете
Тема: ЮMoney payment for название-вашей-организации #56

--------------------------------- Тело письма: ---------------------------------
Извещение № 56

Получатель: название-вашей-организации

Время платежа: 23.10.2016 18:24:09
Сумма: 1000.00 RUB
Номер транзакции: 2000000942259
Идентификатор клиента: (то, что плательщик напишет в поле name="customerNumber")
Номер в магазине: 2000000942259

Заполнено плательщиком в платежной форме магазина:

Ф.И.О.: значение-поля-custName-из-платежной-формы
Адрес доставки: значение-поля-custAddr-из-платежной-формы
E-mail: значение-поля-custEmail-из-платежной-формы

Содержание заказа:

значение-поля-orderDetails-из-платежной-формы
-------------------------------------------------------------------------------

Шаг 3. Тестирование

Как только вы включите нашу систему оплаты на своем сайте, рекомендуем провести тестовый платеж методом ЮMoney или картой. Внимание! Тест можно провести только реальными деньгами через любой, подключенный вашему магазину метод платежа. Для того, чтобы убедиться, что все работает, выполните платеж на 1 рубль.

Ошибки при тестировании

Если при тестировании вы получили ошибку выполните следующие шаги:

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

FAQ

// Выставление счетов

Q: Хочу, чтобы посетители моего сайта получали на email письмо, в котором будет ссылка на оплату и они могли в удобное им время оплатить счет.

A: Обратите внимание на наш сервис выставления счетов https://yookassa.ru/docs/support/merchant/payments/invoicing. Оплатить заказ получатель счёта может прямо из письма, выбрав удобный способ: из электронного кошелька, с банковской карты, через интернет-банкинг, со счёта мобильного телефона или наличными — через терминалы, банкоматы и другие точки оплаты.

// Дизайн формы оплаты

Q: При подключении я сообщил, что у меня нет технического специалиста и требуется, чтобы техподдержка ЮKassa помогла мне сделать платежную форму, интегрировать ее в платежный сценарий моего сайта, выполнила форму оплаты в необходимой мне стилистике и дизайне.

A: Если у вас нет своего специалиста, то для реализации формы оплаты на вашем сайте вам нужно обратиться к специалисту по разработке сайтов. Подобных услуг мы не оказываем.

// Цифровая подпись. В реестрах файл smime.p7s

Q: Мы стали получать от вас реестры платежей и в этих письмах есть вложение smime.p7s. Что это и как его открыть?

A: Smime.p7s - это электронная цифровая подпись. При отправке реестров наша система автоматически подписывает письма с реестрами такой подписью. Например, в Outlook, в письме с реестром, вы увидите значок цифровая подпись в outlook инонка, нажав дважды на который можно просмотреть содержимое цифровой подписи

цифровая подпись в outlook

К сожалению, не все почтовые программы и вебинтерфейсы поддерживают просмотр цифровой подписи. Просмотреть содержимое цифровой подписи можно с помощью утилиты openssl:
openssl pkcs7 -in smime.p7s -text -inform DER -print_certs -noout

// Название магазина в SMS

Q: В смс написано YOOM.GOODS. Можно ли там поменять на MY.COMPANY.NAME? пример имени магазина в sms

A: Да, это возможно. Название будет верхним регистром латинскими буквами. Обратитесь c этим вопросом к вашему персональному менеджеру.