如何在Nuxt的asyncData方法中获取用户的IP?

2024-03-20

Nuxt 使用 asyncData 在服务器端运行代码,然后将其与数据对象合并。

我想拨打一个需要我知道用户IP的电话。我看到我可以到达req object https://nuxtjs.org/api/context/确实有但它被埋了深,深 https://pastebin.com/w8aYbbJD在那里,我担心这不是一个可靠的方法。

如何在服务器端而不是客户端访问呼叫用户的 IP 地址?


如果 nuxt 在诸如 nginx 之类的代理后面运行,那么您可以通过读取 x-real-ip 或 x-forwarded-for 来获取 asyncData 中的客户端 IP 地址。请注意,如果调用已通过其他代理,则 x-forwarded-for 可以包含逗号分隔的 IP(如果有多个条目,则客户端是第一个条目)。

确保在 nginx 站点配置中设置标头

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;

然后你可以读取 asyncData 中的标头:

  async asyncData(context) {
    if (process.server) {
      const req = context.req
      const headers = (req && req.headers) ? Object.assign({}, req.headers) : {}
      const xForwardedFor = headers['x-forwarded-for']      
      const xRealIp = headers['x-real-ip']
      console.log(xForwardedFor)
      console.log(xRealIp)
    }
  }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在Nuxt的asyncData方法中获取用户的IP? 的相关文章

随机推荐