Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Question: How to bypass /static path to next.js? #48

Open
Xilel opened this issue May 24, 2020 · 6 comments
Open

Question: How to bypass /static path to next.js? #48

Xilel opened this issue May 24, 2020 · 6 comments
Labels
enhancement New feature or request question Further information is requested

Comments

@Xilel
Copy link
Contributor

Xilel commented May 24, 2020

Let's say, you want to get some static files to be load on pages (like img) with next.js (https://nextjs.org/docs/basic-features/static-file-serving). Right now all links to /static path will be captured with nest.js. You can use @nestjs/serve-static but it is unpleasant to use. Is were are some way to pass this matter to nest-next?
Nest-next version: 9.1.5
Next version: 9.3.3
Nest: 7.0.9

@Xilel Xilel changed the title How to bypass /static path to next.js Question: How to bypass /static path to next.js? May 24, 2020
@Xilel
Copy link
Contributor Author

Xilel commented May 24, 2020

Ok, after read render.filter.ts i understand what any request not handled by nest controllers go to next. So i order to provide static file you need to create directory static in next project root.
Example:
изображение
However, public folder did not work for me. What is strange, Next.js supporting it from 9.1 version.
So i think we need to do 2 thinks:

  1. Check how pass static file through /public directory, not the /static directory. We need this because /static directory is deprecated. (https://github.com/zeit/next.js/blob/master/errors/static-dir-deprecated.md)
  2. Write guide in README.md how to handle static file and add pages that access static files in examples.

@kyle-mccarthy
Copy link
Owner

This was recently brought up in #47.

One of the main problems is how Nextjs handles the public files. Let's say that you have a fresh nextjs install without any nest integrations and you have your logo saved to /public/images/logo.png. If you try to access that file with that path it will 404, but if you try to access it at /images/logo.png next will correctly resolve the path.

So this brings up the question of how do we know what requests are for a static files since we can't just check if the req starts with public. From what I can tell, when next's server is generating all of the routes, it generates a list of all the public routes too. I am not sure if we should just take their lead, and generate a list of all the routes for public assets, but I am open to suggestions.

@kyle-mccarthy kyle-mccarthy added the enhancement New feature or request label May 26, 2020
@kyle-mccarthy
Copy link
Owner

@Xilel I just added a new config option, see this comment for some info on how to get the public directory working

@kyle-mccarthy kyle-mccarthy added the question Further information is requested label Sep 3, 2020
@stevefan1999-personal
Copy link

why dont you just add a static serving module in NestJS lol

@kyle-mccarthy
Copy link
Owner

@stevefan1999-personal That should work fine as long as you want to have Nest serve the static content rather than Next. Next allows for serving static content from the public folder but then performs a "rewrite" on the URL. So if you have an asset such as public/my-image.png, it can be accessed from /my-image.png.

@stevefan1999-personal
Copy link

stevefan1999-personal commented Feb 16, 2021

@kyle-mccarthy well but it sort of works. Hell, I was even able to get next/image to work with this too. So I take that as a practical workaround, still the better solution is what you proposed (if I got right of your idea), when you hit 404 in Next, and try to see if the URL is starting in one of the public/static folders and redirect whenever possible.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request question Further information is requested
Projects
None yet
Development

No branches or pull requests

3 participants