[{"_path":"/get-started","_draft":false,"_partial":false,"_empty":false,"title":"Introduction","description":"@nuxtjs/supabase is a Nuxt module for first class integration with Supabase.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checkout the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3"}]},{"type":"text","value":" documentation and "},{"type":"element","tag":"a","props":{"href":"https://supabase.com","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Supabase"}]},{"type":"text","value":" to learn more."}]},{"type":"element","tag":"alert","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For integrating Supabase with Nuxt 2, checkout "},{"type":"element","tag":"a","props":{"href":"https://github.com/supabase-community/nuxt-supabase","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"supabase-community/nuxt-supabase"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@nuxtjs/supabase"}]},{"type":"text","value":" dev dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add --dev @nuxtjs/supabase\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"yarn add --dev @nuxtjs/supabase\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install @nuxtjs/supabase --save-dev\n","filename":"NPM","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npm install @nuxtjs/supabase --save-dev\n"}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@nuxtjs/supabase"}]},{"type":"text","value":" to the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]},{"type":"text","value":" section of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config.js"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  modules: ['@nuxtjs/supabase'],\n})\n","filename":"nuxt.config.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  modules: ['@nuxtjs/supabase'],\n})\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Lastly, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_URL"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_KEY"}]},{"type":"text","value":" to the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".env"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"SUPABASE_URL=\"https://example.supabase.com\"\nSUPABASE_KEY=\"<your_key>\"\n","filename":".env","language":"zsh"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"SUPABASE_URL=\"https://example.supabase.com\"\nSUPABASE_KEY=\"<your_key>\"\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can configure the supabase module by using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"supabase"}]},{"type":"text","value":" key in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  // ...\n  supabase: {\n    // Options\n  }\n}\n","filename":"nuxt.config.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  // ...\n  supabase: {\n    // Options\n  }\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"url"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"url"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_URL"}]},{"type":"text","value":" (ex: "},{"type":"element","tag":"a","props":{"href":"https://example.supabase.co","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"https://example.supabase.co"}]},{"type":"text","value":")"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The unique Supabase URL which is supplied when you create a new project in your project dashboard."}]},{"type":"element","tag":"h3","props":{"id":"key"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_KEY"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase 'anon key', used to bypass the Supabase API gateway and interact with your Supabase database making use of user JWT to apply RLS Policies."}]},{"type":"element","tag":"h3","props":{"id":"servicekey"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serviceKey"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_SERVICE_KEY"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase 'service role key', has super admin rights and can bypass your Row Level Security."}]},{"type":"element","tag":"h3","props":{"id":"client"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"client"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{}"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase client options "},{"type":"element","tag":"a","props":{"href":"https://github.com/supabase/supabase-js/blob/master/src/lib/types.ts#L10","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"available here"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"demo"},"children":[{"type":"text","value":"Demo"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A live demo is made for see this module in action on "},{"type":"element","tag":"a","props":{"href":"https://n3-supabase.netlify.app","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"n3-supabase.netlify.app"}]},{"type":"text","value":", read more in the "},{"type":"element","tag":"a","props":{"href":"/demo"},"children":[{"type":"text","value":"demo section"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://n3-supabase.netlify.app","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"img","props":{"alt":"Supabase demo with Nuxt 3","src":"https://user-images.githubusercontent.com/904724/160422461-8f87500a-8dec-4413-86b2-ba04e1b2d17b.png"},"children":[]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also checkout the "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=jIyiRT6zT8Q","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"YouTube video"}]},{"type":"text","value":" about its usage in a live demo."}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Checkout the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3"}]},{"type":"text","value":" documentation and "},{"type":"element","tag":"a","props":{"href":"https://supabase.com","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Supabase"}]},{"type":"text","value":" to learn more."}]},{"type":"element","tag":"alert","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"For integrating Supabase with Nuxt 2, checkout "},{"type":"element","tag":"a","props":{"href":"https://github.com/supabase-community/nuxt-supabase","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"supabase-community/nuxt-supabase"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@nuxtjs/supabase"}]},{"type":"text","value":" dev dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add --dev @nuxtjs/supabase\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"yarn add --dev @nuxtjs/supabase"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install @nuxtjs/supabase --save-dev\n","filename":"NPM","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"npm install @nuxtjs/supabase --save-dev"}]}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@nuxtjs/supabase"}]},{"type":"text","value":" to the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]},{"type":"text","value":" section of "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config.js"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  modules: ['@nuxtjs/supabase'],\n})\n","filename":"nuxt.config.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"defineNuxtConfig"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'nuxt'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"defineNuxtConfig"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"modules"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'@nuxtjs/supabase'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Lastly, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_URL"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_KEY"}]},{"type":"text","value":" to the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".env"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"SUPABASE_URL=\"https://example.supabase.com\"\nSUPABASE_KEY=\"<your_key>\"\n","filename":".env","language":"zsh"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"SUPABASE_URL="}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"\"https://example.supabase.com\""}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"SUPABASE_KEY="}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"\"<your_key>\""}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"You can configure the supabase module by using the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"supabase"}]},{"type":"text","value":" key in "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config"}]},{"type":"text","value":":"}]},{"type":"element","tag":"code","props":{"code":"import { defineNuxtConfig } from 'nuxt'\n\nexport default defineNuxtConfig({\n  // ...\n  supabase: {\n    // Options\n  }\n}\n","filename":"nuxt.config.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"defineNuxtConfig"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'nuxt'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"defineNuxtConfig"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"({"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#7F848E"}},"children":[{"type":"text","value":"// ..."}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"supabase"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"style":{"color":"#7F848E"}},"children":[{"type":"text","value":"// Options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"url"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"url"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_URL"}]},{"type":"text","value":" (ex: "},{"type":"element","tag":"a","props":{"href":"https://example.supabase.co","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"https://example.supabase.co"}]},{"type":"text","value":")"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The unique Supabase URL which is supplied when you create a new project in your project dashboard."}]},{"type":"element","tag":"h3","props":{"id":"key"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_KEY"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase 'anon key', used to bypass the Supabase API gateway and interact with your Supabase database making use of user JWT to apply RLS Policies."}]},{"type":"element","tag":"h3","props":{"id":"servicekey"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serviceKey"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"process.env.SUPABASE_SERVICE_KEY"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase 'service role key', has super admin rights and can bypass your Row Level Security."}]},{"type":"element","tag":"h3","props":{"id":"client"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"client"}]}]},{"type":"element","tag":"ul","props":{},"children":[{"type":"element","tag":"li","props":{},"children":[{"type":"text","value":"Default: "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"{}"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Supabase client options "},{"type":"element","tag":"a","props":{"href":"https://github.com/supabase/supabase-js/blob/master/src/lib/types.ts#L10","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"available here"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h2","props":{"id":"demo"},"children":[{"type":"text","value":"Demo"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"A live demo is made for see this module in action on "},{"type":"element","tag":"a","props":{"href":"https://n3-supabase.netlify.app","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"n3-supabase.netlify.app"}]},{"type":"text","value":", read more in the "},{"type":"element","tag":"a","props":{"href":"/demo"},"children":[{"type":"text","value":"demo section"}]},{"type":"text","value":"."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"element","tag":"a","props":{"href":"https://n3-supabase.netlify.app","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"img","props":{"alt":"Supabase demo with Nuxt 3","src":"https://user-images.githubusercontent.com/904724/160422461-8f87500a-8dec-4413-86b2-ba04e1b2d17b.png"},"children":[]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also checkout the "},{"type":"element","tag":"a","props":{"href":"https://www.youtube.com/watch?v=jIyiRT6zT8Q","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"YouTube video"}]},{"type":"text","value":" about its usage in a live demo."}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"installation","depth":2,"text":"Installation"},{"id":"options","depth":2,"text":"Options","children":[{"id":"url","depth":3,"text":"url"},{"id":"key","depth":3,"text":"key"},{"id":"servicekey","depth":3,"text":"serviceKey"},{"id":"client","depth":3,"text":"client"}]},{"id":"demo","depth":2,"text":"Demo"}]}},"_type":"markdown","_id":"content:2.get-started.md","_source":"content","_file":"2.get-started.md","_extension":"md"},{"_path":"/usage/services","_draft":false,"_partial":false,"_empty":false,"title":"Server route services","description":"Learn how to use the Supabase module in your Nuxt 3 application.","excerpt":{"type":"root","children":[{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This section assumes you're familiar with "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/concepts/server-engine#standalone-server","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":", the server engine powered by Nuxt."}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to provide utilities similar to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"vue"}]},{"type":"text","value":" composables in "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/server-routes/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"server routes"}]},{"type":"text","value":", this module exposes services providing the same functionnalities."}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseclient"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseClient"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is working similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/composables#usesupabaseclient"},"children":[{"type":"text","value":"useSupabaseClient"}]},{"type":"text","value":" composable but is designed to be used in server routes."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and just import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseClient } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseClient(event)\n\n  const { data } = await client.from('librairies').select()\n\n  return { librairies: data }\n})\n","filename":"server/api/librairies.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { serverSupabaseClient } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseClient(event)\n\n  const { data } = await client.from('librairies').select()\n\n  return { librairies: data }\n})\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your API route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const fetchLibrairy = async () => {\n  const { librairies } = await $fetch('/api/librairies')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const fetchLibrairy = async () => {\n  const { librairies } = await $fetch('/api/librairies')\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Be careful, if you want to call this route on SSR, please read this "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/data-fetching/#isomorphic-fetch-and-fetch","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"section"}]},{"type":"text","value":", you must send your browser cookies including your supabase token."}]},{"type":"element","tag":"code","props":{"code":"const { data: { librairies }} = await useFetch('/api/librairies', {\n  headers: useRequestHeaders(['cookie'])\n})\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const { data: { librairies }} = await useFetch('/api/librairies', {\n  headers: useRequestHeaders(['cookie'])\n})\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseservicerole"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is designed to work only on server side."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"It works similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/services#serverSupabaseClient"},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"text","value":" but it provides a client with super admin rights that can bypass your Row Level Security."}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The client is initialized with the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_SERVICE_KEY"}]},{"type":"text","value":" you must have in your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".env"}]},{"type":"text","value":" file. Checkout the doc if you want to know more about "},{"type":"element","tag":"a","props":{"href":"https://supabase.com/docs/learn/auth-deep-dive/auth-deep-dive-jwts#jwts-in-supabase","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Supabase keys"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and just import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseServiceRole } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseServiceRole(event)\n\n  const { data } = await client.from('rls-protected-table').select()\n\n  return { sensitiveData: data }\n})\n","filename":"server/api/bypass-rls.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { serverSupabaseServiceRole } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseServiceRole(event)\n\n  const { data } = await client.from('rls-protected-table').select()\n\n  return { sensitiveData: data }\n})\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your API route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const fetchSensitiveData = async () => {\n  const { sensitiveData } = await useFetch('/api/bypass-rls')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const fetchSensitiveData = async () => {\n  const { sensitiveData } = await useFetch('/api/bypass-rls')\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseuser"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseUser"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is working similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/composables#usesupabaseuser"},"children":[{"type":"text","value":"useSupabaseUser"}]},{"type":"text","value":" composable but is designed to be used in server routes."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseUser"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseUser } from '#supabase/server'\n\nexport default defineEventHandler(async (event) => {\n  return await serverSupabaseUser(event)\n})\n","filename":"server/api/me.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"import { serverSupabaseUser } from '#supabase/server'\n\nexport default defineEventHandler(async (event) => {\n  return await serverSupabaseUser(event)\n})\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your api route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const user = ref(null)\n\nconst fetchMe = async () => {\n   user.value = await $fetch('/api/me')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const user = ref(null)\n\nconst fetchMe = async () => {\n   user.value = await $fetch('/api/me')\n}\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Be careful, if you want to call this route on SSR, please read this "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/data-fetching/#isomorphic-fetch-and-fetch","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"section"}]},{"type":"text","value":", you must send your browser cookies including your supabase token."}]},{"type":"element","tag":"code","props":{"code":"const user = ref(null)\n\nconst { data } = await useFetch('/api/me', {\n  headers: useRequestHeaders(['cookie'])\n})\n\nuser.value = data\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"const user = ref(null)\n\nconst { data } = await useFetch('/api/me', {\n  headers: useRequestHeaders(['cookie'])\n})\n\nuser.value = data\n"}]}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This section assumes you're familiar with "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/concepts/server-engine#standalone-server","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nitro"}]},{"type":"text","value":", the server engine powered by Nuxt."}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"In order to provide utilities similar to "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"vue"}]},{"type":"text","value":" composables in "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/server-routes/","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"server routes"}]},{"type":"text","value":", this module exposes services providing the same functionnalities."}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseclient"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseClient"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is working similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/composables#usesupabaseclient"},"children":[{"type":"text","value":"useSupabaseClient"}]},{"type":"text","value":" composable but is designed to be used in server routes."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and just import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseClient } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseClient(event)\n\n  const { data } = await client.from('librairies').select()\n\n  return { librairies: data }\n})\n","filename":"server/api/librairies.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'#supabase/server'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"eventHandler"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'librairies'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"select"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"librairies"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your API route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const fetchLibrairy = async () => {\n  const { librairies } = await $fetch('/api/librairies')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"fetchLibrairy"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"librairies"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"$fetch"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'/api/librairies'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Be careful, if you want to call this route on SSR, please read this "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/data-fetching/#isomorphic-fetch-and-fetch","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"section"}]},{"type":"text","value":", you must send your browser cookies including your supabase token."}]},{"type":"element","tag":"code","props":{"code":"const { data: { librairies }} = await useFetch('/api/librairies', {\n  headers: useRequestHeaders(['cookie'])\n})\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"librairies"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" }} "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"useFetch"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'/api/librairies'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"useRequestHeaders"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"(["}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'cookie'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"])"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseservicerole"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is designed to work only on server side."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"It works similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/services#serverSupabaseClient"},"children":[{"type":"text","value":"serverSupabaseClient"}]},{"type":"text","value":" but it provides a client with super admin rights that can bypass your Row Level Security."}]},{"type":"element","tag":"blockquote","props":{},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"The client is initialized with the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"SUPABASE_SERVICE_KEY"}]},{"type":"text","value":" you must have in your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":".env"}]},{"type":"text","value":" file. Checkout the doc if you want to know more about "},{"type":"element","tag":"a","props":{"href":"https://supabase.com/docs/learn/auth-deep-dive/auth-deep-dive-jwts#jwts-in-supabase","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Supabase keys"}]},{"type":"text","value":"."}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and just import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseServiceRole } from '#supabase/server'\n\nexport default eventHandler(async (event) => {\n  const client = serverSupabaseServiceRole(event)\n\n  const { data } = await client.from('rls-protected-table').select()\n\n  return { sensitiveData: data }\n})\n","filename":"server/api/bypass-rls.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'#supabase/server'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"eventHandler"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"serverSupabaseServiceRole"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"client"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'rls-protected-table'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")."}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"select"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"()"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"sensitiveData"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your API route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const fetchSensitiveData = async () => {\n  const { sensitiveData } = await useFetch('/api/bypass-rls')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"fetchSensitiveData"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"sensitiveData"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"useFetch"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'/api/bypass-rls'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"serversupabaseuser"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseUser"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"This function is working similary as the "},{"type":"element","tag":"a","props":{"href":"/usage/composables#usesupabaseuser"},"children":[{"type":"text","value":"useSupabaseUser"}]},{"type":"text","value":" composable but is designed to be used in server routes."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Define your server route and import the "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"serverSupabaseUser"}]},{"type":"text","value":" from "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"#supabase/server"}]},{"type":"text","value":"."}]},{"type":"element","tag":"code","props":{"code":"import { serverSupabaseUser } from '#supabase/server'\n\nexport default defineEventHandler(async (event) => {\n  return await serverSupabaseUser(event)\n})\n","filename":"server/api/me.ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"import"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"serverSupabaseUser"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"from"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'#supabase/server'"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"defineEventHandler"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" ("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":") "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"return"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"serverSupabaseUser"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"event"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then call your api route from any vue file:"}]},{"type":"element","tag":"code","props":{"code":"const user = ref(null)\n\nconst fetchMe = async () => {\n   user.value = await $fetch('/api/me')\n}\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#D19A66"}},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"fetchMe"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"async"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" () "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"=>"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"   "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"$fetch"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'/api/me'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Be careful, if you want to call this route on SSR, please read this "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/data-fetching/#isomorphic-fetch-and-fetch","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"section"}]},{"type":"text","value":", you must send your browser cookies including your supabase token."}]},{"type":"element","tag":"code","props":{"code":"const user = ref(null)\n\nconst { data } = await useFetch('/api/me', {\n  headers: useRequestHeaders(['cookie'])\n})\n\nuser.value = data\n","filename":"pages/index.vue","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"ref"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#D19A66"}},"children":[{"type":"text","value":"null"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":")"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"const"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" { "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"data"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" } "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#C678DD"}},"children":[{"type":"text","value":"await"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"useFetch"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"("}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'/api/me'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":", {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"headers"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":": "}]},{"type":"element","tag":"span","props":{"style":{"color":"#61AFEF"}},"children":[{"type":"text","value":"useRequestHeaders"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"(["}]},{"type":"element","tag":"span","props":{"style":{"color":"#98C379"}},"children":[{"type":"text","value":"'cookie'"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"])"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"})"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"style":{"color":"#E5C07B"}},"children":[{"type":"text","value":"user"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"value"}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#56B6C2"}},"children":[{"type":"text","value":"="}]},{"type":"element","tag":"span","props":{"style":{"color":"#ABB2BF"}},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"style":{"color":"#E06C75"}},"children":[{"type":"text","value":"data"}]}]}]}]}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"serversupabaseclient","depth":3,"text":"serverSupabaseClient"},{"id":"serversupabaseservicerole","depth":3,"text":"serverSupabaseServiceRole"},{"id":"serversupabaseuser","depth":3,"text":"serverSupabaseUser"}]}},"_type":"markdown","_id":"content:3.usage:2.services.md","_source":"content","_file":"3.usage/2.services.md","_extension":"md"}]