N
Nuxt2mo ago
RainyDev

getRequestIP returns nothing

Hi there, I need to get the clients IP in a API Route. Currently I'm trying this:
const ip = getRequestIP(event)
const ip = getRequestIP(event)
I've found this somewhere in the docs. But it returns undefined in Dev (nuxt dev) and on NuxtHub aswell.. Unfortunately I need the IP so are there any workarounds?
5 Replies
kapa.ai
kapa.ai2mo ago
Hi @RainyDev. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- I understand you're having trouble getting the client IP address in your Nuxt API route. Let me help you with this issue. The getRequestIP function should work in Nuxt, but there are a few considerations to be aware of: 1. In development mode (nuxt dev), it might return undefined because you're likely accessing your app through localhost. 2. When deployed, you often need to configure your server to properly forward IP information, especially if your app is behind a proxy or CDN. Here's how you can improve your implementation:
const ip = getRequestIP(event, { xForwardedFor: true })
const ip = getRequestIP(event, { xForwardedFor: true })
The xForwardedFor option tells the function to check the X-Forwarded-For header, which is commonly set by proxies and CDNs with the client's original IP address H3 Utils. For Nginx configurations, you'll need to ensure proper headers are set:
proxy_set_header Host $host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
This configuration forwards the necessary headers to your Nuxt application Stack Overflow Post. If you're using NuxtHub or another hosting provider, you might need to check their documentation for specific configurations related to IP forwarding. Alternatively, you could create a store to manage the IP information as shown in this example:
// stores/ip.ts
import { defineStore } from 'pinia';

export const useIpStore = defineStore('ip', {
state: () => ({
_ip: ''
}),
getters: {
ip: (state) => state._ip,
// Add other getters as needed
},
actions: {
setIp(ip: string) {
this._ip = ip;
}
}
});
// In a plugin (e.g., plugins/init.ts)
import { defineNuxtPlugin } from '#app';
import { useIpStore } from '~/stores/ip';

export default defineNuxtPlugin(async (nuxtApp) => {
const headers = useRequestHeaders();
const ip = headers['x-real-ip'] ?? '';
const ipStore = useIpStore();
ipStore.setIp(ip);
});
// stores/ip.ts
import { defineStore } from 'pinia';

export const useIpStore = defineStore('ip', {
state: () => ({
_ip: ''
}),
getters: {
ip: (state) => state._ip,
// Add other getters as needed
},
actions: {
setIp(ip: string) {
this._ip = ip;
}
}
});
// In a plugin (e.g., plugins/init.ts)
import { defineNuxtPlugin } from '#app';
import { useIpStore } from '~/stores/ip';

export default defineNuxtPlugin(async (nuxtApp) => {
const headers = useRequestHeaders();
const ip = headers['x-real-ip'] ?? '';
const ipStore = useIpStore();
ipStore.setIp(ip);
});
This approach uses request headers directly and stores the IP in a Pinia store for use throughout your application Stack Overflow Post. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai2mo ago
<@994277952390971412> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
RainyDev
RainyDevOP2mo ago
[🍍]: "getActivePinia()" was called but there was no active Pinia. Are you trying to use a store before calling "app.use(pinia)"? I'm trying to get the api in an api route @kapa.ai
kapa.ai
kapa.ai2mo ago
Let me check the knowledge base for you again. One moment! :books: Sorry @RainyDev, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
harlan
harlan2mo ago
you want to pass in the second arg so that the x-forwarding-address is used iirc

Did you find this page helpful?