Question

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

我想打一个电话，要求我知道用户的IP。 I see that I can get to the req object确实有，但是它被埋在deep, deep中，我担心这不是一种可靠的方法。

如何访问主叫用户的IP地址而不是客户端？

Answer 1

有一个关于此的github线程，这使得在两种环境（本地，生产环境）中抢占IP都很简单

const ip = req.connection.remoteAddress || req.socket.remoteAddress

但是请注意，您需要确保正确转发代理标头。由于nuxt在传统的Web服务器后面运行，而没有转发代理标头，因此您将始终获得Web服务器的本地IP（除非更改回送，否则为127.0.0.1）。

Answer 2

如果nuxt在诸如nginx之类的代理后面运行，则可以通过读取x-real-ip或x-forwarded-for获得asyncData中客户端的IP地址。请注意，如果呼叫已通过其他代理传递，则x-forward-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)
    }
  }

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

2 个答案: