如何在Yesod中為靜態文件啟用“Access-Control-Allow-Origin”標頭？

Question

我正在使用scaffolded站點和靜態子域來提供我的靜態文件。 正在使用來自Javascript游戲的顯式網址請求靜態文件，我正在使用我的yesod應用程序來提供服務（使用Phaser框架編寫）。

來自Javascript控制台的示例錯誤消息是：

Phaser.Loader error loading file: player1_icon from URL http://example.com/static/games/mygame/images/player1/icon.png 
Image from origin 'http://example.com' has been blocked from loading by Cross-Origin Resource Sharing policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

一些研究表明，在處理函數中添加行addHeader "Access-Control-Allow-Origin" "*"可以解決這個問題。 但是靜態路由不使用處理函數，所以我不知道我會把它放在哪里。

任何幫助將不勝感激。

Answer 1

這可以通過使用添加此標頭的WAI中間件來實現。 該中間件將添加到您的Application模塊中。 wai-extra軟件包中有許多中間件可用作如何執行此操作的示例。

更一般地說：這可能是值得構建到yesod-static本身的一個特性。 你可以打開一個關於它的Github問題嗎？