Giter VIP home page Giter VIP logo

Comments (9)

StyleT avatar StyleT commented on May 28, 2024

Hi! Could you please provide a repo with code that reproduces the issue & guide how to run it?

Also screen recording would help to get a better understanding of the issue you're facing with.

from ilc.

StyleT avatar StyleT commented on May 28, 2024

I looks like you have redirect loop somewhere... routerProps are getting bigger exactly because of this:

  • Initial routerProps you provided after base64 decode:
    {"basePath":"/nuxt","reqUrl":"/nuxt","fragmentName":"nuxt__at__body"}
  • Last routerProps you provided after base64 decode:
{"basePath":"/nuxt","reqUrl":"/nuxt/?routerProps=eyJiYXNlUGF0aCI6Ii9udXh0IiwicmVxVXJsIjoiL251eHQvP3JvdXRlclByb3BzPWV5SmlZWE5sVUdGMGFDSTZJaTl1ZFhoMElpd2ljbVZ4VlhKc0lqb2lMMjUxZUhRdlAzSnZkWFJsY2xCeWIzQnpQV1Y1U21sWldFNXNWVWRHTUdGRFNUWkphVGwxWkZob01FbHBkMmxqYlZaNFZsaEtjMGxxYjJsTU1qVXhaVWhSZGxBelNuWmtXRkpzWTJ4Q2VXSXpRbnBRVjFZMVUyMXNXbGRGTlhOV1ZXUkhUVWRHUkZOVVdrcGhWR3d4V2tab2IwMUZiSEJrTW14cVlsWmFORlpzYUV0ak1HeHhZakpzVFUxcVZYaGFWV2hTWkd4QmVsTnVXbXRYUmtweldUSjRRMlZYU1hwUmJuQlJWakZaTVZVeU1YTlhiR1JHVGxoT1YxWlhVa2hVVldSSFVrWk9WVmRyY0doV1IzZDRWMnRhYjJJd01VWmlTRUpyVFcxNGNWbHNXbUZPUmxwellVVjBhazFIZUhoWmFrcHpWRlV4Y1ZaWWFHRldWMmhUV2tkNFFtVnNUblZYYlhSWVVtdHdlbGRVU2pSUk1sWllVMWh3VW1KdVFsSldha1phVFZaVmVVMVlUbGhpUjFKSFZHeG9UMVl4V2xoVmEyaFZWbGRTU0ZWcldrOVdWbVJ5WTBkb1YxSXpaRFJXTW5SaFlqSkpkMDFWV21sVFJVcHlWR

from ilc.

Khazl avatar Khazl commented on May 28, 2024

Here is a recording of the registry settings:
https://drive.google.com/file/d/1jkXljaCGF0I87Dqzw3M9kM0SbumnJjgE/view?usp=sharing

And here the demo apps repo. It's basically your demo apps with an additional one: /apps/nuxt/
https://github.com/Khazl/ilc-demo-apps-nuxt

Recording from browser: https://drive.google.com/file/d/1grU_NFCme7rLKcZE92qEMTekS4AnopUo/view?usp=sharing
Full log of ilc container: https://drive.google.com/file/d/1ZoeCRa18raki7hwQxWASwRB-LIlXvJGT/view?usp=sharing

wget in ilc container:

Guidos-MBP:ilc guidogasper$ docker exec -it ilc_ilc_1 sh
/codebase # wget -O - http://localhost:3000/nuxt
Connecting to localhost:3000 (127.0.0.1:3000)
writing to stdout
<div data-server-rendered="true" id="__nuxt"><!----><div id="__layout"><div class="container"><div><h1>Nuxt Project</h1></div></div></div></div><script>window.__NUXT__={layout:"default",data:[{}],error:null,serverRendered:true,env:{APP_NAME:"New Project"}};</script><script src="/nuxt/dist/dc0d9f27ec5a88b6a90c.js" defer></script><script src="/nuxt/dist/68ecf2dbfbd59ee4fe75.js" defer></script><script src="/nuxt/dist/77561ce73ece67c4fa59.js" defer></script><script src="/nuxt/dist/08989342d10cf94d29e9.js" defer></script><script src="/nuxt/dist/6f31fb8de43a8b82db11.js" defer></script>
-                    100% |*****************************************************************************************************************************************|   587  0:00:00 ETA
written to stdout

(You may need to refresh the error page to see the error logs and broken url in browser. When you target the path /nuxt directly, not via the navbar, the error logs should appear directly.)

from ilc.

StyleT avatar StyleT commented on May 28, 2024

From what I see in ilc container logs your Nuxt app responds with 301 HTTP code which forces ILC to respond with 301 to browser so you have page reload which makes ILC to do another request to the app and you have a loop as app again responds with 301 code.

I also observe that your app from tries to redirect me from /nuxt/ to /nuxt/en for example... See video https://take.ms/TllU8 This may be an issue... Try to dig deeper there & also look for similar issues.

$ curl -v -H 'Accept-Language: en-US,en;q=0.9,ru;q=0.8,uk;q=0.7' http://localhost:3000/nuxt/
*   Trying ::1:3000...
* TCP_NODELAY set
* Connection failed
* connect to ::1 port 3000 failed: Connection refused
*   Trying 127.0.0.1:3000...
* TCP_NODELAY set
* Connected to localhost (127.0.0.1) port 3000 (#0)
> GET /nuxt/ HTTP/1.1
> Host: localhost:3000
> User-Agent: curl/7.66.0
> Accept: */*
> Accept-Language: en-US,en;q=0.9,ru;q=0.8,uk;q=0.7
> 
* Mark bundle as not supporting multiuse
< HTTP/1.1 302 Found
* Added cookie i18n_redirected="en" for domain localhost, path /, expire 1621956733
< Set-Cookie: i18n_redirected=en; Path=/; Expires=Tue, 25 May 2021 15:32:13 GMT; SameSite=Lax
< Location: /nuxt/en
< Date: Mon, 25 May 2020 15:32:13 GMT
< Connection: keep-alive
< Transfer-Encoding: chunked
< 
* Connection #0 to host localhost left intact

Pay attention that redirect happens only if I send Accept-Language header so your wget requests may show you the wrong data.

Also during initial SSR integration I would recommend you to turn off JS in browser as you try to open your app through ILC to avoid any confusion between server side redirects & client side location changes.

from ilc.

Khazl avatar Khazl commented on May 28, 2024

Thanks for the tip. It looks like that the i18n module causes this /en redirection. I removed the module and the curl request looks better now:

/codebase # curl -v -H 'Accept-Language: en-US,en;q=0.9,ru;q=0.8,uk;q=0.7' http://localhost:3000/nuxt/
*   Trying 127.0.0.1:3000...
* TCP_NODELAY set
* Connected to localhost (127.0.0.1) port 3000 (#0)
> GET /nuxt/ HTTP/1.1
> Host: localhost:3000
> User-Agent: curl/7.67.0
> Accept: */*
> Accept-Language: en-US,en;q=0.9,ru;q=0.8,uk;q=0.7
> 
* Mark bundle as not supporting multiuse
< HTTP/1.1 200 OK
< ETag: "20e-3oCNc/Oil5ya2su+009EE+VzAaY"
< Content-Type: text/html; charset=utf-8
< Accept-Ranges: none
< Content-Length: 526
< Vary: Accept-Encoding
< Date: Tue, 26 May 2020 07:35:12 GMT
< Connection: keep-alive
< 

But the ILC logs still look the same :-/
You didn't notice any misconfiguration in my videos, right?

(I updated the demo app repo)

from ilc.

StyleT avatar StyleT commented on May 28, 2024

@Khazl no, I haven't noticed any misconfiguration, everything looks fine.

Try to use ILC docker image/code from PR #170 I've added more logs there which might help you.
You can also resulted logs here.

from ilc.

Khazl avatar Khazl commented on May 28, 2024

Update: I added a serverMiddleware to the nuxt app. A simple console.log on the request.
I figured out, that this redirect loop was caused by a trailing slash 😓😓😓

The ilc log looks fine now. With disabled JS I also see the correct / expected composition.

Next error I run into is because of some CORS betwen localhost and localhost:3000 😅
Here we go.

from ilc.

StyleT avatar StyleT commented on May 28, 2024

Glad to see it works for you 👍

from ilc.

StyleT avatar StyleT commented on May 28, 2024

@Khazl I'm closing this, feel free to reopen, if you still having this issue

from ilc.

Related Issues (13)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.