SaturnFramework / Saturn

Opinionated, web development framework for F# which implements the server-side, functional MVC pattern
https://saturnframework.org
MIT License
714 stars 109 forks source link

CORS example #154

Closed sashang closed 5 years ago

sashang commented 5 years ago

How do I enable allow cross origin resources in Saturn?. Is there an example for configuring CORS I can reference? The problem I'm having is trying to authenticate with Google from the browser (Chrome). On the server (Saturn) side I'm using the use_google_oauth function. It works and I can get authentication via Google if I manually point the browser at "http://localhost:8085/use-google-oauth". However because I'm using the SAFE stack, on the client side I have this url "http://localhost:8080/use-google-oauth" that is redirected to port 8085 via webpack. If I try using this url from the browser the browser console log spits out this error:

Failed to load https://accounts.google.com/o/oauth2/v2/auth?response_type=code&client_id=790914045599-k2hrir47m3b2rcsolj5hf2gakoq4d4ja.apps.googleusercontent.com&redirect_uri=http%3A%2F%2Flocalhost%3A8085%2Foauth_callback_google&scope=openid%20profile%20email&state=CfDJ8B9dL0oiWwVGrIZaWzkHoN1QgJioZxWyXbzI3eCjA7G700PZ24fvYbjpVY_Oicoz5NRJqcLKRxfKZ9vtzBlEjXwiFuv2oQ-y_BE06FdDzWKKokbb4Jndjcupv_dhn_pHU5fBs1uquBwbxr00ULGd09qe7_6IIQ2vmoMsGB_pDrofpHp0W8hoOa-YZgUEp5YqWASVQXKrILXxp4f4UJCg-zek8nWTzz14Uj9pGFWt0zlV0QFE5GJ13wJzNUZYjp0GYw: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I don't know how to configure it so that the browser lets this request through.

Krzysztof-Cieslak commented 5 years ago

Saturn provides use_cors operation in the application CE that you can use (https://github.com/SaturnFramework/Saturn/blob/9e1d912bdc08b772798c726d67cef94be7098fe7/src/Saturn/Application.fs#L188).

However, in this case, it actually sounds like webpack problem? As far as I remember in webpack dev server settings there is changeOrigin property (or something like that) that you need to use.

sashang commented 5 years ago

Ok thanks. Looks like I may have been searching up the wrong tree and should be searching for 'how to use cors in webpack' instead. From what I've been reading the client has to send a HTTP request with the origin header and the server will respond (if configured correctly) with a Access-Control-Allow-Origin header in the response. At the moment I haven't seen a origin header in the request, and that's something coming from the browser via webpack, so I'll try investigating that direction.

On Mon, Dec 3, 2018 at 12:42 AM Krzysztof Cieślak notifications@github.com wrote:

Saturn provides use_cors operation in the application CE that you can use ( https://github.com/SaturnFramework/Saturn/blob/9e1d912bdc08b772798c726d67cef94be7098fe7/src/Saturn/Application.fs#L188 ).

However, in this case, it actually sounds like webpack problem? As far as I remember in webpack dev server settings there is changeOrigin property (or something like that) that you need to use.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/SaturnFramework/Saturn/issues/154#issuecomment-443508559, or mute the thread https://github.com/notifications/unsubscribe-auth/AAiAh7MHCfpo-si0O4SDpkUq1j9zn4hIks5u09i4gaJpZM4Y9Ks1 .