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

# Vantage Mobile Input の設定

> Vantage Mobile Input のアップロードリンクを設定します。取り込みフローに合わせて、文書タイプ、ページ、Redirect URI、言語、テーマ、その他のパラメーターをカスタマイズします。

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

モバイルアップロード機能は、次の追加Parameterで設定できます。

* [`md` パラメーター](#the-md-parameter) は、1 回のトランザクションで取り込むドキュメントの数と名前、および各ドキュメントに含めるページをカスタマイズします。
* [`dt` パラメーター](#the-dt-parameter) は、モバイルアップロードで単一のドキュメントタイプのみを対象とするようにカスタマイズします。
* [`redirect&#95;uri` Parameter](#the-redirect-uri-parameter) は、モバイルアップロード完了後に開かれる Web サイトへのリンクをカスタマイズします。
* [`ma` Parameter](#the-ma-parameter) は、オンプレミス環境でマイクロアプリケーションを使用できるようにします。

<div id="the-md-parameter">
  ## md パラメーター
</div>

1 回のトランザクションで処理する必要がある文書の数、種類、名前を指定して、文書の構成を `md` パラメーター で定義できます。Vantage Mobile Input は、後続の処理のために指定された文書を正確に取り込めるよう、ユーザーをガイドします。

既定では、`md` パラメーター は、選択した Skill に応じて値が 0 または 1 のいずれかで、モバイルアップロードリンクに含まれています。次のいずれかの値を指定できます。

| Value                                                                      | Description                                         |
| :------------------------------------------------------------------------- | :-------------------------------------------------- |
| `0`                                                                        | 任意のページ数を持つ 1 つの文書を取り込みます。                           |
| `1`                                                                        | 任意のページ数を持つ任意の数の文書を取り込みます。                           |
| [Encoded URL to JSON file](/ja/vantage/developer/mobile-upload/json-input) | カスタムの名前を持つ指定された数の文書を、各文書ごとに定義されたページ数とページ名と共に取り込みます。 |
| [Encoded JSON file](/ja/vantage/developer/mobile-upload/json-input)        | カスタムの名前を持つ指定された数の文書を、各文書ごとに定義されたページ数とページ名と共に取り込みます。 |

<Info>
  `md` パラメーター 用の **JSON ファイル** は、マイクロアプリケーションからのモバイルアップロードでのみ使用できます。
</Info>

Example of using the encoded URL to JSON file for the `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>

Example of using the encoded JSON file for the `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>
  モバイルアップロードリンクで [dt パラメーター](#the-dt-parameter) が使用されている場合は、`md` パラメーター の値は無視されます。
</Info>

<div id="the-dt-parameter">
  ## dt パラメーター
</div>

モバイルアップロードで単一のドキュメントタイプのみを取り込むようにカスタマイズするには、`dt` パラメーター を使用します。

1. モバイルアップロードリンクに dt パラメーター を追加します。
2. 次のいずれかの値を指定します。

| Value      | Description          |
| :--------- | :------------------- |
| `idcard`   | ID カードの表裏両面を取り込みます。  |
| `passport` | パスポートの最初のページを取り込みます。 |
| `document` | 上記以外のドキュメントを取り込みます。  |

<Info>
  **dt** パラメーター は省略可能で、デフォルト値はありません。
</Info>

**dt** パラメーター を使用すると、マイクロアプリケーションのカメラが調整され、身分証明書が自動的に取り込まれるようになります。

ID カードを取り込むための `dt` パラメーター の使用例:

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

パスポートのページを取り込むための `dt` パラメーター の使用例:

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

<Warning>
  モバイルアップロードリンクで **dt** パラメーター を使用している場合、選択した Skill に関係なく、1 つのトランザクションでアップロードできるドキュメントは 1 つだけです。
</Warning>

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

モバイルアップロードが完了し、トランザクションの処理が開始されたタイミングで開く Web サイトのリンクをカスタマイズできます。これにより、モバイルアップロード完了後のユーザーのワークフローを管理できます。そのためには、モバイルアップロードリンクに `redirect_uri` Parameter を追加します。

`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>
  `redirect_uri` Parameter を使用する場合は、開く Web サイトのベース URL (例: `https://www.example.com`) を、使用する公開 API クライアントの **許可されたリダイレクト URL** に必ず追加してください。詳細については、[公開 API クライアントの設定](/ja/vantage/documentation/tenant-admin/tenant-management/configure-client#configuring-a-public-api-client) を参照してください。
</Warning>

<div id="the-ma-parameter">
  ## ma パラメーター
</div>

既定では、オンプレミス環境でモバイルアップロードを行うには、Web ブラウザーを使用する必要があります。オンプレミス環境でマイクロアプリケーションを使用できるようにするには、`ma` パラメーターを使用します。

1. モバイルアップロードリンクに `ma` パラメーターを追加します。
2. ABBYY Vantage のクラウド環境のいずれか 1 つを指定します。

この場合、ユーザーのモバイルデバイスでマイクロアプリケーションを起動するために、モバイル入力は ABBYY Vantage のクラウド環境のいずれか 1 つにリダイレクトされます。すべてのドキュメントは、ABBYY Vantage のオンプレミス環境に直接アップロードされます。

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

(西ヨーロッパに所在)

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

(北米に所在)

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

(オーストラリアに所在) 。
