Database Failed to Fetch

Help
1

Hi all,

I’m trying to connect an obserable notebook to a Postgres DB my team is using - I’m getting this error.

I was able to get a local DB connected to the notebook using the self-hosted proxy, now that I’m done testing I’m trying to migrate over to using the production DB hosted on AWS.

I have another service that is able to query and write into this DB, so I’m not quite sure what the issue is.

I see an error message that says “Failed to Fetch” and the following console logs:

image
image.png1112×256 53.1 KB

Any ideas on what might not be working?

Update: With some light Googling, my understanding is that its a CORS policy issue on our side that needs to be updated? If so what domain / subdomain should we include? observablehq?

2

Hi @jnthnvctr

Not knowing more details about your setup, it might help to look into enabling CORS on AWS. Unfortunately, I am not an expert on this and don’t know how CORS works for RDS… but maybe this will help:
https://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html

As for what to allow, I allow for an open CORS policy on my AWS S3 buckets:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
</CORSRule>
</CORSConfiguration>

This configuration sample allows a user to view or update objects inside of a bucket from any origin. This is bad practice / insecure but I find it convenient for when I publish notebooks to HTML for hosting elsewhere… I could probably omit the PUT option and things would work just find, but I haven’t played around. …and, of course, if anyone wishes to suggest a better/more secure CORS policy for reading, I’d be happy to learn.

and yes, you’ve got it: you can limit operations on a bucket to only those coming from observablehq as follows: <AllowedOrigin>*.static.observableusercontent.com</AllowedOrigin>. [note: adjusting this to avoid confusion following Mike’s correction below.]

And for more discussion on CORS, I like this resource:
https://www.w3.org/wiki/CORS_Enabled

Not sure if this helps or not, but hopefully it’s a step toward getting you started!

3

All Observable notebooks run on *.static.observableusercontent.com (not observablehq.com), where the * is the login of the notebook owner (such as mbostock). If you want to just whitelist your domain.

4

For team notebook’s, is this the team name, or the original creator?

5

The team’s login. It’s always the owner of the notebook (the same as the URL when publishing), not the creator.

6

Thanks all - it was an issue on our side. It seems that the CORS error was a redherring - the PG database wasn’t actually reachable via the open internet.

7

Just for my own understanding, you’re still using the self-hosted proxy, but trying to re-point it at your AWS database? Or are you trying to switch to an Observable-hosted connection?

8

It was swapping out the database connection altogether. I’d made a replica locally that I was testing on and I was just trying to point a new connection at aws!

9

Ah got it. It seems like we could try to make that error message more meaningful.