Загрузка и исполнение внешнего скрипта javascript на своем сайте
Прилетела давече задача: подключить платежную систему на сайте. «Дело простое» подумал я сначала. Обычно платежные системы сами предоставляют виджет, который остается только вставить на сайт. Но! дьявол как всегда оказался в деталях — а именно сайт сделан на «тильде» — значит никакого PHP. Только javascript+html. Плюс крайне желательно обойтись без «переходов» со страницу на страницу. А именно: пользователь ввел договор, сумму, ФИО, прошла проверка и только после на этой-же странице показалась форма платежной системы.
В принципе всё реализуемо и не сложно. Но! после вставки:
|
1 2 3 4 |
url="https://paymaster.ru/ru-RU/widget/Basic/1?LMI_MERCHANT_ID=884a7a64-3566-4d75-b413-c4c044b58c02&LMI_PAYMENT_AMOUNT="+summ+"&LMI_PAYMENT_DESC="+clientname+" договор "+dognum+"&LMI_CURRENCY=RUB"; $.getScript(url, function(){ console.log("--загрузили платежную систему.."); }); |
браузер стал выдавать ошибку:
Вызов document.write() из асинхронно-загруженного внешнего сценария был проигнорирован.
, и выполнять скрипт откзывался. Как оказалось, создатели виджета вставили в тело скрипта команды вида document.write, что категорически запрещается без перезагрузки страницы. Если бы этот скрипт я просто статически разместил на странице, то всё бы было хорошо. Но нам это не нужно..
Долго думал… Долго Гуглил…
Решение: перед загрузкой скрипта подменить функцию вызова document.write своей «безобидной». В итоге скрипт получился такой:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 |
<div id='payform'> <label for="clientname">ФИО:</label><br/> <input type="text" name="clientname" id="clientname"> <div id="result_clientname"><br/></div><br/> <label for="clientid">№ договора:</label><br/> <input type="text" name="clientid" id="clientid"> <div id="result_clientid"><br/></div><br/> <label for="ammount">Сумма платежа:</label><br/> <input type="number" name="ammount" id="ammount"> <div id="result_ammount"><br/></div><br/> <button id="pay_button_id">Оплатить</button> </div> <script> $(document).ready(function() { function VerifyFormPay(){ $("#clientname").css("border",""); $("#clientid").css("border",""); $("#ammount").css("border",""); $("#result_clientname").html("<br/>"); $("#result_clientid").html("<br/>"); $("#result_ammount").html("<br/>"); res=true; clientname=$("#clientname").val(); if (clientname==""){ $("#clientname").css("border","2px solid red"); $("#result_clientname").html("Это обязательное поле"); res=false; }; dognum=Number($("#clientid").val()); if ((dognum==0)||(isNaN(dognum))){ $("#clientid").css("border","2px solid red"); $("#result_clientid").html("Значение не число"); res=false; }; summ=Number($("#ammount").val()); if ((summ==0)||(isNaN(summ))){ $("#ammount").css("border","2px solid red"); $("#result_ammount").html("Значение не число"); res=false; }; return res; }; $("#pay_button_id").click(function() { if (VerifyFormPay()==true){ $("#payform").html(""); document.write = function(input) { $("#payform").append(input) } url="https://paymaster.ru/ru-RU/widget/Basic/1?LMI_MERCHANT_ID=884a7a64-3566-4d75-b413-c4c044b58c02&LMI_PAYMENT_AMOUNT="+summ+"&LMI_PAYMENT_DESC="+clientname+" договор "+dognum+"&LMI_CURRENCY=RUB"; $.getScript(url, function(){ console.log("--загрузили платежную систему.."); }); }; }); }); </script> |
