[{"_1":2,"_440":-5,"_441":-5},"loaderData",{"_3":4,"_439":-5},"root",{"_5":6,"_27":28,"_31":-7,"_32":33,"_48":49,"_103":104,"_141":142},"meta",[7,10,14,17,24],{"_8":9},"title","Vue JS Examples - Authyo Docs",{"_11":12,"_13":9},"name","description","content",{"_11":15,"_13":16},"keywords","Vue JS Examples, Authyo Docs, API Design, API Specification, API Test, API Documentation, API Mock",{"_18":19,"_20":21,"_22":23},"tagName","link","rel","icon","href","https://assets.apidog.com/app/project-icon/custom/20250324/275ebf33-495d-409f-a6ba-528e616ea452.svg",{"_18":19,"_20":25,"_22":26},"canonical","https://authyo.apidog.io/vue-js-examples-811249m0","i18nState",{"_29":30},"clientLocale","en-US","errorCodeMessage","clientConfig",{"_34":35,"_36":37,"_38":39,"_40":41,"_46":47},"apiBaseUrl","https://api.apidog.com","appWebUrl","https://app.apidog.com","apidocBuiltinPrefixPath","https://assets.apidog.com/app/static/apidoc","cloudMockBaseUrls",{"_42":43,"_44":45},"pathMode","https://mock.apidog.com/m1/{projectId}-{version}-{service}","idMode","https://mock.apidog.com/m2/{projectId}-{version}-{service}","apidocIsShowLogo",true,"urlConfig",{"_50":51,"_21":54,"_92":93,"_99":100},"home",{"_52":53},"index","https://apidog.com",{"_55":56,"_57":58,"_59":58,"_60":61,"_62":63,"_64":65,"_66":67,"_68":69,"_70":71,"_72":73,"_74":75,"_76":77,"_78":79,"_80":81,"_82":83,"_84":85,"_86":87,"_88":89,"_90":91},"apidoc","https://assets.apidog.com/app/static/brand/apidoc.png","apidog","https://assets.apidog.com/app/static/brand/apidog-logo-256.png","apidog europe","googleDiscovery","https://assets.apidog.com/app/static/brand/google-discovery.png","har","https://assets.apidog.com/app/static/brand/har.png","iodocs","https://assets.apidog.com/app/static/brand/io-doc.png","jmeter","https://assets.apidog.com/app/static/brand/jmeter.png","openapi","https://assets.apidog.com/app/static/brand/openapi.png","postman","https://assets.apidog.com/app/static/brand/postman.png","raml","https://assets.apidog.com/app/static/brand/raml.png","wadl","https://assets.apidog.com/app/static/brand/wadl.png","curl","https://assets.apidog.com/app/static/brand/curl.png","insomnia","https://assets.apidog.com/app/static/brand/insomnia.png","wsdl","https://assets.apidog.com/app/static/brand/wsdl.png","markdown","https://assets.apidog.com/app/static/brand/markdown.png","html","https://assets.apidog.com/app/static/brand/html.png","protobuf","https://assets.apidog.com/app/static/brand/protobuf.png","soapui","https://assets.apidog.com/app/static/brand/soapui.svg","javaProject","https://assets.apidog.com/app/static/brand/java-project.png","help",{"_52":94,"_95":96,"_97":98},"https://apidog.com/help","browserExtension","https://chromewebstore.google.com/detail/apidog-browser-extension/dmhljjnonlhapikmelaefohecogokhio","csv","https://apidog.com/help/reference/csv","assets",{"_101":102},"logo512Png","https://assets.apidog.com/static/logo/apidog-logo-512.png","envConfig",{"_105":55,"_106":107,"_108":107,"_109":110,"_111":112,"_113":114,"_115":53,"_116":57,"_117":30,"_118":119,"_120":121,"_123":124,"_125":126,"_127":128,"_129":130,"_131":132,"_133":134,"_139":140},"RELEASE_BASE","DEBUG_API_BASE","","DEBUG_WEB_URL_BASE","AGENT_SERVER_API_BASE","https://web-proxy.apidog.com","APP_REGION","GLOBAL","APP_NAME","Apidog","APP_HOMEPAGE","APP_NAME_LOWER","DEFAULT_LOCALE","APP_BROWSER_EXTENSION_ADAPTER","apidogAgentCrossRequest","APP_API_SERVER_HOSTNAMES",[122],"api.apidog.com","APP_SUPPORT_EMAIL","support@apidog.com","APP_SCRIPT_MAIN_OBJECTS","$","SERVER_PROTOCOL","http","SERVER_HOST","apidog-api-svc","DEFAULT_DOC_LAYOUT","TwoColumn","NOT_CUSTOM_DOMAIN_HOSTNAMES",[135,136,137,138],"www.apidog.com","apidog.com","www.apidog.io","apidog.io","SERVER_REQUEST_TIMEOUT",15000,"docsDataState",{"_143":144,"_147":148,"_276":277,"_329":330,"_335":336,"_368":369,"_382":383,"_384":385,"_386":387,"_409":410,"_419":420,"_421":422,"_430":431,"_432":433,"_436":437},"navigation",{"_145":146},"type","NONE","sidebarTree",{"_149":-7,"_150":-7,"_151":152,"_153":154,"_267":268,"_269":270,"_273":274,"_275":-7},"goBackSidebarTreeApiFolderNode","rootSidebarTreeApiFolderNode","homeLink","/","sidebarTreeList",[155,171,177,183,225],{"_145":156,"_157":158,"_11":159,"_160":161,"_162":163,"_164":-7,"_165":166,"_21":-7,"_167":168,"_169":170},"doc","id",778067,"🐶 Walk through Authyo ","key","doc.778067","parentId",0,"resourceName","tags",[],"to","/-walk-through-authyo-778067m0","selected",false,{"_145":156,"_157":172,"_11":173,"_160":174,"_162":163,"_164":-7,"_165":175,"_21":-7,"_167":176,"_169":170},820454,"Error Codes","doc.820454",[],"/error-codes-820454m0",{"_145":156,"_157":178,"_11":179,"_160":180,"_162":163,"_164":-7,"_165":181,"_21":-7,"_167":182,"_169":170},959667,"About Pricing ","doc.959667",[],"/about-pricing-959667m0",{"_145":184,"_185":163,"_157":186,"_11":187,"_160":188,"_189":190,"_195":196,"_162":163,"_164":-7,"_12":-7,"_21":-7,"_167":107,"_169":170,"_224":47},"apiDetailFolder","docId",2640318,"APIs","apiDetailFolder.2640318","shareSettings",{"_191":192,"_193":194},"directoryTreeDisplayStyle","GENERAL_FOLDER","folderContentsDisplayingSettings","HIDE","children",[197,210,216],{"_145":198,"_157":199,"_11":200,"_160":201,"_202":203,"_204":205,"_206":207,"_162":186,"_164":-7,"_165":208,"_12":-7,"_21":-7,"_167":209,"_169":170},"apiDetail",12980154,"Send OTP","apiDetail.12980154","method","get","path","https://authyo.io/api/v1/authyoapi/sendotp","status","released",[],"/send-otp-12980154e0",{"_145":198,"_157":211,"_11":200,"_160":212,"_202":213,"_204":205,"_206":207,"_162":186,"_164":-7,"_165":214,"_12":-7,"_21":-7,"_167":215,"_169":170},12980722,"apiDetail.12980722","post",[],"/send-otp-12980722e0",{"_145":198,"_157":217,"_11":218,"_160":219,"_202":203,"_204":220,"_206":207,"_162":186,"_164":-7,"_165":221,"_12":-7,"_21":-7,"_167":223,"_169":170},12981380,"Verify OTP","apiDetail.12981380","https://authyo.io/api/v1/authyoapi/verifyotp",[222],"pet","/verify-otp-12981380e0","expanded",{"_145":184,"_185":163,"_157":226,"_11":227,"_160":228,"_189":229,"_195":230,"_162":163,"_164":-7,"_12":-7,"_21":-7,"_167":107,"_169":170,"_224":47},2877245,"Web SDKs","apiDetailFolder.2877245",{"_191":192,"_193":194},[231,237,243,249,255,261],{"_145":156,"_157":232,"_11":233,"_160":234,"_162":226,"_164":-7,"_165":235,"_21":-7,"_167":236,"_169":170},811275,"JavaScript","doc.811275",[],"/javascript-811275m0",{"_145":156,"_157":238,"_11":239,"_160":240,"_162":226,"_164":-7,"_165":241,"_21":-7,"_167":242,"_169":170},811261,"PHP","doc.811261",[],"/php-811261m0",{"_145":156,"_157":244,"_11":245,"_160":246,"_162":226,"_164":-7,"_165":247,"_21":-7,"_167":248,"_169":170},811196,"AngularJS Examples","doc.811196",[],"/angularjs-examples-811196m0",{"_145":156,"_157":250,"_11":251,"_160":252,"_162":226,"_164":-7,"_165":253,"_21":-7,"_167":254,"_169":170},811242,"TypeScript Examples","doc.811242",[],"/typescript-examples-811242m0",{"_145":156,"_157":256,"_11":257,"_160":258,"_162":226,"_164":-7,"_165":259,"_21":-7,"_167":260,"_169":170},811268,"React JS","doc.811268",[],"/react-js-811268m0",{"_145":156,"_157":262,"_11":263,"_160":264,"_162":226,"_164":-7,"_165":265,"_21":-7,"_167":266,"_169":47},811249,"Vue JS Examples","doc.811249",[],"/vue-js-examples-811249m0","selectedSidebarTreeNode",{"_145":156,"_157":262,"_11":263,"_160":264,"_162":226,"_164":-7,"_165":265,"_21":-7,"_167":266,"_169":47},"parentSidebarTreeApiFolderNodes",[271],{"_145":184,"_185":163,"_157":226,"_11":227,"_160":228,"_189":229,"_195":272,"_162":163,"_164":-7,"_12":-7,"_21":-7,"_167":107,"_169":170,"_224":47},[],"previousSidebarTreeNode",{"_145":156,"_157":256,"_11":257,"_160":258,"_162":226,"_164":-7,"_165":259,"_21":-7,"_167":260,"_169":170},"nextSidebarTreeNode","docsBaseConfig",{"_8":278,"_279":280,"_283":23,"_284":285,"_292":30,"_293":294,"_295":47,"_296":170,"_297":170,"_298":170,"_299":47,"_300":301,"_303":170,"_304":170,"_305":170,"_306":170,"_307":170,"_308":170,"_309":170,"_310":311,"_313":314,"_316":317,"_318":319,"_323":324,"_326":170,"_327":47,"_328":47},"Authyo Docs","logoSettings",{"_281":23,"_282":23},"light","dark","favicon","themePrimarySettings",{"_281":286,"_282":291},{"_287":288,"_289":290},"primaryColor","purple","textColor","WHITE",{"_287":288,"_289":290},"language","theme","system","displayThemeToggle","isShowPrefixUrl","isShowMaintainer","isShowUpdatedAt","isShowLastModifiedAt","displayFieldIds",[302],"api.label.sampleCode","hideLogo","hideRunInAppButton","hideTryItOutButton","exportable","hideCloneButton","hideMyAppButton","hideAppFormatExportOption","googleAnalytics",{"_312":107},"measurementId","visibilitySettings",{"_145":315},"PUBLIC","apiDocLayout","OneColumn","mockRule",{"_320":321,"_322":47},"rules",[],"enableSystemRule","corsProxySettings",{"_157":325},4,"enableVibeCodingViaMCP","enableCopyPage","enableLLMs","versionList",[331],{"_157":332,"_11":333,"_169":47,"_167":152,"_334":170},"736620","latest","disabled","resourceData",{"_145":156,"_337":338,"_354":355},"data",{"_157":262,"_11":263,"_339":107,"_13":340,"_341":226,"_342":343,"_344":345,"_346":347,"_348":349,"_350":349,"_145":107,"_165":351,"_352":353},"sidebarTitle","\n\n ![](https://authyo.io/image/apidoc/vuejs.png)\n\n# Vue JS \nIn Vue.js, you can integrate the CDN using the mounted lifecycle hook:\n\n\n ```html HelloWorld.html\n\n ```\n\n\n\n ```js HelloWorld.js\n \nexport default {\n mounted() {\n const script = document.createElement(\"script\");\n script.src = \"https://authyo.io/js/ay.purecdn.js\";\n script.async = true;\n document.body.appendChild(script);\n },\n methods: {\n sendOtp() {\n const appKey = 'your-app-key';\n const identity = 'user@example.com';\n authyo.sendOtp(appKey, identity, (response) => {\n if (response.success) {\n console.log(\"OTP sent successfully.\", response.message);\n } else {\n console.error(`Error Message: ${response.message}`);\n }\n });\n },\n verifyOtp() {\n const otp = '123456';\n const appKey = 'your-app-key';\n const identity = 'user@example.com';\n authyo.verifyOtp(appKey, identity, otp, (response) => {\n if (response.success) {\n console.log(\"OTP verified successfully!\", response.message);\n } else {\n console.error(`Error Message: ${response.message}`);\n }\n });\n },\n qrCode() {\n const appKey = 'your-app-key';\n authyo.getQRCode(appKey, (response) => {\n if (response.success) {\n console.log(\"QR Code in base64 image tag\", response.message);\n } \n });\n },\n },\n};\n\n ```\n\n","folderId","projectId",759303,"createdAt","2025-01-20T07:10:55.000Z","updatedAt","2025-02-11T07:38:28.000Z","creatorId",569416,"editorId",[],"visibility","INHERITED","extraData",{"_356":357,"_366":367},"apiFieldList",[358],{"_145":359,"_160":360,"_11":361,"_362":347,"_363":364,"_365":47},"date","updateAt","Last modified:","value","format","2025-02-11 07:38:28","hidden","dataSchemaDefinitions",{},"docsIdTypeData",{"_370":371,"_372":373,"_342":343,"_374":375,"_376":377,"_378":379,"_380":107,"_381":-7},"onlineType","APIDOC","onlineId",746932,"teamId",291476,"branchId",736620,"visitType","customDomain","subdirectory","specialFileType","notification",[],"footerBanner",[],"projectSetting",{"_388":389,"_390":391,"_405":406,"_407":408},"auth",{},"advancedSettings",{"_392":170,"_393":170,"_394":47,"_395":170,"_396":170,"_397":398,"_399":400},"enableJsonc","enableBigint","responseValidate","enableTestScenarioSetting","enableYAPICompatScript","isDefaultUrlEncoding",3,"publishedDocUrlRules",{"_401":402,"_403":404},"defaultRule","SLUGIFY_WITH_RESOURCE_KEY","resourceKeyStandard","NEW","securityScheme",{},"mockSettings",{},"environments",{"_411":-7,"_412":413,"_414":415},"selectedEnvironment","environmentList",[],"servers",[416],{"_157":417,"_11":418},"default","Default Server","searchSettings",{},"versionSettings",[423],{"_376":377,"_424":47,"_11":333,"_425":333,"_409":426},"isDefaultVersion","slug",{"_427":428,"_429":163},"environmentIds",[],"defaultEnvironmentId","seoInfos",["M"],"itemPathPrefix",{"_434":107,"_435":107,"_380":107},"baseUrl","versionSlug","appEnvMap",{"_438":119},"appBrowserExtensionAdapterKey","routes/_index/route","actionData","errors"]

Vue JS Examples

Vue JS#

Vue JS