{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-js/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":[]},"type":"markdown"},"seo":{"title":"Finix.js Reference","description":"Complete API reference for finix.js v2 — Finix's client-side JavaScript library for securely collecting and tokenizing payment details.","siteUrl":"https://docs.finix.com/","llmstxt":{"hide":false,"sections":[{"title":"Getting Started","includeFiles":["guides/getting-started/**/*.md"],"excludeFiles":[]},{"title":"Online Payments","includeFiles":["guides/online-payments/**/*.md"],"excludeFiles":["guides/online-payments/payment-features/fsa-hsa-non-healthcare-mcc.md"]},{"title":"In-Person Payments","includeFiles":["guides/in-person-payments/**/*.md"],"excludeFiles":[]},{"title":"Subscriptions","includeFiles":["guides/subscriptions/**/*.md"],"excludeFiles":[]},{"title":"After the Payment","includeFiles":["guides/subscriptions/after-the-payment/**/*.md"],"excludeFiles":[]},{"title":"Managing Operations","includeFiles":["guides/managing-operations/**/*.md"],"excludeFiles":[]},{"title":"Platform Payments","includeFiles":["guides/platform-payments/**/*.md"],"excludeFiles":[]},{"title":"Payouts","includeFiles":["guides/payouts/**/*.md"],"excludeFiles":[]},{"title":"Developers","includeFiles":["additional-resources/developers/**/*.md"],"excludeFiles":[]},{"title":"Plugins","includeFiles":["additional-resources/plugins/**/*.md"],"excludeFiles":[]},{"title":"Industry Considerations","includeFiles":["guides/industry-considerations/**/*.md"],"excludeFiles":[]},{"title":"Regional Considerations","includeFiles":["guides/regional-considerations/**/*.md"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"finixjs-reference","__idx":0},"children":["Finix.js Reference"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Finix.js is a client-side JavaScript library for securely collecting and tokenizing payment details. It renders an embedded payment form inside an iframe, keeping sensitive card and bank data out of your application and ensuring PCI compliance."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"including-finixjs","__idx":1},"children":["Including finix.js"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Always load the library directly from ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["https://js.finix.com"]},". Never self-host or bundle finix.js — doing so breaks PCI compliance."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<script src=\"https://js.finix.com/v/2/finix.js\"></script>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"fraud-detection","__idx":2},"children":["Fraud Detection"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["For best fraud detection, initialize the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["Finix.Auth"]}," service on every page of your site, not just the checkout. This allows Finix to monitor potential malicious behavior. See the ",{"$$mdtype":"Tag","name":"a","attributes":{"href":"/js/auth"},"children":["Fraud Detection API Reference"]}," to learn how to integrate Finix.js's built-in fraud detection in your application."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"global-api","__idx":3},"children":["Global API"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Method"},"children":["Method"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"a","attributes":{"href":"/js/payment-form"},"children":["Finix.PaymentForm()"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Create and render a secure payment form for collecting card and bank details."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"a","attributes":{"href":"/js/auth"},"children":["Finix.Auth()"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Initialize fraud detection and session tracking."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"quick-start","__idx":4},"children":["Quick start"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<!-- 1. Include the script -->\n<script src=\"https://js.finix.com/v/2/finix.js\"></script>\n\n<!-- 2. Add a mount point -->\n<div id=\"payment-form\"></div>\n\n<script>\n  <!-- 3. Initialize fraud detection -->\n  const finixAuth = Finix.Auth(\"sandbox\", \"MUeDVrf2ahuKc9Eg5TeZugvs\");\n\n  <!-- 4. Initialize the form -->\n  Finix.PaymentForm(\n    \"payment-form\",\n    \"sandbox\",\n    \"APgPDQrLD52TYvqazjHJJchM\",\n    {\n      onSubmit: function (error, response) {\n        if (error) {\n          console.error(\"Error:\", error);\n          return;\n        }\n        const tokenData = response.data || {};\n\n        // Send token and fraud session key to your backend\n        fetch(\"/your/backend\", {\n          method: \"POST\",\n          headers: { \"Content-Type\": \"application/json\" },\n          body: JSON.stringify({\n            token: tokenData.id,\n            fraud_session_id: finixAuth.getSessionKey(),\n          }),\n        });\n      },\n    }\n  );\n</script>\n","lang":"html"},"children":[]}]},"headings":[{"value":"Finix.js Reference","id":"finixjs-reference","depth":1},{"value":"Including finix.js","id":"including-finixjs","depth":2},{"value":"Fraud Detection","id":"fraud-detection","depth":2},{"value":"Global API","id":"global-api","depth":2},{"value":"Quick start","id":"quick-start","depth":2}],"frontmatter":{"seo":{"title":"Finix.js Reference","description":"Complete API reference for finix.js v2 — Finix's client-side JavaScript library for securely collecting and tokenizing payment details."}},"lastModified":"2026-04-07T17:00:18.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/js","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}