Discourse 업데이트 후 API에서 Access-Control-Allow-Headers CORS 오류 발생

제품 지원
1

어제 Discourse를 업그레이드했는데, 모든 API 콜백에서 오류가 발생하고 있습니다. 문제를 조사해보니 인증 헤더(1)에 문제가 있는 것 같더군요. 몇 가지 호출을 시도해봤더니 다음과 같은 오류가 발생합니다:

Access to XMLHttpRequest at 'https://mydomain.com/notifications.json?username=admin' from origin 'https://mydomain.com' has been blocked by CORS policy: Request header field api-username is not allowed by Access-Control-Allow-Headers in preflight response.

저는 Vue를 사용 중이며, api-key와 api-username을 다음과 같이 헤더에 추가했습니다:

Vue.http
        .get(
             "https://discourse.mydomain.com/notifications.json?username="+input.username,
          {
            headers: {
             "Api-Key":"xxxxxxxxxxxxxxxxx",
             "Api-Username": "system",
              "content-type": "application/json",
              accept: "application/json"
            }
          }
        )

(1) Discourse REST API Documentation

2

사이트 설정에서 CORS를 구성해야 할 수도 있습니다?

3

네, Discourse 설정에서 API를 호출하는 도메인을 추가했습니다. 하지만 api-username 필드에 대한 오류는 언제 해결해야 하는지 모르겠습니다.

4

system API 키를 클라이언트 사이드 코드에 넣으시는 건가요? :scream:
이렇게 하면 누구나 JavaScript 코드에서 키를 가져가서 포럼을 완전히 장악할 수 있습니다.

Discourse로 보내는 Ajax HTTP 요청은 기존 세션을 활용하거나, 아예 세션이 필요 없는 방식으로 처리되어야 합니다.

5

단순히 테스트가 아니라, 사용자 이름(username)을 사용하고 있습니다.

      Vue.http
    .get(
      "https://discourse.mydomain.com/notifications.json?username="+input.username,
      {
        headers: {
       "Api-Key":"xxxxxxxxxxxxxxxxxxxxxx",
        "Api-Username": input.username    
        }
      }
    )

하지만 CORS와 api-username 필드에서 동일한 오류가 발생합니다.

6

말씀드린 내용을 다시 한번 말씀드리겠습니다:

즉, 인증 헤더를 전혀 사용하지 말라는 뜻입니다.

7

CORS 요청에 이 API 자격 증명을 사용하는 것은 정말로 권장되지 않으며, 이 때문에 해당 헤더 필드가 허용되지 않습니다.

다만 CORS에서는 user-api 헤더를 허용합니다:

8

사용자 API 키 사양을 읽었습니다 …

제 경우에는 자바스크립트 프론트엔드 앱으로 SSO를 사용 중입니다. 각 사용자마다 인증 UI를 사용하지 않고 API를 사용할 수 있을까요? api-username을 사용할 수 있는 방법을 찾고 있습니다. 이것이 가능한가요?

감사합니다

9

이걸 해결해 줄 수 있을까요?
감사합니다!

10

결국 모든 API 통합을 변경하지 않아도 되도록 Discourse의 이전 버전으로 돌아가기로 했습니다.