I’m trying to run a small POC and I’m having an issue getting Pages Functions to work.
I used npm create cloudflare@latest to scaffold out an Angular Pages project, and successfully deployed it in to my account. Next I added a functions directory with a HelloWorld and deployed again, and I can see the function. I can see my Function route as registered /api/helloWorld in the deployment details.
The problem is I cannot seem to hit the route that contains the HelloWorld function. Adding /api/helloWorld to the root domain just redirects back to the Angular splash page. I tried playing around with _routes.json, but didn’t make any meaningful progress. I feel like the answer is simple, and I’m just overlooking it.
Based on the contents of the dist directory and this page:
https://developers.cloudflare.com/pages/platform/functions/advanced-mode
it appears the the Angular SSR project that is scaffolded by create-cloudflare version 2.0.2 it not compatible with the functions directory because it generates a _worker.js file within the dist folder.
I presume that in order to make use of functions, I’ll need to manually alter the scaffolded main.server.ts to catch routes as needed, and avoid the functions directory.
Just to be a bit more direct, manually adding routes to main.server.ts allowed me to setup my endpoints without being redirected back to the root.
1 Like
Yes, correct, you can have “advanced mode” OR a /functions directory, but not both – because a /functions directory is itself built into a worker, so “advanced mode” bypasses that process.
You were getting redirected to the root because that’s the default SPA behavior. If you add a 404.html file you would get a 404 error instead on a nonexistent route.