Skip to main content

Integrating Cloud Storage with Cloud CDN and Custom HTTPS Domain using Cloud DNS

In this guide, we will walk through the steps to integrate Cloud Storage with Cloud CDN and set up a custom HTTPS domain using Cloud DNS. This will allow us to upload images to our site, gaja.live, and serve them efficiently via a CDN with a custom domain.

Our current setup fetches images directly from Cloud Storage. While the need for a CDN wasn’t immediate, integrating one now will be beneficial for future scalability. I’ll explain each step in detail, ensuring even beginners can follow along.

Steps to Integrate Cloud Storage with Cloud CDN

  1. Set Up the Load Balancer
  2. Link to Cloud Storage
  3. Configure Cloud DNS for the CDN Address

Let’s get started with setting up the Load Balancer.

Step 1: Set Up the Load Balancer

  1. Navigate to Network Services → Load balancing → Create a load balancer.
  2. Choose Application Load Balancer.
  3. Select Public facing and Global deployment.
  4. Use the Global external Application Load Balancer option.
  5. Click Configure.

Load Balancer Configuration

a. Frontend Configuration

  • Name: Enter a desired name (e.g., gaja-development-cdn-lb-http).
  • Change IP address from Ephemeral to a new static IP:
  • Click CREATE IP ADDRESS, give it a name, and click RESERVE.
  • Click Done.

b. Add HTTPS Configuration

  • Click ADD FRONTEND IP AND PORT.
  • Name: Enter a different name (e.g., gaja-development-cdn-lb-https).
  • Change Protocol from HTTP to HTTPS.
  • Use the same IP address created earlier.
  • Click CREATE A NEW CERTIFICATE:
  • Name: Enter a desired name (e.g., gaja-development-cdn-lb-ssl).
  • Choose Create Google-managed Certificate.
  • Add your desired CDN domain (e.g., cdn.development.gaja.live).
  • Click CREATE.
  • Ensure the new certificate is selected and click Done.

c. Backend Configuration

  • Click Backend services & backend buckets → CREATE A BACKEND BUCKET.
  • Backend bucket name: Enter a name.
  • Select your Cloud Storage bucket.
  • Enable Cloud CDN.
  • Click CREATE and ensure the new bucket is selected, then click OK.

c. Routing Rules

  • Click ADD HOST AND PATH RULE.
  • Host: Enter your CDN domain (same as the certificate domain).
  • Path: Enter the appropriate path based on your Cloud Storage structure (e.g., /* or /images/*).
  • Backend: Select the created backend bucket.
  • Click CREATE.

Now, the load balancer setup is complete.

Testing the Setup

  1. Copy the IP address from the Frontend section of your load balancer.
  2. Replace the Cloud Storage URL with the load balancer IP and test the image URL:

Ensure your Cloud Storage bucket is public and allUsers have Storage Object Viewer permissions.

Step 2: Configure Cloud DNS

  1. Open your DNS Zone and click ADD STANDARD.
  2. DNS name: Enter your CDN domain.
  3. Resource record type: Select A.
  4. IPv4 Address: Enter the load balancer IP.
  5. Click CREATE.

Final Steps

Wait up to 72 hours for Google to provision the certificate and DNS settings. Check the status under Load balancing components and ensure the certificate status is Active.

Once provisioning is complete, replace the load balancer IP in your URL with the CDN domain to verify everything works correctly. Your images should now be served via the CDN, improving load times and performance for your users.

By following these steps, you’ve successfully integrated Cloud Storage with Cloud CDN and set up a custom HTTPS domain using Cloud DNS. Happy coding!

Labels:

Popular posts from this blog

Xcode and iOS Version Mismatch: Troubleshooting "Incompatible Build Number" Errors

Have you ever encountered a frustrating error while trying to run your iOS app in Xcode, leaving you scratching your head? A common issue arises when your device's iOS version is too new for the Xcode version you're using. This often manifests as an "incompatible build number" error, and looks like this: DVTDeviceOperation: Encountered a build number "" that is incompatible with DVTBuildVersion. This usually happens when you are testing with beta versions of either iOS or Xcode, and can prevent Xcode from properly compiling your storyboards. Let's explore why this occurs and what you can do to resolve it. Why This Error Occurs The core problem lies in the mismatch between the iOS version on your test device and the Software Development Kit (SDK) supported by your Xcode installation. Xcode uses the SDK to understand how to build and run apps for specific iOS versions. When your device runs a newer iOS version than Xcode anticipates, Xcode mi...
Read more

How to Fix the “Invariant Violation: TurboModuleRegistry.getEnforcing(…): ‘RNCWebView’ Could Not Be Found” Error in React Native

When working with React Native, especially when integrating additional libraries like react-native-signature-canvas , encountering errors can be frustrating. One such error is: Invariant Violation: TurboModuleRegistry. getEnforcing (...): 'RNCWebView' could not be found This error often occurs when the necessary dependencies for a module are not properly linked or when the environment you’re using doesn’t support the required native modules. Here’s a breakdown of how I encountered and resolved this issue. The Problem I was working on a React Native project where I needed to add the react-native-signature-canvas library to capture user signatures. The installation process seemed straightforward: Installed the package: npm install react-native-signature- canvas 2. Since react-native-signature-canvas depends on react-native-webview , I also installed the WebView package: npm install react- native -webview 3. I navigated to the iOS directory and ran: cd ios pod install Everythi...
Read more

Fixing FirebaseMessagingError: Requested entity was not found.

If you’re working with Firebase Cloud Messaging (FCM) and encounter the error: FirebaseMessagingError: Requested entity was not found. with the error code: messaging/registration-token-not-registered this means that the FCM registration token is invalid, expired, or unregistered . This issue can prevent push notifications from being delivered to users. ๐Ÿ” Possible Causes & Solutions 1️⃣ Invalid or Expired FCM Token FCM tokens are not permanent and may expire over time. If you’re storing tokens in your database, some might be outdated. ✅ Solution: Remove invalid tokens from your database when sending push notifications. Refresh and store the latest FCM token when the app starts. Example: Automatically Refresh Token firebase. messaging (). onTokenRefresh ( ( newToken ) => { // Send newToken to your backend and update the stored token }); 2️⃣ Token Unregistered on Client Device A token might become unregistered if: The app is uninstalled on the user’s device. ...
Read more