> ## Documentation Index
> Fetch the complete documentation index at: https://docs.abbyy.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Configuring Vantage Mobile Input

> Configure Vantage Mobile Input upload links: customize document types, pages, redirect URI, language, theme, and other parameters for the capture flow.

export const VantageRegion = ({children}) => {
  const STORAGE_KEY = "abbyy.vantage.region";
  const REGIONS = [{
    code: "eu",
    label: "Europe"
  }, {
    code: "us",
    label: "North America"
  }, {
    code: "au",
    label: "Australia / Asia-Pacific"
  }];
  const [region, setRegion] = useState("eu");
  const [open, setOpen] = useState(false);
  const containerRef = useRef(null);
  const dropdownRef = useRef(null);
  function safeGetSavedRegion() {
    try {
      const saved = typeof window !== "undefined" ? window.localStorage.getItem(STORAGE_KEY) : null;
      const valid = new Set(REGIONS.map(r => r.code));
      return saved && valid.has(saved) ? saved : "eu";
    } catch {
      return "eu";
    }
  }
  function safeSetSavedRegion(code) {
    try {
      if (typeof window !== "undefined") {
        window.localStorage.setItem(STORAGE_KEY, code);
      }
    } catch {}
  }
  function dispatchRegionChanged(code) {
    try {
      if (typeof window !== "undefined") {
        window.dispatchEvent(new CustomEvent("abbyy:region-changed", {
          detail: {
            code
          }
        }));
      }
    } catch {}
  }
  function replaceRegionInString(text, currentRegion) {
    if (typeof text !== "string") return text;
    const hostRegex = /https:\/\/vantage-(eu|us|au)\.abbyy\.com/gi;
    const tokenRegex = /https:\/\/vantage-\[region\]\.abbyy\.com/gi;
    const bareHostRegex = /vantage-(eu|us|au)\.abbyy\.com/gi;
    const bareTokenRegex = /vantage-\[region\]\.abbyy\.com/gi;
    return text.replace(hostRegex, `https://vantage-${currentRegion}.abbyy.com`).replace(tokenRegex, `https://vantage-${currentRegion}.abbyy.com`).replace(bareHostRegex, `vantage-${currentRegion}.abbyy.com`).replace(bareTokenRegex, `vantage-${currentRegion}.abbyy.com`);
  }
  useEffect(() => {
    setRegion(safeGetSavedRegion());
  }, []);
  useEffect(() => {
    const root = containerRef.current;
    if (!root) return;
    const anchors = root.querySelectorAll("a[href]");
    anchors.forEach(a => {
      const href = a.getAttribute("href");
      if (href) {
        const next = replaceRegionInString(href, region);
        if (next !== href) {
          a.setAttribute("href", next);
        }
      }
    });
    const walker = typeof document !== "undefined" ? document.createTreeWalker(root, NodeFilter.SHOW_TEXT, null) : null;
    if (walker) {
      const toUpdate = [];
      let node = walker.nextNode();
      while (node) {
        const updated = replaceRegionInString(node.nodeValue, region);
        if (updated !== node.nodeValue) {
          toUpdate.push([node, updated]);
        }
        node = walker.nextNode();
      }
      toUpdate.forEach(([textNode, value]) => {
        textNode.nodeValue = value;
      });
    }
  }, [region, children]);
  useEffect(() => {
    const root = containerRef.current;
    if (!root) return;
    const anchors = root.querySelectorAll("a[href]");
    anchors.forEach(a => {
      a.style.fontWeight = "600";
      a.style.textDecoration = "underline";
      a.style.textUnderlineOffset = "2px";
    });
  }, [region, children]);
  useEffect(() => {
    const onRegionChanged = evt => {
      const code = evt && evt.detail && evt.detail.code;
      if (!code || code === region) return;
      setRegion(code);
    };
    if (typeof window !== "undefined") {
      window.addEventListener("abbyy:region-changed", onRegionChanged);
    }
    return () => {
      if (typeof window !== "undefined") {
        window.removeEventListener("abbyy:region-changed", onRegionChanged);
      }
    };
  }, [region]);
  useEffect(() => {
    const onClickAway = e => {
      if (!dropdownRef.current) return;
      if (!dropdownRef.current.contains(e.target)) {
        setOpen(false);
      }
    };
    document.addEventListener("click", onClickAway, true);
    return () => document.removeEventListener("click", onClickAway, true);
  }, []);
  const onSelect = code => {
    setRegion(code);
    safeSetSavedRegion(code);
    dispatchRegionChanged(code);
    setOpen(false);
  };
  const current = REGIONS.find(r => r.code === region) || REGIONS[0];
  return <div className="not-prose">
      <div className="mb-4 inline-flex items-center gap-2" ref={dropdownRef}>
        <span className="text-sm text-zinc-950/80 dark:text-white/80">Tenant Region:</span>
        <div className="relative">
          <button type="button" aria-haspopup="listbox" aria-expanded={open ? "true" : "false"} onClick={() => setOpen(v => !v)} className="h-8 px-3 rounded-md bg-zinc-900/5 dark:bg-white/5 border border-zinc-950/20 dark:border-white/20 text-sm inline-flex items-center gap-2">
            <span className="text-zinc-950 dark:text-white">{current.label}</span>
            <svg width="8" height="24" viewBox="0 -9 3 24" className="transition-transform text-gray-400 overflow-visible dark:text-gray-600 ml-auto" style={{
    transform: open ? "rotate(270deg)" : "rotate(90deg)"
  }}>
              <path d="M0 0L3 3L0 6" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round"></path>
            </svg>
          </button>
          {open ? <div role="listbox" className="absolute z-50 left-full top-0 ml-2 w-56 rounded-xl border border-zinc-950/20 dark:border-white/20 bg-white dark:bg-zinc-900 shadow-lg p-2">
              {REGIONS.map(r => {
    const selected = r.code === region;
    return <button key={r.code} type="button" role="option" aria-selected={selected ? "true" : "false"} onClick={() => onSelect(r.code)} className={"w-full flex items-center justify-between px-3 py-2 rounded-lg text-sm hover:bg-zinc-950/5 dark:hover:bg-white/10 text-zinc-950 dark:text-white" + (selected ? " font-medium" : "")}>
                    <span style={selected ? {
      color: "#ff2038"
    } : undefined}>{r.label}</span>
                    <span className={selected ? "ml-3" : "ml-3 invisible"} style={selected ? {
      color: "#ff2038"
    } : undefined}>✓</span>
                  </button>;
  })}
            </div> : null}
        </div>
      </div>
      <div ref={containerRef} className="prose dark:prose-invert max-w-none">{children}</div>
    </div>;
};

