Question

在 Angular-12 中，我在令牌服务中有这个：

get(){
  return localStorage.getItem('token');
}

然后我尝试将它从另一个服务中用于 CORS，如下所示：

httpOptions = {
  headers: new HttpHeaders({
    "Content-Type": 'application/json',
    "Access-Control-Allow-Origin": "*",
    "Access-Control-Allow-Headers": "Origin, Authorization, Content-Type, Accept",
    "Authorization" : this.token.get()
  })
};

//GET Method
public getAll(): Observable<any> {
  return this.http.get(this.api.baseURL + 'list', this.httpOptions);
}

我收到此错误：

<块引用>

输入'字符串| null' 不能分配给类型 'string |字符串[]'

和：

<块引用>

“授权”

突出显示。

即使我将 httpOptions 更改为：

httpOptions = {
  headers: new HttpHeaders({
  'Authorization' : this.token.get(),
  'X-Requested-With' : 'XMLHttpRequest'
  })
};

出现同样的错误。

我该如何解决这个问题？

Answer 1

错误很明显：this.token.get() 返回 string | null 而 HttpHeaders 需要 string | string[] 类型的值。

您需要处理本地存储中没有令牌的可能性：null 返回的 get() 值。

根据您想如何处理它，您可以在 get() 方法中或在构建 httpOptions 时进行。

Answer 2

试试这个

如果 localStorage.getItem('token') 返回 null，则此代码返回 [] 所以 get() 函数返回字符串 | []

get(){
  return localStorage.getItem('token') ?? [];
}

或如果 localStorage.getItem('token') 返回 null，则此代码返回 "" 所以 get() 函数返回字符串 |字符串

get(){
  return localStorage.getItem('token') ?? "";
}

或

这个解决方案不好，但有时会消除编译错误

get(): any{
  return localStorage.getItem('token');
}

输入'字符串| null' 不能分配给类型 'string |细绳[]'

2 个答案: