我正在我的Angular应用程序中使用ngx-cookie-service模块来临时存储"用户名"或"userId"等用户相关信息.对于第一个try 登录该应用程序的用户来说,该应用程序运行良好.它从cookie中获取正确的用户名、用户ID等信息.然而,当其他用户随后try 登录时,尽管新用户的信息看起来像存储在cookie中,但http请求仍然使用前一用户的信息进行.如果我try 获取如下所示的userId信息,就会出现问题.

export class ImageService {

  constructor(private http: HttpClient, private cookieService: CookieService) {
  }
  userId: number = +this.cookieService.get('user_id');
  getImage(): Observable<Image> {
    return this.http.get<Image>(imageUrlExample + this.userId);
  }
}

但是,如果我从方法内的cookie中获取userId信息,则不会发生问题.

export class ImageService {

  constructor(private http: HttpClient, private cookieService: CookieService) {
  }
  
  getImage(): Observable<Image> {
    const userId: number = +this.cookieService.get('user_id');
    return this.http.get<Image>(imageUrlExample + userId);
  }
}

我认为这个问题可能会发生,因为缓存了index.html文件,但不知道如何清除Angular中的缓存.

顺便说一句,我使用NGINX作为Web服务器.如果有它的配置,不幸的是我找不到它.

我试图清除缓存index.html文件,但无法清除它,或者问题是因为其他原因而发生的.我还try 为缓存配置NGINX,但也没有成功.

推荐答案

我认为您拥有将用户置于实际函数之外的代码,因此在加载应用程序时,此代码仅执行一次(当服务初始化时).这很糟糕,因为我们将无法检测到其他用户ID

您可以通过将获取用户id代码放入函数中来轻松解决这个问题,以便在调用函数时始终对其进行判断,因此始终获得最新的值!

export class ImageService {

  constructor(private http: HttpClient, private cookieService: CookieService) {
  }
  
  getImage(): Observable<Image> {
    const userId: number = +this.cookieService.get('user_id');
    return this.http.get<Image>(imageUrlExample + userId);
  }
}

替代方案是在需要时使用getter获取最新的cookie

export class ImageService {

  constructor(private http: HttpClient, private cookieService: CookieService) {
  } 
  
  get userId() { return +this.cookieService.get('user_id'); }
  
  getImage(): Observable<Image> {
    return this.http.get<Image>(imageUrlExample + this.userId);
  }
}

Html相关问答推荐

css网格区域的布局不展开,也不显示滚动条

Tailwincss:自动设置网格高度

电话号码验证器(Angular )

为所有必填字段添加所需的占位符文本(Angular Material)

使用无限数量的元素创建特定的CSS网格

将2个Flex列合并为1个交替子列

有没有办法根据另一个项目调整FlexBox项目的大小?

响应网格,响应调整大小以适应父div,保留父div S自己的响应高度

我无法动态嵌入Instagram帖子,因为无法分配Instagram固定链接

如何在R rmarkdown中创建循环中的分页表?

减小HTML负载中base64字符串的大小

在移动屏幕上显示时分支树视图的响应能力问题

用由文本制成的边框包围内容

嵌入最近的 YOUTUBE 视频(不是短片,视频)

Angular中如何向单选按钮添加验证

如何将自定义图像插入 Shiny plot header?

如何使 Shiny 中的 selectInput Select 扩展到井面板之外或以其他方式使它们更容易被用户看到?

让 Iframe 覆盖整个页面

有没有办法使用 CSS border-radius 创建 HTML 视频标签的三角形显示?

Bootstrap 5 网格问题,div 向下转义