[{"data":1,"prerenderedAt":129},["ShallowReactive",2],{"i-heroicons:building-office-2":3,"i-heroicons:computer-desktop":8,"i-heroicons:cloud":10,"i-heroicons:server":12,"i-heroicons:folder":14,"i-heroicons:chart-bar":16,"i-heroicons:lock-closed":18,"i-heroicons:rectangle-stack":20,"i-heroicons:scale":22,"i-heroicons:key":24,"i-heroicons:finger-print":26,"i-heroicons:cpu-chip":28,"i-heroicons:document-text":30,"i-heroicons:shield-exclamation":32,"i-heroicons:shield-check":34,"blog-ja-getting-started-with-yubion-fido2-server-service":36,"i-heroicons:user":127},{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":7},0,24,false,"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M2.25 21h19.5m-18-18v18m10.5-18v18m6-13.5V21M6.75 6.75h.75m-.75 3h.75m-.75 3h.75m3-6h.75m-.75 3h.75m-.75 3h.75M6.75 21v-3.375c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21M3 3h12m-.75 4.5H21m-3.75 3.75h.008v.008h-.008zm0 3h.008v.008h-.008zm0 3h.008v.008h-.008z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":9},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":11},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M2.25 15a4.5 4.5 0 0 0 4.5 4.5H18a3.75 3.75 0 0 0 1.332-7.257a3 3 0 0 0-3.758-3.848a5.25 5.25 0 0 0-10.233 2.33A4.5 4.5 0 0 0 2.25 15\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":13},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M21.75 17.25v-.228a4.5 4.5 0 0 0-.12-1.03l-2.268-9.64a3.375 3.375 0 0 0-3.285-2.602H7.923a3.375 3.375 0 0 0-3.285 2.602l-2.268 9.64a4.5 4.5 0 0 0-.12 1.03v.228m19.5 0a3 3 0 0 1-3 3H5.25a3 3 0 0 1-3-3m19.5 0a3 3 0 0 0-3-3H5.25a3 3 0 0 0-3 3m16.5 0h.008v.008h-.008zm-3 0h.008v.008h-.008z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":15},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M2.25 12.75V12A2.25 2.25 0 0 1 4.5 9.75h15A2.25 2.25 0 0 1 21.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 0 0-1.061-.44H4.5A2.25 2.25 0 0 0 2.25 6v12a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 18V9a2.25 2.25 0 0 0-2.25-2.25h-5.379a1.5 1.5 0 0 1-1.06-.44\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":17},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 0 1 3 19.875zm6.75-4.5c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125zm6.75-4.5c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 0 1-1.125-1.125z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":19},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M16.5 10.5V6.75a4.5 4.5 0 1 0-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 0 0 2.25-2.25v-6.75a2.25 2.25 0 0 0-2.25-2.25H6.75a2.25 2.25 0 0 0-2.25 2.25v6.75a2.25 2.25 0 0 0 2.25 2.25\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":21},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M6 6.878V6a2.25 2.25 0 0 1 2.25-2.25h7.5A2.25 2.25 0 0 1 18 6v.878m-12 0q.354-.126.75-.128h10.5q.396.002.75.128m-12 0A2.25 2.25 0 0 0 4.5 9v.878m13.5-3A2.25 2.25 0 0 1 19.5 9v.878m0 0a2.3 2.3 0 0 0-.75-.128H5.25q-.396.002-.75.128m15 0A2.25 2.25 0 0 1 21 12v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6c0-.98.626-1.813 1.5-2.122\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":23},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M12 3v17.25m0 0c-1.472 0-2.882.265-4.185.75M12 20.25c1.472 0 2.882.265 4.185.75M18.75 4.97A48 48 0 0 0 12 4.5c-2.291 0-4.545.16-6.75.47m13.5 0q1.515.215 3 .52m-3-.52l2.62 10.726c.122.499-.106 1.028-.589 1.202a6 6 0 0 1-2.031.352a6 6 0 0 1-2.031-.352c-.483-.174-.711-.703-.59-1.202zm-16.5.52q1.485-.305 3-.52m0 0l2.62 10.726c.122.499-.106 1.028-.589 1.202a6 6 0 0 1-2.031.352a6 6 0 0 1-2.031-.352c-.483-.174-.711-.703-.59-1.202z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":25},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M15.75 5.25a3 3 0 0 1 3 3m3 0a6 6 0 0 1-7.029 5.912c-.563-.097-1.159.026-1.563.43L10.5 17.25H8.25v2.25H6v2.25H2.25v-2.818c0-.597.237-1.17.659-1.591l6.499-6.499c.404-.404.527-1 .43-1.563A6 6 0 1 1 21.75 8.25\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":27},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M7.864 4.243A7.5 7.5 0 0 1 19.5 10.5c0 2.92-.556 5.709-1.568 8.269M5.742 6.364A7.47 7.47 0 0 0 4.5 10.5a7.46 7.46 0 0 1-1.15 3.993m1.989 3.559A11.2 11.2 0 0 0 8.25 10.5a3.75 3.75 0 1 1 7.5 0q0 .79-.064 1.565M12 10.5a14.94 14.94 0 0 1-3.6 9.75m6.633-4.596a18.7 18.7 0 0 1-2.485 5.33\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":29},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M8.25 3v1.5M4.5 8.25H3m18 0h-1.5M4.5 12H3m18 0h-1.5m-15 3.75H3m18 0h-1.5M8.25 19.5V21M12 3v1.5m0 15V21m3.75-18v1.5m0 15V21m-9-1.5h10.5a2.25 2.25 0 0 0 2.25-2.25V6.75a2.25 2.25 0 0 0-2.25-2.25H6.75A2.25 2.25 0 0 0 4.5 6.75v10.5a2.25 2.25 0 0 0 2.25 2.25m.75-12h9v9h-9z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":31},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":33},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M12 9v3.75m0-10.036A11.96 11.96 0 0 1 3.598 6A12 12 0 0 0 3 9.75c0 5.592 3.824 10.29 9 11.622c5.176-1.332 9-6.03 9-11.622c0-1.31-.21-2.57-.598-3.75h-.152c-3.196 0-6.1-1.25-8.25-3.286m0 13.036h.008v.008H12z\"\u002F>",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":35},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M9 12.75L11.25 15L15 9.75m-3-7.036A11.96 11.96 0 0 1 3.598 6A12 12 0 0 0 3 9.749c0 5.592 3.824 10.29 9 11.623c5.176-1.332 9-6.03 9-11.622c0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285\"\u002F>",{"id":37,"documentId":38,"title":39,"content":40,"slug":41,"published":42,"createdAt":43,"updatedAt":43,"publishedAt":44,"locale":45,"authorManual":46,"cover":47,"tags":99,"seo":124,"author":51},255,"ium7pn9ozh9ukmtzlb5me2te","最短でFIDO認証を導入できるサービス『YubiOn FIDO2 Server Service』を使ってみた","\u003Cp>先日、YubiOnの新しいサービス、「YubiOn FIDO2 Server Service」がリリースされました。これは主に開発者・開発ベンダー向けのサービスで、自社が提供するサービスなどに簡単にFIDO認証（パスキー認証）を導入するためのサービスとなっています。本来、FIDO認証を正しく検証するためにはWebAuthnなどの仕様に則って様々な判定処理を実装する必要がありますが、それらをサービスとして提供する事で、気軽にパスキー認証を導入する事ができるサービスとなっています。\u003C\u002Fp>\n\u003Cp>以前からソフト技研では「YubiOn FIDO2 Server」というFIDOアライアンスの認定を受けたFIDO2Server製品を持っていましたが、サービスという形では提供しておらず、お客様からの問い合わせに応じて環境を提供する形を取っておりました。今回の「YubiOn FIDO2 Server Service」はこれをサービス化することにより、お客様がより簡単に、また迅速に導入が行えるようになりました。\u003C\u002Fp>\n\u003Cp>そこで今回は、弊社が用意したサンプルのアプリケーションを使って、「YubiOn FIDO2 Server Service」サービスを導入することでいかにパスキー認証が簡単に行えるようになるかをご紹介したいと思います。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>■導入の流れ\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>システムの構成イメージや認証の仕組みなどサービスの概要を知りたい方は\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fguide\u002Fja\u002Foverview\u002Findex.html\">こちら\u003C\u002Fa>をご参照ください。\u003C\u002Fp>\n\u003Cp>導入の流れに関しまして、\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fguide\u002Fja\u002Fsetup\u002Findex.html\">マニュアル\u003C\u002Fa>にも記載がありますが、概ね以下の通りとなっています。\u003C\u002Fp>\n\u003Cp>１．カスタマー登録\u003C\u002Fp>\n\u003Cp>↓\u003C\u002Fp>\n\u003Cp>２．RP登録\u003C\u002Fp>\n\u003Cp>↓\u003C\u002Fp>\n\u003Cp>３．APIキー登録\u003C\u002Fp>\n\u003Cp>↓\u003C\u002Fp>\n\u003Cp>４．SDK組み込み\u003C\u002Fp>\n\u003Cp>↓\u003C\u002Fp>\n\u003Cp>５．動作検証\u003C\u002Fp>\n\u003Cp>本来であれば「４．SDK組み込み」において、SDK入手後、ご自身のサービスに「YubiOn FIDO2 Server Service」のAPIを呼び出すロジックを実装する必要がありますが、今回はこのロジックを既に実装しているサンプルを使用して体験したいと思います。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>■サンプルを動かしてみる\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>\u003Cstrong>利用した環境\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cul>\n\u003Cli>\u003Cp>OS：Windows 11\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>ブラウザ：Chrome\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>パスキー：Windows Hello（指紋認証）\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>ソースコードエディタ：Visual Studio Code\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>前提：\u003Ca href=\"https:\u002F\u002Fnodejs.org\u002Fen\u002Fdownload\u002F\">Node.js\u003C\u002Fa>とnpmをインストールしておく必要があります\u003C\u002Fp>\n\u003Cp>　　　私はNode.js（v22）とnpm（v10）を使用しました。\u003C\u002Fp>\n\u003Cp>　　　（Node.jsをインストールすれば通常はnpmもインストールされます）\u003C\u002Fp>\n\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Cp>\u003Cstrong>サービスの登録・準備\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Col>\n\u003Cli>\u003Cp>カスタマーを無料登録する\u003C\u002Fp>\n\u003Cp>●手順\u003C\u002Fp>\n\u003Cp>「\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fja\">YubiOn FIDO2 Server Service\u003C\u002Fa>」を開き、右上の「新規登録」をクリックします。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>個人情報の取扱いに同意し、カスタマー登録画面に進みます。\u003C\u002Fp>\n\u003Cp>必要なカスタマー情報を入力、及び利用規約に同意し、「登録」ボタンをクリックします。\u003C\u002Fp>\n\u003Cp>　・管理者名：YubiOn（任意の名前）\u003C\u002Fp>\n\u003Cp>　・管理者メールアドレス：登録後、アクティベートするためのメールが届きます\u003C\u002Fp>\n\u003Cp>　・カスタマー名：Test Customer（任意の名前）\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_2_4c50671a65.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>カスタマー登録後、管理者メールアドレス宛にカスタマー登録承認メールが送信されますので、\u003C\u002Fp>\n\u003Cp>メール本文内のURLリンクをクリックし、カスタマーアクティベーション画面を開きます。\u003C\u002Fp>\n\u003Cp>「YubiOn FIDO2 Server Service」の管理WEBサイトにログインするためのパスキーを登録すれば、アクティベーションが完了します。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_3_bfaf16e479.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>パスキー登録モーダルが表示されますので、案内に従ってパスキーの登録を行います。\u003C\u002Fp>\n\u003Cp>今回はWindows Helloを利用して指紋で登録してみます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_4_5d6fe378a8.png\" alt=\"\">\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>RPを登録する\u003C\u002Fp>\n\u003Cp>\u003Cstrong>RP\u003C\u002Fstrong>（Relying Party）はFIDOの用語で、FIDO認証を導入するサービスやWebアプリケーション自体を指します。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>RP ID\u003C\u002Fstrong>は、そのサービスを識別するためのIDで、通常はドメイン名が使用されます。「YubiOn FIDO2 Server Service」の場合、第三者が勝手にサービスを登録するのを防ぐため、通常はRP登録時にドメインの所有者であることを確認しています。ただし、開発環境での動作確認を容易にするために、末尾が.localhostのRP IDは例外的に確認なしで利用することが可能となっており、今回はこの仕組みを使って作業を進めます。\u003C\u002Fp>\n\u003Cp>●手順\u003C\u002Fp>\n\u003Cp>「YubiOn FIDO2 Server Service」の管理WEBサイトにログインし、RP画面を開きます。\u003C\u002Fp>\n\u003Cp>「RP登録」ボタンをクリックします。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_5_c8bfec6644.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>RP登録モーダルが開きますので、情報を入力し、登録します。\u003C\u002Fp>\n\u003Cp>　・RP ID：test-app**.localhost**（任意の名前+\u003Cstrong>.localhost\u003C\u002Fstrong>）\u003C\u002Fp>\n\u003Cp>　・RP名称：Test App（任意の名前）\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_6_f379fc0458.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>通常であればRPの所有確認を行うことにより「検証済み」状態になりますが、今回はRP IDに開発用の「.localhost」を利用しているので、RP登録時点で「検証済み」になっていることが確認できます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_7_2d7b0256a5.png\" alt=\"\">\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>APIキーを登録する\u003C\u002Fp>\n\u003Cp>登録したRPから「YubiOn FIDO2 Server Service」のAPIにアクセスする際に必要なキーを作成します。\u003Cstrong>Nonce署名認証\u003C\u002Fstrong>で登録し、登録後に表示される\u003Cstrong>API認証ID\u003C\u002Fstrong>と\u003Cstrong>シークレットキー\u003C\u002Fstrong>を控えておく必要があります。\u003C\u002Fp>\n\u003Cp>●手順\u003C\u002Fp>\n\u003Cp>RP詳細の「APIキー」画面を開きます（RP詳細はRP画面で登録したRPクリックで開きます）。\u003C\u002Fp>\n\u003Cp>「APIキー登録」ボタンをクリックします。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_8_80125359d7.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>APIキー登録モーダルが開きますので、情報を入力し、登録します。\u003C\u002Fp>\n\u003Cp>　・API認証名称：Test API key（任意の名前）\u003C\u002Fp>\n\u003Cp>　・API認証種別：\u003Cstrong>Nonce署名認証\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>※今回はサンプルアプリの実装上、Nonce署名認証を選択しています。\u003C\u002Fp>\n\u003Cp>　　　　　　　　　　実運用時は適切な\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fguide\u002Fja\u002Fdeveloper\u002Fapi-reference\u002Fapi_common_info\u002Findex.html#api%E8%AA%8D%E8%A8%BC%E6%96%B9%E6%B3%95\">認証種別\u003C\u002Fa>を選択してください。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_9_65caf99bbe.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>APIキー登録後、\u003Cstrong>API認証ID\u003C\u002Fstrong>と\u003Cstrong>シークレットキー\u003C\u002Fstrong>を控えておきます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_10_0277089a9a.png\" alt=\"\">\u003C\u002Fp>\n\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cp>\u003Cstrong>サンプルアプリケーションの準備\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>Visual Studio Code（VS Code）を利用してPC上でWEBサーバーを動作させます。\u003C\u002Fp>\n\u003Col>\n\u003Cli>\u003Cp>\u003Ca href=\"https:\u002F\u002Fgithub.com\u002FYubiOn-Dev-Team\u002Fyubion-fido2-server-sdk-js\u002F\">SDK\u003C\u002Fa>のサンプルアプリケーションを入手する\u003C\u002Fp>\n\u003Cp>Node.jsのSDKソースコードには、FIDOの登録・認証機能を試せるシンプルなサンプルアプリケーションが含まれています。このサンプルは、SDKをGitHubからソースコードをクローンするか、ZIPファイルをダウンロードして、その中のsampleディレクトリを利用することでアクセスできます。具体的なセットアップ手順は、sampleディレクトリ直下のREADME.md、またはREADME.ja.mdに記載されています。\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>環境変数を設定する\u003C\u002Fp>\n\u003Cp>sample\u002Fserver\u002F.env.sampleファイルをコピーして、同じ場所に.envファイルを作成します。\u003C\u002Fp>\n\u003Cp>VS Code上で.envファイルを編集します。\u003C\u002Fp>\n\u003Cp>　・FSS_RP_ID：test-app.localhost（登録したRP ID）\u003C\u002Fp>\n\u003Cp>　・FSS_API_KEY_ID：（APIキー登録時に控えておいたAPI認証ID）\u003C\u002Fp>\n\u003Cp>　・FSS_API_SECRET：（APIキー登録時に控えておいたシークレットキー）\u003C\u002Fp>\n\u003Cp>　・SESSION_SECRET：（ユーザーセッションを保護するための長くランダムな文字列）\u003C\u002Fp>\n\u003Cp>　・CLIENT_ORIGIN_URL：\u003Ca href=\"http:\u002F\u002Ftest-app.localhost:5173%EF%BC%88%E3%82%AF%E3%83%A9%E3%82%A4%E3%82%A2%E3%83%B3%E3%83%88%E3%82%A2%E3%83%97%E3%83%AA%E3%81%AEURL%EF%BC%89\">http:\u002F\u002Ftest-app.localhost:5173（クライアントアプリのURL）\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_11_26b139afc2.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>アプリの構造的にバックエンドとフロントエンドでサーバーが分かれている形になっているので、両方を起動する必要があります。\u003C\u002Fp>\n\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cp>３．バックエンドを起動する\u003C\u002Fp>\n\u003Cp>VS Codeのターミナルを開き、以下の通りコマンドを実行します。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>#sample\u002Fserverディレクトリに移動\ncd sample\u002Fserver\n\n#依存関係をインストール\nnpm ci\n\n#開発サーバーを起動\nnpm run dev\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>サーバーが\u003Ca href=\"http:\u002F\u002Flocalhost:3000%E3%81%A7%E8%B5%B7%E5%8B%95%E3%81%99%E3%82%8C%E3%81%B0OK%E3%81%A7%E3%81%99%E3%80%82\">http:\u002F\u002Flocalhost:3000で起動すればOKです。\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>４．フロントエンドを起動する\u003C\u002Fp>\n\u003Cp>VS Codeで新たにターミナルを開き、以下の通りコマンドを実行します。\u003C\u002Fp>\n\u003Cpre>\u003Ccode>#sample\u002Fclientディレクトリに移動\ncd sample\u002Fclient\n\n#依存関係をインストール\nnpm ci\n\n#開発サーバーを起動\nnpm run dev\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>クライアントの開発サーバーが \u003Ca href=\"http:\u002F\u002Flocalhost:5173\">http:\u002F\u002Flocalhost:5173\u003C\u002Fa> のようなポートで起動します。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>サンプルの動作検証\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>サーバー側とクライアント側が起動したところで、ブラウザからパスキーの登録と認証、動作検証を行いたいと思います。\u003C\u002Fp>\n\u003Col>\n\u003Cli>\u003Cp>サンプルアプリケーションにアクセスする\u003C\u002Fp>\n\u003Cp>ブラウザで、\u003Ca href=\"http:\u002F\u002Ftest-app.localhost:5173\u002F%EF%BC%88http:\u002F\u002F\">http:\u002F\u002Ftest-app.localhost:5173\u002F（http:\u002F\u002F\u003C\u002Fa>\u003Cem><設定したRPID>\u003C\u002Fem>:5173\u002F）にアクセスします。上記の設定が正しく行われていれば、サンプルアプリケーションのログイン画面が開きます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_12_7da13a6468.png\" alt=\"\">\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>ユーザーとパスキーを登録する\u003C\u002Fp>\n\u003Cp>「Create a new account」リンクをクリックし、ユーザー登録画面を開きます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_13_365b426be9.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>任意のユーザー情報を入力後、「Register and Add Passkey」ボタンをクリックします。\u003C\u002Fp>\n\u003Cp>パスキー登録モーダルが表示されますので、案内に従ってパスキーの登録を行います。\u003C\u002Fp>\n\u003Cp>今回も「YubiOn FIDO2 Server Service」と同様に指紋で登録してみます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_14_c37a7720ed.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>SDKが組み込まれていることにより、パスキーの登録が正常に行われます。\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>ログインする\u003C\u002Fp>\n\u003Cp>「Login with Passkey」ボタンをクリックし、パスキーでのログインを行います。\u003C\u002Fp>\n\u003Cp>ユーザーリストが表示されました。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_15_df5cf08ab4.png\" alt=\"\">\u003C\u002Fp>\n\u003Cp>パスキー認証も成功です！\u003C\u002Fp>\n\u003C\u002Fli>\n\u003Cli>\u003Cp>動作検証する\u003C\u002Fp>\n\u003Cp>動作検証として、「YubiOn FIDO2 Server Service」の管理WEBサイトを確認してみましょう。\u003C\u002Fp>\n\u003Cp>RP詳細の「APIログ」画面を開くと、情報が反映されており、パスキーの登録、認証が正常に行われたことが確認できます。\u003C\u002Fp>\n\u003Cp>\u003Cimg src=\"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_16_09ba5f51b4.png\" alt=\"\">\u003C\u002Fp>\n\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cp>いかがでしたか？サンプルではありますが、アプリケーションにSDKを組み込み、実際にパスキーの登録、認証を行ってみました。本来であれば、自身のサービスにロジックを実装してSDKを組み込むという手順が必要になりますが、SDKを組み込むだけで、こんなにも簡単にFIDO認証が導入できることを実感いただけたかと思います。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>■まとめ\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>「YubiOn FIDO2 Server Service」は、FIDO認証の導入を検討している企業にとって、開発コストと時間を大幅に削減する強力なソリューションです。セキュリティの強化とユーザーエクスペリエンスの向上を両立させるFIDO認証を、このサービスを利用することで迅速かつ効率的に自社サービスへ組み込むことが可能となります。\u003C\u002Fp>\n\u003Cp>まずは無料で登録できますのでお気軽にお試しください。\u003C\u002Fp>\n\u003Cp>\u003Cstrong>■関連リンク\u003C\u002Fstrong>\u003C\u002Fp>\n\u003Cp>[YubiOn FIDO2 Server Service]\u003C\u002Fp>\n\u003Cp>\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fja\">https:\u002F\u002Ffss.yubion.com\u002Fja\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>[YubiOn FIDO2 Server Serviceマニュアル]\u003C\u002Fp>\n\u003Cp>\u003Ca href=\"https:\u002F\u002Ffss.yubion.com\u002Fguide\u002Fja\u002F\">https:\u002F\u002Ffss.yubion.com\u002Fguide\u002Fja\u002F\u003C\u002Fa>\u003C\u002Fp>\n","getting-started-with-yubion-fido2-server-service","2025-09-24","2026-04-28T09:01:16.509Z","2026-04-28T09:01:19.591Z","ja","Asa",{"id":48,"documentId":49,"name":50,"alternativeText":51,"caption":51,"focalPoint":51,"width":52,"height":53,"formats":54,"hash":93,"ext":56,"mime":60,"size":94,"url":95,"previewUrl":51,"provider":96,"provider_metadata":51,"createdAt":97,"updatedAt":97,"publishedAt":98},1828,"zzd21gxemlp08goawhq7jx56","blog-getting-started-with-yubion-fido2-server-service-1.png",null,1920,869,{"large":55,"small":66,"medium":75,"thumbnail":84},{"ext":56,"url":57,"etag":58,"hash":59,"mime":60,"name":61,"path":51,"size":62,"width":63,"height":64,"sizeInBytes":65},".png","https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Flarge_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png","6024a16fbd700a352b2f2e8c4f7d60ba","large_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94","image\u002Fpng","large_blog-getting-started-with-yubion-fido2-server-service-1.png",380.66,1000,453,380659,{"ext":56,"url":67,"etag":68,"hash":69,"mime":60,"name":70,"path":51,"size":71,"width":72,"height":73,"sizeInBytes":74},"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fsmall_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png","681180b9a945738294fdd1a2d32a43c0","small_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94","small_blog-getting-started-with-yubion-fido2-server-service-1.png",100.63,500,226,100632,{"ext":56,"url":76,"etag":77,"hash":78,"mime":60,"name":79,"path":51,"size":80,"width":81,"height":82,"sizeInBytes":83},"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fmedium_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png","16f4771699de449c2da5d87f2628faf0","medium_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94","medium_blog-getting-started-with-yubion-fido2-server-service-1.png",210.74,750,339,210744,{"ext":56,"url":85,"etag":86,"hash":87,"mime":60,"name":88,"path":51,"size":89,"width":90,"height":91,"sizeInBytes":92},"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fthumbnail_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png","2160405387ab357f07c9e6140bbaf647","thumbnail_blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94","thumbnail_blog-getting-started-with-yubion-fido2-server-service-1.png",33.79,245,111,33789,"blog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94",234.92,"https:\u002F\u002Fdty9gbw7gew16.cloudfront.net\u002Fuploads\u002Fblog_getting_started_with_yubion_fido2_server_service_1_31ea9b8d94.png","aws-s3","2026-04-28T09:00:00.608Z","2026-04-28T09:00:00.609Z",[100,106,112,118],{"id":101,"documentId":102,"name":103,"slug":51,"createdAt":104,"updatedAt":104,"publishedAt":105},62,"rr0ev9p1qk4a3779ettcus1r","パスキー","2026-04-28T05:32:57.440Z","2026-04-28T05:32:59.286Z",{"id":107,"documentId":108,"name":109,"slug":51,"createdAt":110,"updatedAt":110,"publishedAt":111},54,"aik3it1d9trj8u1rr5wbmw2d","FIDO2","2026-04-28T05:24:47.451Z","2026-04-28T05:24:49.300Z",{"id":113,"documentId":114,"name":115,"slug":51,"createdAt":116,"updatedAt":116,"publishedAt":117},76,"rbzc10g6bv2r9lsh5hq00jqa","YubiOnFIDO2Server","2026-04-28T05:50:46.077Z","2026-04-28T05:50:47.914Z",{"id":119,"documentId":120,"name":121,"slug":51,"createdAt":122,"updatedAt":122,"publishedAt":123},56,"o72uon3nd8d31kuwuly0jame","YubiOn FIDO2 Server Service","2026-04-28T05:24:54.868Z","2026-04-28T05:24:56.719Z",{"id":125,"metaDescription":126},489,"新サービス「YubiOn FIDO2 Server Service」をご紹介。自社サービスへFIDO認証（パスキー認証）を簡単かつ迅速に導入する方法を、サンプルアプリを使って解説します。",{"left":4,"top":4,"width":5,"height":5,"rotate":4,"vFlip":6,"hFlip":6,"body":128},"\u003Cpath fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\" d=\"M15.75 6a3.75 3.75 0 1 1-7.5 0a3.75 3.75 0 0 1 7.5 0M4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.9 17.9 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632\"\u002F>",1783406260781]