netlify / angular-runtime

The Angular Runtime allows Angular to run on Netlify with zero configuration
https://docs.netlify.com/integrations/frameworks/angular/
MIT License
18 stars 7 forks source link

Can't use netlify.request #113

Open quedicesebas opened 1 month ago

quedicesebas commented 1 month ago

Describe the bug I need to use the request info in my app, you say I can inject in my components constructor the netlify.request, and, for example, print on the console the request url, but where can I see that output running locally with netlify serve? Please help

To Reproduce Steps to reproduce the behavior:

  1. I added the @Inject('netlify.request') @Optional() request?: Request, to the main component (AppComponent), the home page component and a service constructors:
    constructor(
    // ...
    @Inject('netlify.request') @Optional() request?: Request,
    @Inject('netlify.context') @Optional() context?: Context,
    ) {
    console.log(`#request:`, request);
    }
  2. I run first with netlify serve, but no console output was shown. Then, I used netlify dev, and got path: undefined headers: undefined everywhere.

Expected behavior Be able to obtain the request url and headers to extract info and use to SSR load data.

Versions

If you're using the CLI to build

If you're using file-based installation

Skn0tt commented 1 month ago

I see you're using Angular v18. We recently shipped a fix to this plugin that adds support for v18: https://github.com/netlify/angular-runtime/pull/110

Also, could you post the console output of netlify serve? I'd like to check if the plugin is being initialised correctly.

quedicesebas commented 1 month ago

Here it is. Check the #request print, is null:

$ netlify serve
◈ Injecting environment variable values for all scopes
◈ Ignored general context env var: LANG (defined in process)
◈ Using simple static server because '[dev.framework]' was set to '#static'
◈ Running static server from "la-comanda-front\dist\frontdesk\browser"
◈ Building site for production
◈ Changes will not be hot-reloaded, so if you need to rebuild your site you must exit and run 'netlify serve' again

Netlify Build
────────────────────────────────────────────────────────────────

❯ Version
  @netlify/build 29.42.2

❯ Flags
  outputConfigPath: C:\Users\sebas\source\repos\esaes\alacarta\la-comanda-front\.netlify\netlify.toml

❯ Current directory
  C:\Users\sebas\source\repos\esaes\alacarta\la-comanda-front

❯ Config file
  No config file was defined: using default values.

❯ Context
  production

Build command from Netlify app
────────────────────────────────────────────────────────────────

$ ng build
⠸ Building...
⠦ Building...
#request: null
Browser bundles
Initial chunk files     | Names                     |  Raw size | Estimated transfer size
chunk-YMOG6ME4.js       | -                         | 167.40 kB |                50.31 kB
main-CM43LHUF.js        | main                      |  80.43 kB |                21.77 kB
chunk-OVC237T3.js       | -                         |  71.02 kB |                17.54 kB
polyfills-IRVPEVSR.js   | polyfills                 |  37.70 kB |                12.37 kB
chunk-SW3JVOTL.js       | -                         |  36.29 kB |                10.61 kB
chunk-DSUFEAAO.js       | -                         |  34.59 kB |                 8.09 kB
styles-ZH2JNHBT.css     | styles                    |  26.34 kB |                 5.01 kB
chunk-T37C5E54.js       | -                         |  20.90 kB |                 6.30 kB
chunk-ZWZBTOHE.js       | -                         |  15.10 kB |                 3.87 kB
chunk-PMNANCDC.js       | -                         |  14.49 kB |                 4.46 kB
chunk-KRO7KLRD.js       | -                         |  12.17 kB |                 3.79 kB
chunk-5WMJEHLI.js       | -                         |   9.57 kB |                 3.22 kB
chunk-GZKPFV6W.js       | -                         |   7.02 kB |                 1.50 kB
chunk-VYVJAXFA.js       | -                         |   6.15 kB |                 1.82 kB
chunk-JZJPZEHW.js       | -                         |   5.26 kB |                 2.04 kB
chunk-IXLDGACM.js       | -                         |   4.88 kB |                 1.59 kB
chunk-H6OVBTN2.js       | -                         |   4.57 kB |                 1.49 kB
chunk-WKWV3TAS.js       | -                         |   4.02 kB |                 1.49 kB
chunk-OMGGXW5J.js       | -                         |   1.81 kB |               833 bytes
chunk-7CJWOSTI.js       | -                         | 690 bytes |               690 bytes
chunk-BXV5FBXG.js       | -                         | 556 bytes |               556 bytes

                        | Initial total             | 560.96 kB |               159.33 kB

