<@U04UQ68083H> I am trying to integrate hydra to r...
# ory-copilot
h
@chilly-king-10285 I am trying to integrate hydra to react using oidc-client but I’m getting CORS error for all public APIs. How to fix this?
c
A message from kapa.ai
To solve Cross-Origin Resource Sharing (CORS) errors, you can use Ory Tunnel for local development. In production, you should add your domain to the Ory Project so that all requests from your frontend can be made to Ory under the same domain. Ory has a "deny by default" policy which means that the
Access-Control-Allow-Origin
header is only set on domains they own. You can learn more about CORS from the [Mozilla CORS documentation](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS). For Ory Hydra's Admin and Public endpoints, they support CORS. You can set the following values in the config file to make CORS work properly:
Copy code
yaml serve:    admin:    cors:    enabled: true    allowed_origins:    - <https://example.com>    - https://*.<http://example.com|example.com>    allowed_methods:    - POST    - GET    - PUT    - PATCH    - DELETE    allowed_headers:    - Authorization    exposed_headers:    - Content-Type    public:    cors:    enabled: true    allowed_origins:    - <https://example.com>    - https://*.<http://example.com|example.com>    allowed_methods:    - POST    - GET    - PUT    - PATCH    - DELETE    allowed_headers:    - Authorization    exposed_headers:    - Content-Type
Please replace
<https://example.com>
and
https://*.<http://example.com|example.com>
with your own domain. Also, note that the OAuth 2.0 Authorization Endpoint (
/oauth2/auth
) doesn't expose CORS by design. This endpoint should never be consumed in a CORS-fashion. For more details, you can refer to the [Ory documentation](https://www.ory.sh/docs/hydra/guides/cors) and the [config file](https://github.com/ory/hydra/blob/master/docs/config.yaml) on GitHub.
h
@chilly-king-10285 What if I want to allow all origins?
c
A message from kapa.ai
To allow all origins, you can use a wildcard '*' in the
allowed_origins
field. However, please note that this is generally not recommended due to security concerns. Allowing all origins can make your application vulnerable to Cross-Site Request Forgery (CSRF) attacks. Here's how you can do it:
Copy code
yaml serve:    admin:    cors:    enabled: true    allowed_origins:    - '*'    allowed_methods:    - POST    - GET    - PUT    - PATCH    - DELETE    allowed_headers:    - Authorization    exposed_headers:    - Content-Type    public:    cors:    enabled: true    allowed_origins:    - '*'    allowed_methods:    - POST    - GET    - PUT    - PATCH    - DELETE    allowed_headers:    - Authorization    exposed_headers:    - Content-Type
Remember to always consider the security implications before allowing all origins. For more details, you can refer to the [Ory documentation](https://www.ory.sh/docs/hydra/guides/cors) and the [config file](https://github.com/ory/hydra/blob/master/docs/config.yaml) on GitHub.