I am in a basic Next.js/Node.js project, and want to load a YAML "page metadata" file to generate a social media image. The metadata only has title, url, and image and such. The problem is, I load this YAML metadata from a file that is based on the URL, which can potentially be hacked.
So if I have a URL like /foo/bar/baz, I want to load the YAML config for that page inside $APP_FOLDER/data/pages/foo/bar/baz/metadata.yaml. The problem I'm imagining (in Node.js), is you change the URL to /../../something-secret like even /../../package.json, and doing the following will load the package.json:
fs.readFileSync(`${process.cwd()}/data/pages/${urlPath}`)
So it would resolve to (for example):
fs.readFileSync(`./data/pages/../../package.json`)
I don't want that, that is a security problem.
So I think about the path module, and doing path.relative(a, b), but I'm not sure that is correct or would solve the problem.
My question is kind of generic though, how do I (in Node.js) prevent a user from navigating the file system like this? How can I enforce "only allow searching within the ./data/pages folder recursively"?
Could you put these static files inside the /public directory of your Next.js project? Then you could more safely fetch from URLs instead of local file system. Also, Since Next.js primarily makes isomorphic React apps, you will probably have trouble using fs, or other Node modules that you wouldn't find in the browser, unless you try the new experimental "app" directory.
Related
I'm wondering how to deal with importing files, when I work with a frontend hosted on OVH, and a backend hosted on Heroku.
So, here is my logic, I would like to know if it makes sense to you :
I create a route in my API that will store the file in my backend server
I update the user profile with a string that correspond to the path of the file
From the front, I ask a route that will ask the file to the backend with the path stored in mongoDB
Does that make sense ?
I think what you described makes a lot of sense. However I suggest a minor change, Instead of saving file path in user profile, save the complete hosted URL of the file. This will come in handy if you choose to change your image hosting solution later on and also reduces the dependency between your client and backend.
I have a web application where user can upload and view files. The user has a link next to the file (s)he has uploaded. Clicking on the link will open the file in the browser (if possible) or show the download dialog (of the browser). Meaning that, if the user upload an html/pdf/txt file it will be rendered in the browser but if it is a word document, it will be downloaded.
It is identified that rendering the HTML file in the browser could be a vulnerability - Cross Site Scripting.
What is the right solution to this problem? The two options I am currently looking at are:
to put Content-Disposition header in the response to make HTML files downloaded instead viewed in the browser.
to find some html scrubbing/sanitizing library to remove any javascript from the file before I serve it.
Looking at the gmail, they do the second approach (of scrubbing) with having a separate domain for the file download - may be to minimize/distract the attack surface. However in this approach the receiver gets a different file than what was sent. Which is not 'right' in my opinion; may be I am biased. In my case, the first one is easy to fix. But I wonder if that is enough, or is there any thing that I overlook!
What are your thoughts on these approaches? Or do you have any other suggestions?
Based on your description, I can see 3 posible attack types (maybe there are more):
Client side code execution
As you said, your web server may serve a file as HTML and run javascript code on the client. This can be avoided with Content-Disposition but I would go with MIME types control through Content-Type. I would define my known type of files (e.g. pdf, jpeg etc.) and serve them with their respective MIME type (e.g. application/pdf, image/jpeg etc.). Anything else I would serve it as application/octet-stream.
Server side code execution
Althougth I see this as an out of topic attack (since it involves other parts of your application and your server) be sure to avoid executing files on the server (e.g. PHP code through LFI). Your webserver should not access directly the files (e.g. again PHP), better store them somethere not accesible through a URL and retrive them on request.
Think if here you are able to reject files (e.g. reject .exe uploads) and ask the user to zip them first.
Trust issues
Since the files are under the same domain, the files will be accesible from javascript (ajax or load as script) and other programs (or people) may trust your links. This is also related to the previous point, if you don't need unzipped exe files, don't allow them. Using an other domain may mitigate some trust problems.
Other ideas:
Zip all files uploaded
Scan each file with antivirus software
PS: For me sanitization would not work in your case. The risk of missing something is too high.
To render on threejs, we need some images(jpg/png) and , jsons(uv data). All these files are stored in respective folders and the files visible for clients to look at.
I use django/python to start a local server, python code is compiled to .pyc & js code is obfuscated. But the folder structure is accessible for Casual Users. In threejs, we use tex_loader and json_loader functions to which the file paths are given as inputs. Was looking at ways of securing the behind the scenes work.
Happened to read about custom binary formats, but that felt like a lot of work.
or giving access to files only for certain process starting through django/web browser?
Are there any available easy to deploy solutions to protect our IP ?
An option would be to only serve the files to authenticated users. This could be achieved by having an endpoint on your backend like:
api/assets/data.json
and the controller in the backend would receive the file name(data.json), the code could check if the user requesting the endpoint is authenticated and if so read the file from the file system(my-private-folder/assets/data.json) and return it as file with correct mime-type to the browser.
I developed a small node.js app in which I can configure conditions for a custom javascript file, which can be embedded in a webpage, and which modifies the DOM of that page in the browser on load. The configuration values are stored in MongoDB. (For sake of argument: add class "A" to DOM element with ID "B" )
I have difficulties to figure out the best way to serve requests / the JavaScript file.
Option 1 and my current implementation is:
I save a configuration in the node app and a distinct JavaScript
file is created for that configuration.
The page references that file which is hosted and served by the server.
Option 2 and where I think I want and should go is:
I saves a configuration (mongodb) NO JavaScript file is created Pages
a generic JavaScript link (for instance: api.service.com/javascript.js)
Node.js / Express app processes the request, and
returns a custom JavaScript (file?) with the correct values as saved in mongodb for that configuration
Now, while I believe this is the right way to go about it, I am unsure HOW to go about it. Any ideas and advise are very welcome!
Ps: For instance I wonder how best to authenticate or identify the origin, user and requested configuration. Shall I do this like: api.service.com/javascript.js&id="userID" - is that good practice?
Why not serve up a generic Javascript file which can take a customized json object (directly from mongodb) and apply the necessary actions? You can include the json data on the page if you really need to have everything embedded, but breaking up configuration and code is the most maintainable approach.
I have built my entire website with Flash and embedded several swf objects (slideshows) into it. Everything works fine when I publish it as swf movie, but now that I want to upload my website, an error message occurs saying:
Error #2044: Unhandled SecurityErrorEvent:. text=Error #2140: Security sandbox violation: file:///mylayout.swf cannot load file:///slideshow_1.swf. Local-with-filesystem and local-with-networking SWF files cannot load each other.
I know that it has something to do with the fact that one of the swf files is local to the filesystem and the other local via networking, but in my publish settings, I told it to access local files only. That didn't help.
I am hosting my website at www.all-inkl.com; besides that, I have not uploaded it yet; I'm just testing it offline. I know I should add this code somewhere:
<allow-access-from domain="localhost" secure="true"/>`
but I'm not sure where to add it. Maybe to my timeline?
The crossdomain.xml file should have your server name specified. For example take a look at http://www.msn.com/crossdomain.xml
You will have to specify the domain names there. Your server should also be having a crossdomain.xml. Add the corresponding server name there. For example if you are using localhost, try adding
<allow-access-from domain="localhost" secure="true"/>
check your swf loading paths. try to specify the entire path like "hppt://www.yourdomain.com/yourweb/mylayout.swf" like this for every swf. and set the html code where the swf embed tag for allowScriptAccess : "always"