Lazy chunk files        | Names                     |  Raw size | Estimated transfer size
chunk-TOQM72AJ.js       | menu-routes               | 300.86 kB |                60.20 kB
chunk-D5HFU6D7.js       | footer-component          |  12.18 kB |                 3.98 kB
chunk-DJKEBVPB.js       | contact-form-component    |   6.12 kB |                 1.95 kB
chunk-Z7ZA7J66.js       | reviews-component         |   4.88 kB |                 2.02 kB
chunk-S7MZWJQV.js       | menu-highlights-component |   2.97 kB |                 1.29 kB
chunk-32FWCSWV.js       | image-gallery-component   |   1.58 kB |               967 bytes
chunk-AQM6ZDYT.js       | -                         | 480 bytes |               480 bytes
chunk-SH2VM2SF.js       | -                         | 475 bytes |               475 bytes
chunk-IYCAJCGF.js       | menu-item-component       | 347 bytes |               347 bytes
chunk-QM3I2LGQ.js       | -                         | 345 bytes |               345 bytes
chunk-S22GHMVX.js       | group-pipe                | 310 bytes |               310 bytes
chunk-2DKO3SH6.js       | safe-pipe                 | 170 bytes |               170 bytes
chunk-3OYW2UKK.js       | day-working-hours-pipe    | 125 bytes |               125 bytes
chunk-DM36I2WQ.js       | local-week-day-pipe       | 122 bytes |               122 bytes

Server bundles
Initial chunk files     | Names                     |  Raw size
server.mjs              | server                    |   1.11 MB |                    

chunk-PJZYR4LY.mjs      | -                         | 303.44 kB |                    

polyfills.server.mjs    | polyfills.server          | 271.77 kB |                    

chunk-RPSECG4Q.mjs      | -                         | 181.32 kB |                    

chunk-VLOO4QAL.mjs      | -                         |  71.10 kB |                    

chunk-EARGPR4E.mjs      | -                         |  36.35 kB |                    

chunk-GVEZBWF5.mjs      | -                         |  34.66 kB |                    

chunk-RF2DYPU6.mjs      | -                         |  21.04 kB |                    

chunk-YPJ2F3WR.mjs      | -                         |  20.97 kB |                    

chunk-WNIKRNJH.mjs      | -                         |  15.16 kB |                    

chunk-XAE447VA.mjs      | -                         |  14.58 kB |                    

chunk-5PPNNJFK.mjs      | -                         |   9.65 kB |                    

chunk-ASSCUABX.mjs      | -                         |   8.22 kB |                    

chunk-DUMRM5EB.mjs      | -                         |   7.06 kB |                    

chunk-N52BYY52.mjs      | -                         |   6.18 kB |                    

chunk-HYMPX2E3.mjs      | -                         |   5.30 kB |                    

chunk-LS6A4W2O.mjs      | -                         |   4.95 kB |                    

chunk-VRICCG6X.mjs      | -                         |   4.60 kB |                    

chunk-N3GS6WWD.mjs      | -                         |   4.16 kB |                    

chunk-X7FTMVZD.mjs      | -                         |   4.05 kB |                    

chunk-FAS7NTU2.mjs      | -                         |   2.87 kB |                    

chunk-GTXTAGYV.mjs      | -                         |   1.84 kB |                    

render-utils.server.mjs | render-utils.server       |   1.64 kB |                    

chunk-BDRE5J32.mjs      | -                         | 725 bytes |                    

