question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[BUG] Login with Google unresponsive

See original GitHub issue

Describe the bug When attempting to login with Google, the button clicks, but otherwise is non-responsive.

To Reproduce Steps to reproduce the behavior: image

Google Settings Authorised JavaScript origins: https://resume.mydomain.com

Authorised redirect URIs: https://resume.mydomain.com/api/v2/auth/oauth2/google/callback

Docker Compose

  reactiveresumeserver:
    image: amruthpillai/reactive-resume:server-latest
    container_name: ReactiveResume-Server
    environment:
      - PUBLIC_URL=https://resume.$DOMAINNAME
      - POSTGRES_HOST=reactiveresumedb
      - POSTGRES_DATABASE=postgres
      - POSTGRES_PASSWORD=mypassword
      - POSTGRES_USERNAME=postgres
      - TZ=$TZ
      - SECRET_KEY=mypassword
      - JWT_SECRET=mypassword
      - JWT_EXPIRY_TIME=604800
    depends_on:
      - reactiveresumedb
    networks:
      pihole:
        ipv4_address: '172.22.0.140'
      isolated:
    labels: 
      - autoheal=true
      - "traefik.enable=true"
      ## HTTP Routers
      - "traefik.http.routers.resumeserver-rtr.entrypoints=https"
      - "traefik.http.routers.resumeserver.rule=Host(`resume.$DOMAINNAME`) && PathPrefix(`/api/`)"
      - "traefik.http.routers.resumeserver.middlewares=server-stripprefix"
      - "traefik.http.routers.resumeserver-rtr.tls=true"
      ## Middlewares
      - "traefik.http.routers.resumeserver-rtr.middlewares=chain-no-auth@file" # No Authentication
      - "traefik.http.middlewares.resumeserver-stripprefix.stripprefix.prefixes=/api"
      - "traefik.http.middlewares.resumeserver-stripprefix.stripprefix.forceslash=true"
      ## HTTP Services
      - "traefik.http.routers.resumeserver-rtr.service=resumeserver-svc"
      - "traefik.http.services.resumeserver-svc.loadbalancer.server.port=3100"      

  reactiveresumeclient:
    image: amruthpillai/reactive-resume:client-latest
    container_name: ReactiveResume-Client
    environment:
      - PUBLIC_SERVER_URL=https://resume.$DOMAINNAME/api
      - TZ=$TZ
      - SECRET_KEY=mypassword
      - JWT_SECRET=mypassword
      - JWT_EXPIRY_TIME=604800
      - PUBLIC_GOOGLE_CLIENT_ID=googleID
      - GOOGLE_CLIENT_SECRET=googlesecret
      - GOOGLE_API_KEY=myapikey
    depends_on:
      - reactiveresumeserver
    networks:
      pihole:
        ipv4_address: '172.22.0.141'
    labels: 
      - autoheal=true
      - "traefik.enable=true"
      ## HTTP Routers
      - "traefik.http.routers.resume-rtr.entrypoints=https"
      - "traefik.http.routers.resume-rtr.rule=Host(`resume.$DOMAINNAME`)"
      - "traefik.http.routers.resume-rtr.tls=true"
      ## Middlewares
      - "traefik.http.routers.resume-rtr.middlewares=chain-no-auth@file" # No Authentication
      ## HTTP Services
      - "traefik.http.routers.resume-rtr.service=resume-svc"
      - "traefik.http.services.resume-svc.loadbalancer.server.port=3000"
      ## Flame Dashboard
      - flame.type=application # "app" works too
      - flame.name=ReactiveResume
      - flame.icon=https://raw.githubusercontent.com/modem7/MiscAssets/master/Icons/HeimdallIcons/resume.png
      # - flame.icon=custom to make changes in app. ie: custom icon upload

  reactiveresumedb:
    image: postgres:alpine
    container_name: ReactiveResume-DB
    environment:
      - TZ=$TZ
      - POSTGRES_DB=postgres
      - POSTGRES_PASSWORD=mypassword
      - POSTGRES_USER=postgres
    networks:
      - isolated
    ports:
      - 5432:5432
    volumes:
      - $USERDIR/ReactiveResume:/var/lib/postgresql/data

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:14 (14 by maintainers)

github_iconTop GitHub Comments

2reactions
modem7commented, Mar 14, 2022

Seems alright now, only thing is PathPrefix might have to be PathPrefix(/api/) with the last slash if forceSlash is set to true. Do let me know if that works out for you 😃

Bam, that now works!

The TLDR it seems was:

Because I’m using middleware chains in Traefik (this all would have been answered had I checked the dashboard or traefik logs from the get go), the pathprefix middleware needed to be attached to that.

Thank you very much for this!

I look forward to using this, and I’ll whack any suggestions if there are any in the relevant issue!

Thank you again!

2reactions
modem7commented, Mar 14, 2022

Yes, but for safety concerns, I’ve made it such that no request from any other domain is entertained by the client-server unless they are on the same domain AND/OR subdomain. This means if the client exists on resume.mydomain.com, the server must exist on resume.mydomain.com/api/health.

I noticed this pattern existed in a lot of client-server monolith applications and adopted it fully knowing that it is a bit complicated, but it provides a sense of security especially on production, knowing that no other client can have access to the server because of CORS limitations.

Ahhah! That makes sense. I’ve reverted the config to reflect this.

    labels: 
      - autoheal=true
      - "traefik.enable=true"
      ## HTTP Routers
      - "traefik.http.routers.resumeserver-rtr.entrypoints=https"
      - "traefik.http.routers.resumeserver-rtr.rule=Host(`resume.$DOMAINNAME`) && PathPrefix(`/api`)"
      - "traefik.http.routers.resumeserver-rtr.tls=true"
      ## Middlewares
      - "traefik.http.routers.resumeserver-rtr.middlewares=chain-no-auth@file, resume-api" # No Authentication
      - "traefik.http.middlewares.resume-api.stripprefix.prefixes=/api"
      - "traefik.http.middlewares.resume-api.stripprefix.forceslash=true"

image

https://resume.mydomain.com/api/health now gives: {"status":"ok","info":{"database":{"status":"up"},"app":{"status":"up"},"docs":{"status":"up"}},"error":{},"details":{"database":{"status":"up"},"app":{"status":"up"},"docs":{"status":"up"}}}

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to Fix a “Page Unresponsive” Error in Google Chrome
Google Chrome usually displays a “Page Unresponsive” error when a web page takes too long or fails to load correctly.
Read more >
Google Chrome Page Unresponsive Error in Windows 10 / 11
1 – Open Chrome Browser. 2 – Go to chrome://settings/privacy from the address bar. 3 – Now, click on Cookies and other site...
Read more >
How to Fix “Google Chrome is Unresponsive” Error? - Appuals
Go to the top right to open the three dots and click on Help. Then go to About Google Chrome to update to...
Read more >
Can't sign in to your Google Account
If you can't sign in to your Google Account in Gmail, Google Drive, Google Play, or elsewhere, select the issue that most closely...
Read more >
How to Fix: Page Unresponsive [Kill Pages] Error in Chrome?
If you are stuck in Chrome Browser and the error shows the Unresponsiveness in Chrome then the major fixes that you can use...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found