Angular 通用 SSR，第一次调用查找用户的 ip 是从服务器而不是客户端？

Question

我们制作了 Angular 通用服务器端呈现应用程序，以便 html 标记显示在查看源代码中以用于 SEO 目的。我们在我们的应用程序中实施了本地化，以根据国家/地区提供数据。我们在应用程序开始时找到 ip，然后使用该 ip，获取特定国家/地区的数据。

问题是在 SSR 之后，应用程序首先从服务器呈现，然后 ip 调用从服务器发出并找到服务器的 ip。但是我们想要客户端浏览器的ip。他们有什么办法可以解决这个问题吗？

Answer 1

您需要向 angular 应用程序提供客户端 IP 地址

app.engine('html', (_, options, callback) =>
  ngExpressEngine({
    bootstrap: AppServerModuleNgFactory,
    providers: [
      provideModuleMap(LAZY_MODULE_MAP),
      {
        provide: 'clientIPAddress',
        useValue: options.req.connection.remoteAddress, //Provides the client IP address to angular
      },
    ],
  })(_, options, callback)
)

然后在您的 angular 应用中，注入该值

import { Injectable, Inject, Optional } from '@angular/core';


export class YourServiceOrComponent{
constructor(@Optional() @Inject('clientIPAddress') ipAddress: string) 
{
    if(ipAddress)
    {
        //Server side
    }
    else
    {
    //client side
    }
}

Angular 通用 SSR，第一次调用查找用户的 ip 是从服务器而不是客户端？

Angular universal SSR, first call to find user's ip went from server instead of client?

server-side-rendering

angular-universal

angular