{"id":3508,"date":"2021-03-10T16:50:22","date_gmt":"2021-03-10T16:50:22","guid":{"rendered":"https:\/\/documents.openpay.mx\/?p=3508"},"modified":"2022-02-18T16:35:13","modified_gmt":"2022-02-18T16:35:13","slug":"openpay-js","status":"publish","type":"post","link":"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html","title":{"rendered":"Openpay.js"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"3508\" class=\"elementor elementor-3508\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-adf0fb3 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"adf0fb3\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-8379199\" data-id=\"8379199\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-3530be6 elementor-widget elementor-widget-text-editor\" data-id=\"3530be6\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<h2 id=\"tocAnchor-1-1-1\">Intro<\/h2><p><strong>What is Openpay.js?<\/strong><\/p><p>Openpay.js is a Javascript library designed to facilitate the creation of tokens based on credit and debit cards' data retrieved from a web page without passing any information through the source server (the server of the business).<\/p><p><strong>Advantages:<\/strong><\/p><ul><li>It's safe, the card information does not pass through the source server, but is sent directly to Openpay.<\/li><li>It's the fastest and easiest way to integrate our charges module on your web page.<\/li><\/ul><h2 id=\"tocAnchor-1-1-2\">First Steps<\/h2><p>The first step is to add the Openpay.js library to your page as shown below:<\/p><figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">script <\/span><span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\/javascript\"<\/span> <span class=\"na\" style=\"color: #008080;\">src<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"https:\/\/js.openpay.mx\/openpay.v1.min.js\"<\/span><span class=\"p\">&gt;&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">script<\/span><span class=\"p\">&gt;<\/span><\/code><\/pre><\/figure><p><strong>Configuration<\/strong><\/p><p>To use Openpay.js you must configure both the ID of the business and the public key that were assigned to you when you created your account on the sandbox dashboard. With these data, Openpay can identify your operations and can assign your cards and charges.<\/p><p>To configure both parameters use the methods <code><span style=\"color: #e41182;\">OpenPay.setId()<\/span><\/code> and <code><span style=\"color: #e41182;\">OpenPay.setApiKey()<\/span><\/code>, respectively:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">setId<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'MERCHANT_ID'<\/span><span class=\"p\">);<\/span>\n<span class=\"err\">\u200b<\/span><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">setApiKey<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'PUBLIC_API_KEY'<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p><span style=\"font-size: 10pt;\"><em><span style=\"color: #004481;\"><strong>Note:<\/strong><\/span> You can obtain both MERCHANT-ID and the PUBLIC_API_KEY in the dashboard when you log in on your openpay account, in the home page or in your profile page.<\/em><\/span><\/p><p><span style=\"font-size: 10pt;\"><em><span style=\"color: #004481;\"><strong>Recuerda:<\/strong><\/span> You should never use your private key with this library, because the key is visible on the client side.<\/em><\/span><\/p><p><strong>Enable sandbox mode<\/strong><\/p><p>There is a sandbox environment for you to try on your implementation, which is enabled with the method: OpenPay.setSandboxMode ().<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">setSandboxMode<\/span><span class=\"p\">(<\/span><span class=\"nx\">FLAG<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>Parameter <span style=\"color: #e41182;\"><code><span style=\"color: #e41182;\">FLAG<\/span><\/code> <\/span>parameter is a true \/ false flag to enable or disable test mode.<\/p><p>If necessary, you can use the <code><span style=\"color: #e41182;\">OpenPay.getSandboxMode()<\/span><\/code> method to determine the status of the sandbox mode at any time:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">getSandboxMode<\/span><span class=\"p\">();<\/span> <span class=\"c1\">\/\/ TRUE\/FALSE, dependiendo si el modo est\u00e1 activado o no.<\/span><\/code><\/pre><\/figure><p><span style=\"font-size: 10pt;\"><em><span style=\"color: #004481;\"><strong>Note:<\/strong><\/span> The sandbox environment has the same features as production, but it only allows the use of certain card numbers, chosen with testing purposes more information on the test section.<\/em><\/span><\/p><h2 id=\"tocAnchor-1-1-3\">Creating tokens without a form.<\/h2><p>Once you have installed and you set up the library, you\u2019ll need to call the OpenPay.token.create () method in order to create a token.<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span><span class=\"p\">.<\/span><span class=\"nx\">create<\/span><span class=\"p\">(<\/span><span class=\"nx\">CREATE_PARAMETERS_OBJECT<\/span><span class=\"p\">,<\/span> <span class=\"nx\">SUCCESS_CALLBACK<\/span><span class=\"p\">,<\/span> <span class=\"nx\">ERROR_CALLBACK<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>The parameters for this method are:<\/p><ul><li>Parameter <code><span style=\"color: #e41182;\">CREATE_PARAMETERS_OBJECT<\/span><\/code> is a Javascript object containing the card information.<\/li><li>Parameter <code><span style=\"color: #e41182;\">SUCCESS_CALLBACK<\/span><\/code> defines the function to be called if the operation was successful.<\/li><li>Parameter <code><span style=\"color: #e41182;\">ERROR_CALLBACK<\/span><\/code> defines the function to be called if the operation failed.<\/li><\/ul><p>Example of creating a token:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span><span class=\"p\">.<\/span><span class=\"nx\">create<\/span><span class=\"p\">({<\/span>\n      <span class=\"s2\" style=\"color: #e41182;\">\"card_number\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"4111111111111111\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"s2\" style=\"color: #e41182;\">\"holder_name\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Juan Perez Ramirez\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"s2\" style=\"color: #e41182;\">\"expiration_year\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"20\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"s2\"><span style=\"color: #e41182;\">\"expiration_month\"<\/span><\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"12\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"s2\" style=\"color: #e41182;\">\"cvv2\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"110\"<\/span><span class=\"p\">,<\/span>\n      <span class=\"s2\" style=\"color: #e41182;\">\"address\"<\/span><span class=\"o\">:<\/span><span class=\"p\">{<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"city\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Quer\u00e9taro\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"line3\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Queretaro\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"postal_code\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"76900\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"line1\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Av 5 de Febrero\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"line2\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Roble 207\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"state\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"Queretaro\"<\/span><span class=\"p\">,<\/span>\n         <span class=\"s2\" style=\"color: #e41182;\">\"country_code\"<\/span><span class=\"o\">:<\/span><span class=\"s2\" style=\"color: #e41182;\">\"MX\"<\/span>\n      <span class=\"p\">}<\/span>\n<span class=\"p\">},<\/span> <span class=\"nx\">onSuccess<\/span><span class=\"p\">,<\/span> <span class=\"nx\">onError<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>The method returns an object type token with an id which you\u2019ll need later. You\u2019ll find the definition of the token object here.<\/p><h2 id=\"tocAnchor-1-1-4\">Creating tokens with a form<\/h2><p>The Openpay.js library facilitates the extraction of the card information using a form, so you can send it later through the <code><span style=\"color: #e41182;\">OpenPay.token.extractFormAndCreate()<\/span><\/code><\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span><span class=\"p\">.<\/span><span class=\"nx\">extractFormAndCreate<\/span><span class=\"p\">(<\/span><span class=\"nx\">CREATE_FORM_OBJECT<\/span><span class=\"p\">,<\/span> <span class=\"nx\">SUCCESS_CALLBACK<\/span><span class=\"p\">,<\/span> <span class=\"nx\">ERROR_CALLBACK<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>The parameters for this method are:<\/p><ul><li>Parameter <code><span style=\"color: #e41182;\">CREATE_FORM_OBJECT<\/span><\/code> is a Javascript object containing the card information.<\/li><li>Parameter <code><span style=\"color: #e41182;\">SUCCESS_CALLBACK<\/span><\/code> defines the function to be called if the operation was successful.<\/li><li>Parameter <code><span style=\"color: #e41182;\">ERROR_CALLBACK<\/span><\/code> defines the function to be called if the operation failed.<\/li><\/ul><p>To start creating tokens, you must have a form like this:<\/p><figure class=\"highlight\"><pre><code class=\"language-html\" data-lang=\"html\"><span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">form <\/span><span class=\"na\" style=\"color: #008080;\">id<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"processCard\"<\/span> <span class=\"na\" style=\"color: #008080;\">name<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"processCard\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Holder Name:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"holder_name\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"50\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Card number:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"card_number\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"50\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Expiration year:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"expiration_year\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"4\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Expiration month:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"expiration_month\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"4\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>cvv2:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\"><span style=\"color: #008080;\">data-openpay-card<\/span><\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"cvv2\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"5\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Street:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"line1\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"20\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Number:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"line2\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"20\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>References:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"line3\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"20\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Postal code:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"postal_code\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"6\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>City:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"city\" <\/span><span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"20\" <\/span><span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>State:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"state\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"20\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;<\/span>Country code:<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">p<\/span><span class=\"p\">&gt;&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">data-openpay-card-address<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"country_code\"<\/span> <span class=\"na\" style=\"color: #008080;\">size<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"3\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"text\"<\/span><span class=\"p\">&gt;<\/span>\n    <span class=\"p\">&lt;<\/span><span class=\"nt\" style=\"color: #000080;\">input <\/span><span class=\"na\" style=\"color: #008080;\">id<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"makeRequestCard\"<\/span> <span class=\"na\" style=\"color: #008080;\">type<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"button\"<\/span> <span class=\"na\" style=\"color: #008080;\">value<\/span><span class=\"o\">=<\/span><span class=\"s\" style=\"color: #e41182;\">\"Make Card\"<\/span><span class=\"p\">&gt;<\/span>\n<span class=\"p\">&lt;<span style=\"color: #000080;\">\/<\/span><\/span><span class=\"nt\" style=\"color: #000080;\">form<\/span><span class=\"p\">&gt;<\/span><\/code><\/pre><\/figure><p><span style=\"font-size: 10pt;\"><em><span style=\"color: #004481;\"><strong>Note:<\/strong><\/span> The most important thing is to add the <code><span style=\"color: #e41182;\">data-openpay-card<\/span><\/code> and <code><span style=\"color: #e41182;\">data-openpay-card-address<\/span><\/code> on the inputs of the card information and the card address because that\u2019s how the method knows where to get those values\u200b\u200b.<\/em><\/span><\/p><p>Later when generating the token, call the <code><span style=\"color: #e41182;\">token.extractFormAndCreate()<\/span><\/code>method as shown below:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">token<\/span><span class=\"p\">.<\/span><span class=\"nx\">extractFormAndCreate<\/span><span class=\"p\">(<\/span>\n      <span class=\"nx\">$<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'#processCard'<\/span><span class=\"p\">),<\/span>\n      <span class=\"nx\">successCard<\/span><span class=\"p\">,<\/span>\n      <span class=\"nx\">errorCard<\/span><span class=\"p\">,<\/span>\n      <span class=\"nx\">_customerId<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>The method returns an object type token with an id which you\u2019ll need later. You\u2019ll find the definition of the token object here.<\/p><p>For an example download the sample page from the github site: openpay-js<\/p><h2 id=\"tocAnchor-1-1-5\">Handling responses<\/h2><p>The response functions are to handle the operations results. They are simple Javascript functions but they receive an object type response as parameter .<\/p><p>The fields of the response object are described below:<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-ebebf11 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"ebebf11\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-0a2dffe\" data-id=\"0a2dffe\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-97eeb30 elementor-widget elementor-widget-heading\" data-id=\"97eeb30\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Field<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-9551309\" data-id=\"9551309\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-777fea7 elementor-widget elementor-widget-heading\" data-id=\"777fea7\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Format<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-369662c\" data-id=\"369662c\" data-element_type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-ea884b8 elementor-widget elementor-widget-heading\" data-id=\"ea884b8\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Description<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d2d051a elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"d2d051a\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-0dda781\" data-id=\"0dda781\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-a13c7b1 elementor-widget elementor-widget-heading\" data-id=\"a13c7b1\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">status<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-808d6e6\" data-id=\"808d6e6\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5569230 elementor-widget elementor-widget-heading\" data-id=\"5569230\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Integer<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-976373b\" data-id=\"976373b\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cdf0aeb elementor-widget elementor-widget-heading\" data-id=\"cdf0aeb\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Describes the HTTP status of the operation. In case of an error before sending the request, the status will be equal to zero. In case of success it is 200.<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-fcda3f2 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"fcda3f2\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-d2dd2ab\" data-id=\"d2dd2ab\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4b7452b elementor-widget elementor-widget-heading\" data-id=\"4b7452b\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">message<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-d53e6e6\" data-id=\"d53e6e6\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-df0a46b elementor-widget elementor-widget-heading\" data-id=\"df0a46b\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">String<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-15a3ed7\" data-id=\"15a3ed7\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-e9afa58 elementor-widget elementor-widget-heading\" data-id=\"e9afa58\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">It only occurs in cases of error. Short description of the error that has occurred. It can be one of the following values: \"Unknown error\", \"Request error\", \"Response error (Unknown final status)\", \"Empty or invalid OpenPay ID\", \"Empty or invalid API Key\", \"Browser error\", \" Timeout after X milliseconds \".<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-01817d6 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"01817d6\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-4c689e2\" data-id=\"4c689e2\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-fac30e6 elementor-widget elementor-widget-heading\" data-id=\"fac30e6\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">data<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-9f5b4f5\" data-id=\"9f5b4f5\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-abdfc00 elementor-widget elementor-widget-heading\" data-id=\"abdfc00\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Objeto<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-7b4d085\" data-id=\"7b4d085\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cf1fd0d elementor-widget elementor-widget-heading\" data-id=\"cf1fd0d\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">It contains an Error Object with the information of the error in the transaction provided by the Openpay server.\n<br><br>\nIn case of success, it contains a token-type object.<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-857dac4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"857dac4\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-a1f6dbb\" data-id=\"a1f6dbb\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-0730707 elementor-widget elementor-widget-text-editor\" data-id=\"0730707\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p><em><span style=\"font-size: 10pt;\"><span style=\"color: #004481;\"><strong>Notes:<\/strong><\/span> Although the response functions are optional, we recommend that they be implemented so that the result of the transaction can be monitored on the web page.<\/span><\/em><\/p><p><strong>In case of success: SuccessCallback<\/strong><\/p><p>This function is called when the operation was successful from start to finish. It receives a single parameter which is a Javascript object with the token data.<\/p><p>Complete example of implementing a SuccessCallback function:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><strong><span class=\"kd\">function<\/span> <\/strong><span class=\"nx\">SuccessCallback<\/span><span class=\"p\">(<\/span><span class=\"nx\">response<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">alert<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'Operaci\u00f3n exitosa'<\/span><span class=\"p\">);<\/span>\n    <span class=\"kd\">var<\/span> <span class=\"nx\">content<\/span> <span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">''<\/span><span class=\"p\">,<\/span> <span class=\"nx\">results<\/span> <span class=\"o\">=<\/span> <span class=\"nb\" style=\"color: #008080;\">document<\/span><span class=\"p\">.<\/span><span class=\"nx\">getElementById<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'resultDetail'<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'Id tarjeta: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">id<\/span><span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'A nombre de: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">holder_name<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'Marca de tarjeta usada: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">brand<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">results<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerHTML<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">content<\/span><span class=\"p\">;<\/span>\n<span class=\"p\">}<\/span><\/code><\/pre><\/figure><p><strong>In case of error: ErrorCallback<\/strong><\/p><p>This function will be executed every time an operation has failed (for any reason, before or after sending the request). Like the SuccessCallback (), it receives a single parameter which is a Javascript object with the detail of the failure.<\/p><p>Complete example of implementation of an ErrorCallback function:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><strong><span class=\"kd\">function<\/span> <\/strong><span class=\"nx\">ErrorCallback<\/span><span class=\"p\">(<\/span><span class=\"nx\">response<\/span><span class=\"p\">)<\/span> <span class=\"p\">{<\/span>\n    <span class=\"nx\">alert<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'Fallo en la transacci\u00f3n'<\/span><span class=\"p\">);<\/span>\n    <span class=\"kd\">var<\/span> <span class=\"nx\">content<\/span> <span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">''<\/span><span class=\"p\">,<\/span> <span class=\"nx\">results<\/span> <span class=\"o\">=<\/span> <span class=\"nb\" style=\"color: #008080;\">document<\/span><span class=\"p\">.<\/span><span class=\"nx\">getElementById<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'resultDetail'<\/span><span class=\"p\">);<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'Estatus del error: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">status<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'Error: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">message<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'Descripci\u00f3n: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">description<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">content<\/span> <span class=\"p\">.<\/span><span class=\"o\">=<\/span> <span class=\"s1\" style=\"color: #e41182;\">'ID de la petici\u00f3n: '<\/span> <span class=\"o\">+<\/span> <span class=\"nx\">response<\/span><span class=\"p\">.<\/span><span class=\"nx\">data<\/span><span class=\"p\">.<\/span><span class=\"nx\">request_id<\/span> <span class=\"o\">+<\/span> <span class=\"s1\" style=\"color: #e41182;\">'\n'<\/span><span class=\"p\">;<\/span>\n    <span class=\"nx\">results<\/span><span class=\"p\">.<\/span><span class=\"nx\">innerHTML<\/span> <span class=\"o\">=<\/span> <span class=\"nx\">content<\/span><span class=\"p\">;<\/span>\n<span class=\"p\">}<\/span><\/code><\/pre><\/figure><p>\u200b <strong>Types of error<\/strong><\/p><p>In addition to the status field that saves the status of the transaction, it is possible to determine the error that has occurred through the message field. The message can be one of the following:<\/p><ul><li><strong>Empty or invalid OpenPay ID:<\/strong> It happens when the user ID has not been set correctly with the OpenPay.setId () method<\/li><li><strong>Empty or invalid API Key:<\/strong> Like the above error, it happens when the API Key has not been set with the OpenPay.setApiKey () method<\/li><li><strong>Browser error:<\/strong> It is triggered when there is an error in the browser that prevents the request from being carried out correctly. It can be caused by features that are necessary to run certain code and are missing from the browser. For more information see the section \"Compatibility and requirements\".<\/li><li><strong>Request error:<\/strong> This error indicates that there was an error on the Openpay server. It may be due to missing parameters, formats, or some other problem that is preventing the transaction from successfully completing.<\/li><li><strong>Response error (Unknown final status):<\/strong> When this error is generated, it means that the transaction request was successfully sent to the Openpay server but no response was received. This may be due to a problem in Openpay. For more information contact OpenPay.<\/li><li><strong>Timeout after X milliseconds:<\/strong> It is launched when the request has taken a long time to execute and therefore the response time expires.<\/li><li><strong>Unknown error:<\/strong> It is generated when there is an unknown error that prevents the request from being made. It may be due to browser or connectivity problems.<\/li><\/ul><h2 id=\"tocAnchor-1-1-6\">Validation functions<\/h2><p>Besides the functions to process card charges, Openpay.js also includes some functions to validate the main data needed to carry out the transaction, specially regarding card numbers.<\/p><p>The available methods are:<\/p><ul><li>OpenPay.card.validateCardNumber()<\/li><li>OpenPay.card.validateCVC()<\/li><li>OpenPay.card.validateExpiry()<\/li><li>OpenPay.card.cardType()<\/li><\/ul><p><strong><br>Card number validation<\/strong><\/p><p>To validate a card number you can use the <code><span style=\"color: #e41182;\">OpenPay.card.validateCardNumber()<\/span><\/code>.<\/p><p>This method receives a String as a parameter with the card number which will be validated and will return true \/ false depending if the card it\u2019s valid and is accepted by Openpay. Example<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCardNumber<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'5555555555554444'<\/span><span class=\"p\">);<\/span><\/code><\/pre><\/figure><p>This method is very useful for determining whether a card number is valid and if it\u2019s able to be used with Openpay, so we recommend that you use it routinely before attempting a card charge.<\/p><p>Examples:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCardNumber<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'5555555555554444'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ TRUE. N\u00famero de tarjeta v\u00e1lido y aceptado por OpenPay (MASTERCARD)<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCardNumber<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'378282246310005'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ FALSE. N\u00famero de tarjeta v\u00e1lido pero no aceptado por OpenPay (AMEX) <\/span><\/code><\/pre><\/figure><p><strong>Security Code Validation<\/strong><\/p><p>To validate the security code use the <code><span style=\"color: #e41182;\">OpenPay.card.validateCVC()<\/span><\/code>.<\/p><p>This method receives a String as a parameter and returns true \/ false depending if the string is valid.<\/p><p>Examples:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'123'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ v\u00e1lido<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'1234'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ v\u00e1lido<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'A23'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ inv\u00e1lido<\/span><\/code><\/pre><\/figure><p>Additionally, the security code can be validated by passing the card number as the second parameter, to determine if the code is valid for the type of card in question.<\/p><p>Examples:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'123'<\/span><span class=\"p\">,<\/span><span class=\"s1\" style=\"color: #e41182;\">'5555555555554444'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ v\u00e1lido, tarjeta MASTERCARD y CVC de longitud 3<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'1234'<\/span><span class=\"p\">,<\/span><span class=\"s1\" style=\"color: #e41182;\">'5555555555554444'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ inv\u00e1lido, tarjeta MASTERCARD y CVC de longitud 4<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'123'<\/span><span class=\"p\">,<\/span><span class=\"s1\" style=\"color: #e41182;\">'378282246310005'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ inv\u00e1lido, tarjeta AMERICAN EXPRESS y CVC de longitud 3<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateCVC<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'1234'<\/span><span class=\"p\">,<\/span><span class=\"s1\" style=\"color: #e41182;\">'378282246310005'<\/span><span class=\"p\">);<\/span>\n<span class=\"c1\">\/\/ v\u00e1lido, tarjeta AMERICAN EXPRESS y CVC de longitud 4<\/span><\/code><\/pre><\/figure><p><strong>Expiration date Validation<\/strong><\/p><p>For this purpose use the <code><span style=\"color: #e41182;\">OpenPay.card.validateExpiry()<\/span><\/code>.<\/p><p>This method receives two strings as parameters representing the expiration month and year of the card. It returns true \/ false depending if the combination of both data, month and year, are a valid expiration date. Example:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateExpiry<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'01'<\/span><span class=\"p\">,<\/span> <span class=\"s1\" style=\"color: #e41182;\">'2013'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ inv\u00e1lido<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">validateExpiry<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'05'<\/span><span class=\"p\">,<\/span> <span class=\"s1\" style=\"color: #e41182;\">'2015'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ v\u00e1lido<\/span><\/code><\/pre><\/figure><p><strong>Validation of the type of card<\/strong><\/p><p>It can be determined (most of the time) the type of card that belongs to a card number. For this, use the <code><span style=\"color: #e41182;\">OpenPay.card.cardType()<\/span><\/code>.<\/p><p>The method receives a card number as a parameter and returns a String with the name of the card type.<\/p><p>Examples:<\/p><figure class=\"highlight\"><pre><code class=\"language-javascript\" data-lang=\"javascript\"><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'5555555555554444'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Mastercard<\/span>\n<span class=\"err\">\u200b<\/span><span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'4111111111111111'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/\u200b Visa<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'4917300800000000'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Visa Electron<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'378282246310005'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ American Express<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'30569309025904'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Diners Club Carte Blanche<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'6011111111111117'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ Discover<\/span>\n<span class=\"nx\">OpenPay<\/span><span class=\"p\">.<\/span><span class=\"nx\">card<\/span><span class=\"p\">.<\/span><span class=\"nx\">cardType<\/span><span class=\"p\">(<\/span><span class=\"s1\" style=\"color: #e41182;\">'3530111333300000'<\/span><span class=\"p\">);<\/span> <span class=\"c1\">\/\/ JCB<\/span><\/code><\/pre><\/figure><h2 id=\"tocAnchor-1-1-7\">Compatibility and Requirements<\/h2><p>To use Openpay.js is necessary to have one of the following browsers:<\/p><ul><li>Chrome 29.0+<\/li><li>Firefox 23.0+<\/li><li>Safari 5.1+<\/li><li>Opera 17.0+<\/li><li>iOS Safari 4.0+<\/li><li>Android Browser 2.1+<\/li><li>Blackberry Browser 7.0+<\/li><li>IE Mobile 10.0<\/li><\/ul><p><span style=\"font-size: 10pt;\"><em>It\u2019s required that the browsers have support for the XMLHttpRequest and JSON Parser libraries.<\/em><\/span><\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Introducci\u00f3n \u00bfQu\u00e9 es Openpay.js? Openpay.js es una librer\u00eda Javascript dise\u00f1ada para facilitar la creaci\u00f3n de tokens en base a datos de tarjetas de cr\u00e9dito y d\u00e9bito desde una p\u00e1gina web sin la necesidad que la informaci\u00f3n del alta pase por el servidor origen (El servidor del comercio). Ventajas: Es seguro, la informaci\u00f3n de la tarjeta&hellip;&nbsp;<a href=\"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html\" rel=\"bookmark\">Read More &raquo;<span class=\"screen-reader-text\">Openpay.js<\/span><\/a><\/p>","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"categories":[133],"tags":[],"class_list":["post-3508","post","type-post","status-publish","format-standard","hentry","category-docs"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Openpay.js | Openpay<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Openpay.js | Openpay\" \/>\n<meta property=\"og:description\" content=\"Introducci\u00f3n \u00bfQu\u00e9 es Openpay.js? Openpay.js es una librer\u00eda Javascript dise\u00f1ada para facilitar la creaci\u00f3n de tokens en base a datos de tarjetas de cr\u00e9dito y d\u00e9bito desde una p\u00e1gina web sin la necesidad que la informaci\u00f3n del alta pase por el servidor origen (El servidor del comercio). Ventajas: Es seguro, la informaci\u00f3n de la tarjeta&hellip;&nbsp;Read More &raquo;Openpay.js\" \/>\n<meta property=\"og:url\" content=\"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html\/\" \/>\n<meta property=\"og:site_name\" content=\"Openpay\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-10T16:50:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-02-18T16:35:13+00:00\" \/>\n<meta name=\"author\" content=\"user\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"user\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#article\",\"isPartOf\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html\"},\"author\":{\"name\":\"user\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/person\/4c704d548de0c4eed7ac90530bf655a7\"},\"headline\":\"Openpay.js\",\"datePublished\":\"2021-03-10T16:50:22+00:00\",\"dateModified\":\"2022-02-18T16:35:13+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html\"},\"wordCount\":1655,\"publisher\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#organization\"},\"articleSection\":[\"Documentaci\u00f3n\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html\",\"url\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html\",\"name\":\"Openpay.js | Openpay\",\"isPartOf\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#website\"},\"datePublished\":\"2021-03-10T16:50:22+00:00\",\"dateModified\":\"2022-02-18T16:35:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Inicio\",\"item\":\"https:\/\/documents-mx-dev.opdevhm.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Openpay.js\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#website\",\"url\":\"https:\/\/documents-mx-dev.opdevhm.com\/\",\"name\":\"Openpay\",\"description\":\"Openpay a BBVA Company\",\"publisher\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/documents-mx-dev.opdevhm.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#organization\",\"name\":\"Openpay Soporte\",\"url\":\"https:\/\/documents-mx-dev.opdevhm.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/documents-mx-dev.opdevhm.com\/wp-content\/uploads\/2020\/05\/logo.png\",\"contentUrl\":\"https:\/\/documents-mx-dev.opdevhm.com\/wp-content\/uploads\/2020\/05\/logo.png\",\"width\":290,\"height\":90,\"caption\":\"Openpay Soporte\"},\"image\":{\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/person\/4c704d548de0c4eed7ac90530bf655a7\",\"name\":\"user\",\"url\":\"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/author\/berni\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Openpay.js | Openpay","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html\/","og_locale":"en_US","og_type":"article","og_title":"Openpay.js | Openpay","og_description":"Introducci\u00f3n \u00bfQu\u00e9 es Openpay.js? Openpay.js es una librer\u00eda Javascript dise\u00f1ada para facilitar la creaci\u00f3n de tokens en base a datos de tarjetas de cr\u00e9dito y d\u00e9bito desde una p\u00e1gina web sin la necesidad que la informaci\u00f3n del alta pase por el servidor origen (El servidor del comercio). Ventajas: Es seguro, la informaci\u00f3n de la tarjeta&hellip;&nbsp;Read More &raquo;Openpay.js","og_url":"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/openpay-js.html\/","og_site_name":"Openpay","article_published_time":"2021-03-10T16:50:22+00:00","article_modified_time":"2022-02-18T16:35:13+00:00","author":"user","twitter_card":"summary_large_image","twitter_misc":{"Written by":"user","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#article","isPartOf":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html"},"author":{"name":"user","@id":"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/person\/4c704d548de0c4eed7ac90530bf655a7"},"headline":"Openpay.js","datePublished":"2021-03-10T16:50:22+00:00","dateModified":"2022-02-18T16:35:13+00:00","mainEntityOfPage":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html"},"wordCount":1655,"publisher":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/#organization"},"articleSection":["Documentaci\u00f3n"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html","url":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html","name":"Openpay.js | Openpay","isPartOf":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/#website"},"datePublished":"2021-03-10T16:50:22+00:00","dateModified":"2022-02-18T16:35:13+00:00","breadcrumb":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/documents-mx-dev.opdevhm.com\/docs\/openpay-js.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Inicio","item":"https:\/\/documents-mx-dev.opdevhm.com\/"},{"@type":"ListItem","position":2,"name":"Openpay.js"}]},{"@type":"WebSite","@id":"https:\/\/documents-mx-dev.opdevhm.com\/#website","url":"https:\/\/documents-mx-dev.opdevhm.com\/","name":"Openpay","description":"Openpay a BBVA Company","publisher":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/documents-mx-dev.opdevhm.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/documents-mx-dev.opdevhm.com\/#organization","name":"Openpay Soporte","url":"https:\/\/documents-mx-dev.opdevhm.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/logo\/image\/","url":"https:\/\/documents-mx-dev.opdevhm.com\/wp-content\/uploads\/2020\/05\/logo.png","contentUrl":"https:\/\/documents-mx-dev.opdevhm.com\/wp-content\/uploads\/2020\/05\/logo.png","width":290,"height":90,"caption":"Openpay Soporte"},"image":{"@id":"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/documents-mx-dev.opdevhm.com\/#\/schema\/person\/4c704d548de0c4eed7ac90530bf655a7","name":"user","url":"https:\/\/documents-mx-dev.opdevhm.com\/en\/docs\/author\/berni"}]}},"_links":{"self":[{"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/posts\/3508","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/comments?post=3508"}],"version-history":[{"count":0,"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/posts\/3508\/revisions"}],"wp:attachment":[{"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/media?parent=3508"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/categories?post=3508"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/documents-mx-dev.opdevhm.com\/en\/wp-json\/wp\/v2\/tags?post=3508"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}