Argument of type '{ headers: { Authorization: string; }; withCredentials: true; }'
is not assignable to parameter of type 'EventSourceInit'.
Object literal may only specify known properties, and 'headers' does not exist in type 'EventSourceInit'.ts(2345)
(property) Authorization: string
새로운 EventSource를 만들어 SSE API와 연결하는 로직을 구현하는 과정에서, 인증 토큰을 헤더에 담아 보내야 했다. 그 과정에서 EventSource의 Type에 headers
가 존재하지 않았다.`
이를 해결하고자 event-source-polyfill
라이브러리를 사용하여, XHR Header type을 수동적으로 주입시켜주었다.
import { EventSourcePolyfill, NativeEventSource } from "event-source-polyfill";
// ...
const EventSource = EventSourcePolyfill || NativeEventSource;
const SSE = new EventSource(
`${process.env.REACT_APP_SERVER_URL}connect/${post.id}`,
{
headers: {
Authorization: `Bearer ${getCookie("reqWithToken")}`,
},
withCredentials: true,
}
);