main.server.mjs         | main.server               | 700 bytes |                    

chunk-24GPXDMS.mjs      | -                         | 589 bytes |                    

Lazy chunk files        | Names                     |  Raw size
chunk-WK5PLXW3.mjs      | menu-routes               | 300.97 kB |                    

chunk-UWGSRKJD.mjs      | footer-component          |  12.26 kB |                    

chunk-ODRNCYWC.mjs      | xhr2                      |  12.08 kB |                    

chunk-KAFYCHYP.mjs      | contact-form-component    |   6.19 kB |                    

chunk-MNULDDJC.mjs      | reviews-component         |   4.96 kB |                    

chunk-EMWMBFFY.mjs      | menu-highlights-component |   3.05 kB |                    

chunk-SMLLQHHN.mjs      | image-gallery-component   |   1.65 kB |                    

chunk-ZQ4AHFMZ.mjs      | -                         | 515 bytes |                    

chunk-22I5FER4.mjs      | -                         | 510 bytes |                    

chunk-ECQGZWMH.mjs      | menu-item-component       | 420 bytes |                    

chunk-J4DHFSCU.mjs      | -                         | 379 bytes |                    

chunk-CWRSK5MY.mjs      | group-pipe                | 373 bytes |                    

chunk-GOVU5I4J.mjs      | safe-pipe                 | 237 bytes |                    

chunk-YRT6LYG4.mjs      | day-working-hours-pipe    | 190 bytes |                    

chunk-XT5YXH2X.mjs      | local-week-day-pipe       | 187 bytes |                    

Prerendered 2 static routes.
Output location: C:\Users\sebas\source\repos\esaes\alacarta\la-comanda-front\dist\frontdesk

Application bundle generation complete. [12.474 seconds]

▲ [WARNING] bundle initial exceeded maximum budget. Budget 512.00 kB was not met by 48.96 kB with a total of 560.96 kB.

▲ [WARNING] src/app/common/components/button/button.component.css exceeded maximum budget. Budget 2.05 kB was not met by 1.02 kB with a total of 3.07 kB.

(build.command completed in 14.5s)

Functions bundling
────────────────────────────────────────────────────────────────

No Functions were found in netlify\functions directory

(Functions bundling completed in 4ms)

Save deploy artifacts
────────────────────────────────────────────────────────────────

(Save deploy artifacts completed in 1ms)

Netlify Build Complete
────────────────────────────────────────────────────────────────

(Netlify Build completed in 14.5s)

◈ Static server listening to 3999

   ┌─────────────────────────────────────────────────┐
   │                                                 │
   │   ◈ Server now ready on http://localhost:8888   │
   │                                                 │
   └─────────────────────────────────────────────────┘
Skn0tt commented 1 month ago

Alright, to me this looks like the Angular plugin isn't running as intended. See the Using simple static server because '[dev.framework]' was set to '#static' line towards the top. Could you share that repository, or a minimal reproduction repo?

srcn commented 1 month ago

I have the exact same issue.

Here's a minimal reproduction repo: https://github.com/srcn/netlify-angular-ssr

Skn0tt commented 1 month ago

Thanks for providing the repro! I think what's going on here is that your CLI isn't connected to the Netlify site, so it doesn't automatically install the Angular plugin that's required to make SSR work correctly here. To connect, you can run netlify link and try again. If that still doesn't help, you can add this to your netlify.toml:

[[plugins]]
  package="@netlify/angular-runtime"
srcn commented 1 month ago

Actually it was linked and the runtime was installing correctly but I figured out the issue. The prerendering was enabled!

Disabling the prerendering from angular.json fixes the issue.

Skn0tt commented 1 month ago

Happy to hear you got it fixed @srcn. I think @quedicesebas your case is a little different, the logs clearly show that the plugin isn't running. Could you try the netlify.toml snippet I posted above?

quedicesebas commented 3 weeks ago

Sorry @Skn0tt, I moved to the brand new App Hosting service on Firebase.