> ## 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.

# Configuration de Vantage Mobile Input

> Configurez les liens de téléversement de Vantage Mobile Input : personnalisez les types de documents, les pages, l’URI de redirection, la langue, le thème et les autres paramètres du flux de capture.

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>;
};

Vous pouvez configurer la fonction de téléversement mobile à l'aide des Parameters supplémentaires suivants :

* [Le Parameter md](#the-md-parameter) permet de définir le nombre et les noms des documents, ainsi que les pages de chaque document à capturer dans une même transaction.
* [Le Parameter dt](#the-dt-parameter) permet de configurer le téléversement mobile pour capturer un seul type de document.
* [Le Parameter redirect\_uri](#the-redirect-uri-parameter) permet de définir le lien vers le site web qui sera ouvert une fois le téléversement mobile terminé.
* [Le Parameter ma](#the-ma-parameter) active l'utilisation de micro-applications pour les environnements on-premises.

<div id="the-md-parameter">
  ## Le Parameter md
</div>

Vous pouvez spécifier la structure des documents avec le nombre, les types et les noms des documents à traiter dans une seule transaction à l'aide du Parameter `md`. Vantage Mobile Input guidera les utilisateurs sur la manière de capturer avec précision les documents spécifiés pour un traitement ultérieur.

Par défaut, le Parameter `md` est présent dans le lien de téléversement mobile avec une valeur de `0` ou `1`, selon la compétence sélectionnée. Vous pouvez spécifier l'une des valeurs suivantes :

| Valeur                                                                     | Description                                                                                                                                |
| :------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------------------- |
| `0`                                                                        | Capture un document avec n'importe quel nombre de pages.                                                                                   |
| `1`                                                                        | Capture n'importe quel nombre de documents avec n'importe quel nombre de pages.                                                            |
| [Encoded URL to JSON file](/fr/vantage/developer/mobile-upload/json-input) | Capture un nombre spécifié de documents avec des noms personnalisés, ainsi qu'un nombre et des noms de pages définis pour chaque document. |
| [Encoded JSON file](/fr/vantage/developer/mobile-upload/json-input)        | Capture un nombre spécifié de documents avec des noms personnalisés, ainsi qu'un nombre et des noms de pages définis pour chaque document. |

<Info>
  **Remarque :** Le **fichier JSON** pour le Parameter `md` est uniquement disponible pour le téléversement mobile depuis des micro-applications.
</Info>

Exemple d'utilisation de l'URL encodée pointant vers un fichier JSON pour le Parameter `md` :

<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>

Exemple d'utilisation d'un fichier JSON encodé pour le Parameter `md` :

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

<Info>
  **Remarque :** Si le [dt Parameter](#the-dt-parameter) est utilisé dans le lien de téléversement mobile, la valeur du `md` Parameter sera ignorée.
</Info>

<div id="the-dt-parameter">
  ## Le Parameter dt
</div>

Pour personnaliser le téléversement mobile afin de capturer un seul type de document, utilisez le Parameter `dt` :

1. Ajoutez le Parameter `dt` au lien de téléversement mobile.
2. Indiquez l’une des valeurs suivantes :

| Valeur     | Description                                                     |
| :--------- | :-------------------------------------------------------------- |
| `idcard`   | Capture les deux faces (recto et verso) d’une carte d’identité. |
| `passport` | Capture la première page d’un passeport.                        |
| `document` | Capture tout autre document.                                    |

<Info>
  Le Parameter **dt** est facultatif et n’a pas de valeur par défaut.
</Info>

L’utilisation du Parameter **dt** ajustera la caméra dans la micro-application afin que les documents d’identité soient capturés automatiquement.

Exemple d’utilisation du Parameter `dt` pour capturer des cartes d’identité :

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

Exemple d’utilisation du Parameter `dt` pour capturer une page de passeport :

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

<Warning>
  Lorsque le Parameter **dt** est utilisé dans le lien de téléversement mobile, un seul document peut être téléversé dans une seule transaction, quelle que soit la compétence sélectionnée.
</Warning>

<div id="the-redirect_uri-parameter">
  ## Le Parameter redirect\_uri
</div>

Vous pouvez personnaliser un lien de site web qui sera ouvert une fois que le téléversement mobile est terminé et que la transaction a commencé à être traitée. Cela vous permet de gérer le workflow utilisateur après la fin du téléversement mobile. Pour ce faire, ajoutez le Parameter `redirect_uri` au lien de téléversement mobile.

Exemple d'utilisation du Parameter `redirect_uri` :

<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>
  Lorsque vous utilisez le Parameter `redirect_uri`, assurez-vous d’ajouter l’URL de base (par exemple, `https://www.example.com`) du site web à ouvrir dans les **URL de redirection autorisées** du client d’API public utilisé. Voir [Configuring a Public API Client](/fr/vantage/documentation/tenant-admin/tenant-management/configure-client#configuring-a-public-api-client) pour plus d’informations.
</Warning>

<div id="the-ma-parameter">
  ## Le Parameter ma
</div>

Par défaut, le téléversement mobile pour les environnements on-premises n’est possible qu’à l’aide d’un navigateur web. Pour activer l’utilisation des micro applications dans les environnements on-premises, utilisez le Parameter `ma` :

1. Ajoutez le Parameter `ma` au lien de téléversement mobile.
2. Spécifiez l’un des environnements cloud ABBYY Vantage.

Dans ce cas, l’entrée mobile sera redirigée vers l’un des environnements cloud ABBYY Vantage pour démarrer une micro application sur l’appareil mobile de l’utilisateur. Tous les documents seront téléversés directement vers l’installation on-premises d’ABBYY Vantage.

Exemples d’utilisation du Parameter `ma` :

<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>

(situé en Europe occidentale),

<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>

(situé en Amérique du Nord),

<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>

(situé en Australie).