You can configure the mobile upload feature using the following additional parameters:

* [The md parameter](#the-md-parameter) customizes the number and names of the documents, along with the pages for each document to be captured in one transaction.
* [The dt parameter](#the-dt-parameter) customizes mobile upload to capture a single document type.
* [The redirect\_uri parameter](#the-redirect-uri-parameter) customizes a website link that will be opened once the mobile upload is finished.
* [The ma parameter](#the-ma-parameter) enables the use of micro applications for on-premises environments.

## The md parameter

You can specify the structure of the documents with the number, types, and names of documents that need to be processed in one transaction using the `md` parameter. Vantage Mobile Input will guide users on how to accurately capture specified documents for further processing.

By default, the `md` parameter is present in the mobile upload link with a value of either 0 or 1, depending on the selected skill. You can specify one of the following values:

| Value                                                                   | Description                                                                                                                     |
| :---------------------------------------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------ |
| `0`                                                                     | Captures one document with any number of pages.                                                                                 |
| `1`                                                                     | Captures any number of documents with any number of pages.                                                                      |
| [Encoded URL to JSON file](/vantage/developer/mobile-upload/json-input) | Captures a specified number of documents with customized names, along with defined number and names of pages for each document. |
| [Encoded JSON file](/vantage/developer/mobile-upload/json-input)        | Captures a specified number of documents with customized names, along with defined number and names of pages for each document. |

<Info>
  The **JSON file** for the `md` parameter is only available for mobile upload from micro applications.
</Info>

Example of using the encoded URL to JSON file for the `md` parameter:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&md=https%3A%2F%2Fdomain.tld%2Fstructure.json&token=<token>&v=<2.4>
  ```
</VantageRegion>

Example of using the encoded JSON file for the `md` parameter:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&md=<encoded_json_structure>&token=<token>&v=<2.4>
  ```
</VantageRegion>

<Info>
  If the [dt parameter](#the-dt-parameter) is used in the mobile upload link, the value of the `md` parameter will be ignored.
</Info>

## The dt parameter

To customize mobile upload to capture a single document type, use the `dt` parameter:

1. Add the dt parameter to the mobile upload link.
2. Specify one of the following values:

| Value      | Description                                         |
| :--------- | :-------------------------------------------------- |
| `idcard`   | Captures both sides (front and back) of an ID card. |
| `passport` | Captures the first page of a passport.              |
| `document` | Captures any other document.                        |

<Info>
  The **dt** parameter is optional and does not have a default value.
</Info>

Using the **dt** parameter will adjust the camera in the micro application so that identity documents are captured automatically.

Example of using the `dt` parameter for capturing ID cards:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&dt=idcard
  ```
</VantageRegion>

Example of using the `dt` parameter for capturing a passport page:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&dt=passport
  ```
</VantageRegion>

<Warning>
  When the **dt** parameter is used in the mobile upload link, only one document can be uploaded in a single transaction regardless of the selected skill.
</Warning>

## The redirect\_uri parameter

You can customize a website link that will be opened once the mobile upload is finished and the transaction has started processing. This allows you to manage the user workflow after mobile upload is complete. To do so, add the `redirect_uri` parameter to the mobile upload link.

Example of using the `redirect_uri` parameter:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&redirect_uri=https%3A%2F%2Fyourwebsite.com
  ```
</VantageRegion>

<Warning>
  When using the `redirect_uri` parameter, make sure you add the base URL (for example, `https://www.example.com`) of the website link to be opened in the **Allowed redirect URLs** of the Public API Client used. See [Configuring a Public API Client](/vantage/documentation/tenant-admin/tenant-management/configure-client#configuring-a-public-api-client) for more information.
</Warning>

## The ma parameter

By default, mobile upload for on-premises environments is only possible using a web browser. To enable the use of micro applications for on-premises environments, use the `ma` parameter:

1. Add the `ma` parameter to the mobile upload link.
2. Specify one of the ABBYY Vantage cloud environments.

In this case, mobile input will be redirected to one of the ABBYY Vantage cloud environments to start a micro application on the user's mobile device. All documents will be uploaded directly to the on-premises installation of ABBYY Vantage.

Examples of using the `ma` parameter:

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&ma=<https%3A%2F%2Fvantage-eu.abbyy.com>
  ```
</VantageRegion>

(located in Western Europe),

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&ma=<https%3A%2F%2Fvantage-us.abbyy.com>
  ```
</VantageRegion>

(located in North America),

<VantageRegion>
  ```
  https://vantage-us.abbyy.com/mobile?baseUrl=<base URL>&transactionId=<transaction-id>&token=<token>&v=<2.4>&ma=<https%3A%2F%2Fvantage-au.abbyy.com>
  ```
</VantageRegion>

(located in Australia).
