Ishaan Puniani

Jan 06, 2023

To use Google Cloud Storage, change the FILE_STORAGE_PROVIDER variable fo the backend/.env file to use gcp.

FILE_STORAGE_PROVIDER = "gcp";

Go to https://cloud.google.com/ and create an account.Create a new project for the development environment.Go to Storage > Browser and create a new Bucket.Save the bucket name on the FILE_STORAGE_BUCKET variable. The value must be your bucket-name.

In the example of this image, it will be fab-builder.appspot.com.

FILE_STORAGE_BUCKET = "fab-builder.appspot.com";

The service key

Now our app needs a service key to be able to access the bucket.Create a service account key that has permission to manage Google Cloud Storage buckets. Follow this: https://cloud.google.com/iam/docs/creating-managing-service-account-keys#creating_service_account_keys.

After you download the JSON file, you will see that it looks like this:

{
  "type": "service_account",
  "project_id": "...",
  "private_key_id": "...",
  "private_key": "...",
  "client_email": "...",
  "client_id": "...",
  "auth_uri": "...",
  "token_uri": "...",
  "auth_provider_x509_cert_url": "...",
  "client_x509_cert_url": "..."
}

Now we must place this entire file into a single environment variable.If you use VSCode, you can use the join lines command.Now place this line on theGOOGLE_CLOUD_PLATFORM_CREDENTIALS variable.

GOOGLE_CLOUD_PLATFORM_CREDENTIALS = {
  type: "service_account",
  project_id: "...",
  private_key_id: "...",
  private_key: "...",
  client_email: "...",
  client_id: "...",
  auth_uri: "...",
  token_uri: "...",
  auth_provider_x509_cert_url: "...",
  client_x509_cert_url: "...",
};

CORS

Install the https://cloud.google.com/sdk.Sign in to your account by calling gcloud auth login .

Create a gcp-cors.json file on the same folder that you are at the command line.

[
  {
    "maxAgeSeconds": 3600,
    "method": ["GET", "HEAD", "POST", "PUT"],
    "origin": ["*"],
    "responseHeader": ["Content-Type", "Access-Control-Allow-Origin"]
  }
]

Run this script. Make sure you replace the your-bucket-name by the bucket you created!

gsutil cors set gcp-cors.json gs://your-bucket-name

Done! You are now ready to use the Google Cloud File storage on your project.

Ishaan Puniani

Software Developer

Software Developer