I have a mounted app that taking requests on the /myapp/ path. Now I want to serve static content.
The path has to be absolute in the context of my mounted app, but relative to the path of the mount itself.
So, for example, I want the pages on /myapp/something/ and /myapp/asd/somethingelse to all load images, CSS and whatnot from /myapp/. The files themselves are in the public folder with routing setup for serving static content.
The problem is that I can't put relative paths in my base layout template because if the request path is /myapp/asd/somethingelse the browser will look for /myapp/asd/mystaticcontent.css and I can't use absolute paths because the path to myapp might change which would require manual modification every time I move it.
What I basically need is a way to get that prefix that express hides from the mounted app AND NOTHING ELSE.
There's request.originalUrl but that also contains the path that myapp is matching on. I don't know how to reliably strip the request.url from request.originalUrl and it does seem kind of a roundabout way of doing it.
If I had that base URL of my mounted app, I could pass it to the template and then generate an absolute path on the spot.
Edit:
app.path() might be what I want but this isn't documented.
Related
There is a stack that uses Next.js as the main dependency. Each page is an independent application. An index page uses www.domain.com/_next/*.js so its base path configured as a / root. Also, another application has a base path same as the homepage but a little difference which is using a query string in the URL.
if the URL is www.domain.com/ then it is a homepage, if the URL is www.domain.com?key=value it means it is a different page and the request will be redirected to the associated application by the Nginx and Load Balancers. So, the problem is:
the main page is serving its statics under the www.domain.com/_next/*.js
the page that parses query strings is serving its statics under the same location same as MainPage www.domain.com/_next/*.js
These applications have different statics created by different pipelines also there is a cache mechanism. Is there a way to solve that conflict just by making some configuration in Next.js?
You can use the basePath settings introduced in Next.js 9.5 (https://nextjs.org/docs/api-reference/next.config.js/basepath)
But your .next/ folder would be changed, something like yourdomain.com/yourbasepath/_next
If you want to change only the .next/ folder location assetPrefix can be used. I think you can take a look at assetPrefix https://github.com/vercel/next.js/issues/5602#issuecomment-673382891
Or we can setup the custom server, for example the Express and custom the base asset path via Express (https://expressjs.com/en/starter/static-files.html)
app.use('/static', express.static('public'))
P/s: The asker choose the assetPrefix solution
In node.js with express all the static content is placed in /public folder. Can someone help me understand why do we need to place it particularly in public folder? What if I want to create a folder called 'static' with in 'views' folder and keep all images, styles and script files in it. Because I want keep all thing related to views under one folder. If it is not good way of structuring project please help me in understanding reasons behind it.
You can put your content in any folder you want on the server. All that matters is how you set up your Express routes to serve that public content. You can name the local server folder /public or /static or whatever you want and you can put it anywhere in your folder hierarchy that you want too (like in some project directory). You will just need to set the path in your express.static() middleware to match where you put the content on your server so express knows where to look for it to match a given incoming request.
There might be an answer to this, but I don't know how to phrase it properly, so I'll just ask.
I use a module, called build-url. It is designed for the browser and provides an easy way to construct URLs with query parameters.
I want to store my website in a folder, called site while not having to type it in the URL. I managed to do that easily. However, when the client asks for the build-url.js file, he receives a 404.
Here's how the folder structure looks like:
node_modules
build-url
dist
build-url.js
site
index.html
In my code, I have:
app.use("/", express.static(__dirname + "/site"));
The problem
When I go to http://localhost:5000/, the index.html file is served and everything is fine. Inside, I include the script:
<script src="../node_modules/build-url/dist/build-url.js"></script>
However, in the browser console, I see:
GET http://localhost:5000/node_modules/build-url/dist/build-url.js 404 (Not Found)
The server looks for a node_modules folder inside the site folder, instead of going up the directory tree. How do I fix that?
It is not a very good idea to allow your web server to send files from outside of the specified folder because it will allow the bad guys to download anything from your server including your confidential data.
You can copy required file to static folder or you can setup gulp or any other automation tool to do it automatically.
I have the following problem:
There's a server with Redis on it.
I want to be able to see Redis data and change it on my web-site. So I installed redis-commander on the server via npm. It usually listens to 8081 port.
And in my front-end part I created a button "Redis manager", which showes view with the following html:
<iframe id="frame" src="{{redisUIUrl}}" />
redisUIUrl looks like: https://example.com/redis
there's NGINX between front-end and server, which is used for reverse-proxy purpose. - it makes proxy_pass to oh_so_very_secret_syte.com:8081
So, when we make this GET, we get views from redis-commander. Everything is fine. But in this views there are links to the static of type: /css/default.css - relative ones.
And the problem is that instead of loading static via the address https://example.com/redis/css/default.css it tries to load it via https://example.com/css/default.css and fails.
I don't really understand, what is the problem and how to deal with it. So, I am asking for your help. Thank you in advance.
/css/default.css may be a relative URL, but it has an absolute path component. Which means that all references are relative to your server root.
If you require a path relative URL you need to drop the leading /.
css/default.css
will reference resources in the same directory as the current document.
Most of the URL links (css, images, js files etc) in my project are absolute, but these don't work on my server.
I've located the project on my server in a subfolder, so it is going to the root.
How can I change this so the url like /images/background.jpg is going to 123.12.34.56/projectfolder/images/background.jpg instead of 123.12.34.56/images/background.jpg?
I guess it has something to do with Apache config, but I couldn't find it yet...
I'm using Laravel, so maybe there are some laraways to fix this.
Try to take the path url from the root.
If you are using PHP you can use getcwd() function and save it in a variable path root and keep all your URL as relative paths not the absolute paths.
Hope this helps.
what i usually do is create a sub domain (cdn.example.com) and point it to a directory called assets which is in the same level as the public directory. All my js, images, css are in there.
Then in the app.config add a new key value pair 'cdn' => 'http://cdn.example.com'. When i'm adding css or js files i'm using it like this.
<script src="<?php echo Config::get('app.cdn') ?>/js/jquery/1.7.1/jquery.min.js"></script>
Why do this? say if i decide to move my assets to a caching server i can easily do so by moving just the cdn.example.com