💬
Get Help
HK
Hiroshi KATO

Using Google Cloud Load Balancing

Hello,

I am considering placing Google Cloud Load Balancing in front of FlutterFlow to restrict access.

The purpose of restricting access is for DDoS protection and limiting access from IP addresses using a blacklist approach. (Google Cloud Load Balancing will be used in conjunction with Google Cloud Armor to also provide WAF functionalities.)

According to the URL below, it seems that FlutterFlow has adequate security measures in place. However, since I cannot control the policies myself, I aim to implement this strategy to explicitly communicate the policies to end-users for security measures and to offer the service.

https://docs.flutterflow.io/miscellaneous/security

I attempted to implement the following configuration, but accessing it through a browser results in a 404 error. (It appears that routing on the FlutterFlow side is not working correctly.)

  • Type of load balancer: Classic Application Load Balancer

  • Frontend: Use the A record of a custom domain (example.com) for the static IP provided by Google Cloud Load Balancing

  • Backend service: Set the domain created with FlutterFlow (example-lb.flutterflow.app)

  • Host and path rules: Host, example.com. Path, "/" assigned to the backend service

If anyone has a similar configuration working, I would greatly appreciate any advice. Thank you very much.

----

Additional information is as follows:

1. Direct access to example-lb.flutterflow.app from a browser confirms that the page is displayed correctly.

2. The following log is observed in Google Cloud when accessing the frontend:

{
  "insertId": "1plsk6yf2ov8q3",
  "jsonPayload": {
    "cacheId": "SFO-fbae48ad",
    "cacheDecision": [
      "RESPONSE_HAS_CONTENT_TYPE",
      "CACHE_MODE_CACHE_ALL_STATIC"
    ],
    "statusDetails": "response_sent_by_backend",
    "backendTargetProjectNumber": "projects/494258726633",
    "@type": "type.googleapis.com/google.cloud.loadbalancing.type.LoadBalancerLogEntry",
    "remoteIp": "203.0.113.1"
  },
  "httpRequest": {
    "requestMethod": "GET",
    "requestUrl": "https://203.0.113.2/",
    "requestSize": "210",
    "status": 404,
    "responseSize": "1823",
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36",
    "remoteIp": "203.0.113.1",
    "cacheLookup": true,
    "serverIp": "203.0.113.3",
    "latency": "0.031953s"
  },
  "resource": {
    "type": "http_load_balancer",
    "labels": {
      "backend_service_name": "exampleff",
      "zone": "global",
      "target_proxy_name": "example-target-proxy-2",
      "forwarding_rule_name": "example",
      "project_id": "xyz",
      "url_map_name": "example"
    }
  },
  "timestamp": "2024-02-21T14:46:42.747869Z",
  "severity": "WARNING",
  "logName": "projects/xyz/abc/requests",
  "trace": "projects/xyz/traces/b7a5d23b07ab43e645f7619faf116d35",
  "receiveTimestamp": "2024-02-21T14:46:43.527934306Z",
  "spanId": "bd58fead120dedb3"
}

3. The request header when accessing example-lb.flutterflow.app from a browser is as follows:

Request URL:
https://example-lb.flutterflow.app/

Request Method:
GET

Status Code:
200 OK (from service worker)

Referrer Policy:
strict-origin-when-cross-origin

Accept-Ranges:
bytes

Access-Control-Allow-Origin:
*

Access-Control-Expose-Headers:
Content-Type

Cache-Control:
max-age=3600

Content-Encoding:
gzip

Content-Length:
1170

Content-Type:
text/html

Date:
Thu, 22 Feb 2024 00:14:40 GMT

Etag:
"1ce1c60e2abfa20b19b3d6abec60b26d"

Expires:
Fri, 21 Feb 2025 00:14:39 GMT

Last-Modified:
Wed, 21 Feb 2024 21:00:21 GMT

Server:
Google Frontend

Vary:
Accept-Encoding

X-Cloud-Trace-Context:
9c4a58e575f2ed1f58074fdfbddc4d80

X-Goog-Generation:
1708549221459168

X-Goog-Hash:
crc32c=/DZroA==, md5=HOHGDiq/ogsZs9ar7GCybQ==

X-Goog-Metageneration:
1

X-Goog-Storage-Class:
STANDARD

X-Goog-Stored-Content-Encoding:
gzip

X-Goog-Stored-Content-Length:
1170

X-Guploader-Uploadid:
ABPtcPqw_ng_bcX0V-eE-1-hN3oRQkijOGSxYFVLxWQMvP7xubd0PUELJExeOXYPBW00YixW4hQ

Request Headers
Network Log Row Name: example-lb.flutterflow.app, Status: 200OK, Type: document, Initiator: Other, Size: (ServiceWorker)3.0 kB, Time: 323 ms320 ms

4. The request header when accessing example.com from a browser after setting up the load balancer is as follows:

Request URL:
https://example.com/

Request Method:
GET

Status Code:
404 Not Found

Remote Address:
203.0.113.2:443

Referrer Policy:
strict-origin-when-cross-origin

Alt-Svc:
h3=":443"; ma=2592000,h3-29=":443"; ma=2592000

Content-Length:
1561

Content-Type:
text/html; charset=UTF-8

Date:
Thu, 22 Feb 2024 00:19:19 GMT

Server:
ghs

Via:
1.1 google

X-Frame-Options:
SAMEORIGIN

X-Xss-Protection:
0

:authority:
example.com

:method:
GET

:path:
/

:scheme:
https

Accept:
text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8

Accept-Encoding:
gzip, deflate, br

Accept-Language:
ja;q=0.7

Cache-Control:
max-age=0

Sec-Ch-Ua:
"Not A(Brand";v="99", "Brave";v="121", "Chromium";v="121"

Sec-Ch-Ua-Mobile:
?0

Sec-Ch-Ua-Platform:
"Windows"

Sec-Fetch-Dest:
document

Sec-Fetch-Mode:
navigate

Sec-Fetch-Site:
none

Sec-Fetch-User:
?1

Sec-Gpc:
1

Upgrade-Insecure-Requests:
1

User-Agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36
2
3 replies