# 상대 경로 문제로 Discourse 사이트에서 CORS 오류 발생
**URL:** https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024
**Category:** Bug
**Created:** [10월 27, 2024, 6:27오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024 "2024-10-27T06:27:11Z")
**Posts on this page:** 8
**Page:** 1
### Author:  [@Yt.w](https://meta.discourse.org/u/Yt.w)
#### Post date: [10월 27, 2024, 6:27오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/1 "2024-10-27T06:27:11Z")
다음 **lib/highlight\_js.rb** 안의 코드는 일부 도메인에서는 작동하지만 다른 도메인에서는 작동하지 않습니다:
```ruby
def self.path
"/highlight-js/#{Discourse.current_hostname}/#{version SiteSetting.highlighted_languages}.js"
end
```
저에게는 두 개의 Discourse 사이트가 있습니다. 이 코드는 `www.abc.com` 도메인에서는 작동하지만 `efg.com`에서는 작동하지 않습니다. 브라우저 콘솔에서 다음 오류를 확인했습니다:
`formatter.js:383 Uncaught (in promise) TypeError: Failed to resolve module specifier '/highlight-js/efg.com/9797975efac87d28baa695ae13ca72ccaf5120f5.js'. `The base URL is about:blank because import() is called from a CORS-cross-origin script.
`highlight_js.rb`의 `self.path`를 다음과 같이 수정한 후 문제가 해결되었습니다:
```ruby
def self.path
"https://#{Discourse.current_hostname}/highlight-js/#{Discourse.current_hostname}/#{version SiteSetting.highlighted_languages}.js"
end
```
`import('/highlight-js/efg.com/9797975efac87d28baa695ae13ca72ccaf5120f5.js')`와 같은 상대 경로 사용은 CORS 문제를 일으키지만, `import('https://efg.com/highlight-js/efg.com/9797975efac87d28baa695ae13ca72ccaf5120f5.js')`와 같은 절대 URL을 사용하면 문제가 없이 잘 작동하는 것으로 보입니다.
---
### Author:  [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [10월 27, 2024, 8:22오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/2 "2024-10-27T08:22:17Z")
`abc.com`에서는 작동하는데 `efg.com`에서는 작동하지 않는다는 점이 좀 이상하네요. 두 라우트가 완전히 다르기 때문이죠 🤔
---
### Author:  [@Yt.w](https://meta.discourse.org/u/Yt.w)
#### Post date: [10월 27, 2024, 9:04오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/3 "2024-10-27T09:04:35Z")
즉, `www.abc.com`에서는 동작하지만 `efg.com`에서는 동작하지 않아요. 이유는 모르겠지만 제 환경에서는 이런 일이 발생하거든요.
---
### Author:  [@simonk](https://meta.discourse.org/u/simonk)
#### Post date: [10월 28, 2024, 11:49오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/4 "2024-10-28T11:49:35Z")
해당 사이트 중 어느 곳에서든 CDN을 사용하고 계신가요? 제 사이트에서 코드 하이라이팅이 더 이상 작동하지 않는 것을 확인했는데, 이 것이 원인인 것 같습니다:
> [@bunny.net CDN으로 인해 코드 하이라이팅 실패](https://meta.discourse.org/t/code-highlighting-failed-because-bunny-net-cdn/296333/4?u=simonk):
>
> The change which made this noticeable was most likely [DEV: Modernise highlightjs loading (#24197) · discourse/discourse@0878dde · GitHub](https://github.com/discourse/discourse/commit/0878dde2132a34ba2787e702de222bc6dd161895), which switched highlightjs to load via native import(), which requires CORS headers when fetching from a CDN. But even before that change, you likely would have had some issues with things like custom Fonts (which also require CORS headers for cross-origin requests). In theory, Discourse itself should be adding the CORS header to CDN responses. If it’s not, …
제 경우, CDN이 highlightjs 파일에 대해 `Access-Control-Allow-Origin` 헤더를 반환하지 **않고** 있습니다. Meta의 CDN은 해당 헤더를 포함하고 있는 것을 확인했기 때문에, 무엇이 다른지 궁금합니다.
```plaintext
$ curl --silent -I https://d3bpeqsaub0i6y.cloudfront.net/highlight-js/meta.discourse.org/9797975efac87d28baa695ae13ca72ccaf5120f5.js | grep -i access-control
access-control-allow-origin: *
access-control-allow-methods: GET, HEAD, OPTIONS
```
그러나 해당 헤더는 원본 서버(Origin server)에서 제공되지 **않고** 있습니다:
```plaintext
$ curl --silent -I https://meta.discourse.org/highlight-js/meta.discourse.org/9797975efac87d28baa695ae13ca72ccaf5120f5.js | grep -i access-control
```
제가 파악한 바로는, Discourse는 highlightjs 파일에 access-control 헤더를 추가하도록 설계되어 있습니다:
>
**그러나** 이 헤더는 요청이 "CDN 요청"인 경우에만 적용됩니다:
>
>
이것은 Discourse가 "CDN 요청"을 위한 별도의 호스트 이름으로 구성된 경우에만 작동합니다.
---
### Author:  [@simonk](https://meta.discourse.org/u/simonk)
#### Post date: [10월 28, 2024, 12:02오후 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/5 "2024-10-28T12:02:16Z")
`cdn_origin_hostname`라는 설정이 있습니다. 이 설정을 일반적인 discourse 호스트 이름으로 설정할 수 있을 것 같습니다:
>
>
이렇게 하면 `is_cdn_request` 체크를 통과하게 될 것이라고 생각하지만, 부정적인 부작용이 있을지는 모르겠습니다.
---
### Author:  [@Yt.w](https://meta.discourse.org/u/Yt.w)
#### Post date: [10월 28, 2024, 12:48오후 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/6 "2024-10-28T12:48:13Z")
> [@simonk](#):
>
> 이 두 사이트 중 하나에 CDN을 사용 중인가요?
네, `efg.com`에는 CDN을 사용 중입니다. 하지만 js 파일에 접근하면 올바른 **Access-Control-Allow-Origin** 이 반환되는데, 이 부분이 좀 혼란스러웠습니다.
---
### Author:  [@simonk](https://meta.discourse.org/u/simonk)
#### Post date: [10월 29, 2024, 5:48오후 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/7 "2024-10-29T17:48:29Z")
> [@simonk](#):
>
> `cdn_origin_hostname`라는 설정이 있는데, 아마도 이 값을 일반적인 discourse 호스트 이름으로 설정할 수 있을 것 같습니다.
추가로, `cdn_origin_hostname`을 내 Discourse 인스턴스의 일반 도메인 이름으로 설정하고 CDN 캐시를 플러시한 결과, 이제 highlightjs가 다시 작동하고 있습니다. 아직 _알아챈_ 부작용은 없는데…
---
### Author:  [@cuo\_wu](https://meta.discourse.org/u/cuo_wu)
#### Post date: [5월 18, 2025, 11:34오전 UTC](https://meta.discourse.org/t/issue-with-relative-path-causing-cors-error-on-discourse-sites/333024/8 "2025-05-18T11:34:16Z")
저도 이 문제를 겪고 있습니다. 업데이트가 있나요?