Embedded Integration

the embed sdk allows you to easily and quickly embed our checkout and subscription solution in any website the processing flow of the transaction in this mode, in the case of checkout, is as follows creation the insertion of the embed starts when creating the checkout or the subscription via api at this point, it is necessary to add within the options node the domain and embed attributes "options" { "embed" true, "domain" "domainofyoursite com" } sdk implementation version the latest version of the sdk is 1 0 23 insert in the site dynamically in the body load our javascript library on your site creation & events the payment modal (both for checkout and subscriptions) can be opened using the mobbex button or through the code itself in both situations, it is necessary to define some properties and render the corresponding objects html document inside the html body where the modal is going to be inserted, it is necessary to define a div with the id property according to the type of opening to be used mobbex button code opening javascript it is necessary to define a variable that contains all the event handlers for the modal its structure differs depending on whether it is used for checkout or subscriptions checkout options var options = { id "{id checkout}", type "checkout", onresult (data) => { // onresult is called when the close button is tapped window\ mobbexembed close(); }, onpayment (data) => { console info("payment ", data); }, onopen () => { console info("payment initiated "); }, onclose (cancelled) => { console info(`${cancelled ? "cancelled" "closed"}`); }, onerror (error) => { console error("error ", error); }, }; subscription options var options = { id "{id subscription}", sid "{id subscriber}", type "subscriber source", onresult (data) => { // onresult is called when the close button is tapped window\ mobbexembed close(); }, onpayment (data) => { console info("payment ", data); }, onopen () => { console info("payment initiated "); }, onclose (cancelled) => { console info(`${cancelled ? "cancelled" "closed"}`); }, onerror (error) => { console error("error ", error); }, }; rendering/initialization the rendering or initialization process depends on the type of modal opening it consists of defining a javascript function that will perform the process and is called from the point where the sdk is inserted in the page mobbex button function rendermobbexbutton() { window\ mobbexembed render(options, "#mbbx button"); } code opening function initmobbexpayment() { var mbbxbutton = window\ mobbexembed init(options); mbbxbutton open(); } operation result the result of the example operation will be obtained inside the onpayment method of the button { "id" "ks6d18und", "status" { "code" "2", "text" "en espera", "message" "el cupón vence a los 5 días de emitido " } } options the following options can be provided to the mobbex button on rendering or initialization initializers type embedded payment type only accepts 2 options checkout (checkout) or payment source (change payment method for subscribers) id server generated checkout id or subscription id, depending on the type sid subscriber id (for subscriptions only) callbacks onpayment (data) => { } onerror (error) => { } onopen () => { } onclose (cancelled) => { } the onclose method will be called when closing the payment modal the cancelled variable will be true or false depending on whether the modal has been closed before or after the operation, respectively the onpayment method will be called when an operation is processed, independently of the onclose method, and will contain within the data variable all the information related to the status of such operation customization button javascript object with the following options { "text" "pagar con mobbex", "image" "https //res mobbex com/images/sources/mobbex png", "backgroundcolor" "rgb(137,0,255)", "textcolor" "rgb(255, 255, 255)", "textsize" "1rem" } creating embedding service only server side checkouts should be created and only the id or uid generated by mobbex should be shared checkout example this is an example of using the special options in php the creation of the checkout must always be done server side, otherwise your account credentials will be exposed for more examples see the checkout documentation \<?php $request = new httprequest(); $request >seturl('https //api mobbex com/p/checkout'); $request >setmethod(http meth post); $request >setheaders(array( 'cache control' => 'no cache', 'content type' => 'application/json', 'x lang' => 'es', 'x access token' => 'd31f0721 2f85 44e7 bcc6 15e19d1a53cc', 'x api key' => 'zj8lftbx6ba8d611e9io13fdzawj0qmko1hn1yij' )); $request >setbody('{ "total" 100 2, "currency" "ars", "reference" "2982 2xtpxlgsawccquyobuv4semlymv0n6ox6moridmw", "description" "descripción de la venta", "items" \[{ "image" "https //www mobbex com/wp content/uploads/2019/03/web logo png", "quantity" 2, "description" "mi producto", "total" 50 }, { "image" "https //www mobbex com/wp content/uploads/2019/03/web logo png", "quantity" 1, "description" "mi otro producto", "total" 50 2 }], "options" { "domain" "midominio com", "embed" true }, "return url" "https //mobbex com/sale/return?session=56789", "webhook" "https //mobbex com/sale/webhook?user=1234" }'); try { $response = $request >send(); echo $response >getbody(); } catch (httpexception $ex) { echo $ex; } ?> subscription example this example shows how to create a subscription so that it can be used with the sdk for embedding note that the same properties are used inside the options node as in the checkout case for more information see the subscriptions documentation \<?php $request = new httprequest(); $request >seturl('https //api mobbex com/p/subscriptions'); $request >setmethod(http meth post); $request >setheaders(array( 'cache control' => 'no cache', 'content type' => 'application/json', 'x lang' => 'es', 'x access token' => 'd31f0721 2f85 44e7 bcc6 15e19d1a53cc', 'x api key' => 'zj8lftbx6ba8d611e9io13fdzawj0qmko1hn1yij' )); $request >setbody('{ "total" 100, "currency" "ars", "setupfee" 0, "type" "dynamic", "name" "suscripción demo", "reference" "2982 2xtpxlgsawccquyobuv4semlymv0n6ox6moridmw", "description" "descripción de la suscripción", "options" { "domain" "midominio com", "embed" true }, "return url" "https //mobbex com/subscription/return?session=56789", "webhook" "https //mobbex com/subscription/webhook?user=1234" }'); try { $response = $request >send(); echo $response >getbody(); } catch (httpexception $ex) { echo $ex; } ?>