My meaning is I press a button (in the webpage) which executes an addEventListener() function. After that, the function changes some JSON data and saves that. Then, in the future, people could access the JSON data.
An example is a login/register page deployed using Netlify.
So I first have a simple file system:
login-register-project:
- index.html
- db.json
- login-page:
- login.html
- login.js
- register-page:
- register.html
- register.js
- home-page:
- hub.html
- hub.js
Inside db.json has:
{
"username":{
"pw":"password",
"login_bool":false
}
}
home-page is the page displayed after login or register is complete.
index.html sends the user to register-page's register.html. There would then be a login instead option in there, which the user can use to choose either to register or login.
After filling in register.html's register details and clicking the "sign in" button, register.js would then put the data into db.json, sets login_bool to true and redirect the user to https://websitename.com/home-page/hub.html?{user's usrname}|{user's pw}
Alternatively, after filling in login.html's login details and clicking the "login" button, login.js would then set login_bool to true and redirect the user to https://websitename.com/home-page/hub.html?{user's usrname}|{user's pw}.
hub.html then checks whether the username and password data given were correct and checks if login_bool was set to true. If all information is correct, the website displays its contents. If login_bool was set to false or the username/password were incorrect, the user will be redirected to index.html
BTW, there will be a "log out" button in hub.html that lets users to "log out" and sets login_bool to false.
Now, if this works, then how would I retrieve the data from the JSON file deployed and copy it to my JSON file so that when I deploy a new update, no data will be lost?
If I missed anything/my information was incorreect/you require furthur information, please tell me.
Thanks to anyone who answers.
Short answer: Your logic is correct but that's not how it works on Netlify. I'd rather advise using an external database to store this data.
Long answer: Netlify's deploys are immutable once published. This means that, any change that you wish to push to your site's code, would have to trigger a new deploy and upload those changes. While you can possibly use Netlify API to handle updating your site on-the-fly (like on a click of the button), this would be an overkill for the task you're trying to achieve, not to mention a bit difficult. The flow would look something like:
Fetch the list of files in the current deploy
Hash the new files that you wish to upload as SHA1
Create a new deploy with the list of previous files + new file that you wish to upload
Upload the new file
Wait a few seconds for the deploy to go live
Fetch the data from the updated site
Even if you manage to do all this, this would definitely be much slower, not to mention difficult to manage in case of concurrent read/writes.
Related
I have a netlify site built with just html, css, js.
I understand I can add a _redirect file to my project root that handles the routes that redirects all routes to a given page like so.
/* /index.html 200
If the user navigates to /brad it should redirect to /index.html.
My aim is to avoid creating a .Html file for every route.
However I want to be able to keep the path as a variable (brad) or pass the path to the page. I want to access the variable (brad) in the js in index.html .
My intention is to make a different action based on the path name. So /brad will work differently from /susan (where susan might be a user on the site).
An example would be if the user is not logged in log them in and send them to /brad (brad's profile page) after they log in or 404 page if no user brad exists. Here I need to keep track of which path the user originally accessed to know where to send them afterwards.
I know in server side code like php, laravel you can pass a redirect->with($variable) based on which route was accessed which can be accessed on the page that the user is redirected to.
Is it possible to pass the path of redirects on netlify as a variable to the js in the /index.html?
If no, would netlify be a bad option for sites that need to display dynamic routes such as www.example.com/profile/1 ? Should I go for a traditional server solution with a separate backend?
I use firebase for authentication and storing user data.
Following the comment from #ChalanaN, I created a 404.html page at the root of my project. Netlify displays this page for all non-existent routes. The page contains a script that gets the last parameter in the url and adds it as a query parameter on the link to the redirected page.
In 404.html
<script>
let givenPath = window.location.href.split('/').pop();//get the element after the last '/' in the url
window.location.href= '/index.html'+'?q='+givenPath;
</script>
In index.html
<script>
let redirectPath =window.location.href.split('=').pop();
</script>
Here the variable redirectPath will contain the original path the user accessed.
So www.example.com/brad.html will redirect to '...index.html?q=brad.html' with 'brad.html' as the final content in the redirectPath variable and now you have the redirect path in a js variable.
A warning: using 'index.html/?q=' will give a cannot get index.html/ 404 on your local machine when using live server so make sure there is no / before the page to be redirected if you intend to test locally.
As a sidenote, you could use window.location.pathname to get the path but that returns the path with the '/' attached to the path the user entered.
This question already has answers here:
How to disable View source and inspect element
(4 answers)
Closed 3 years ago.
I am having a display page where is shows all our reports like this,
On mouse over it shows the file url (where it is located in our server).
I want to protect this from users.
What is tried is this,
<li><a data-href="'.$value->uri.'">'.$value->filename.'</a></li>
and call script when click to download the file:
<script>
$("a").click(function(event){
var href = $(this).data("href");
window.location.href=href;
});
</script>
But still users can inspect and see url.
Is there any way to hide url from users?
Aside from the security implications of trying to enact a system like this (i.e. the level of security is hiding the href), as you've tagged PHP you could setup an endpoint in PHP that returns a 302 redirect for an href that redirects to the object on your server.
Use a DB to save the mapping of the 'public' href value that you see on mouseover and in the inspector, then when you hit this URI on your PHP server, look up the mapped resource and return it (if the user is authenticated).
First, never show server path in the URL.
Second, make these links href as /download_file.php?file_name=your_current_file_name.
Third is to have a script on server side, like download_file.php which gets the file name, searches in it's directory for the file and downloads them on the client browser.
Fourth is to hide this behind the authentication that only logged in users could see it.
Fifth, you could have a database table of each file against a user to make sure that other users don't get access to someone's file. As an alternative, you could also make folders based on user_id to make it easier to get the parent directory to search through, as you could get current logged user from session.
Always store uploaded files outside of your public_html so that they aren't accessible from the web, except from your server scripts.
Side note: Storing user ID in session is fine with regards to security. See here: php storing user id in session?
Note: Disabling inspect element is really not the right way to handle this.
I have the following files on my server:
var/www/html/web/
-- login.html
-- files/content.html
-- css/
-- js/
-- images/
My aim is when a valid user heads to my domain and/or opens login.html, it will redirect them to content.html. I can do this easily with JavaScript.
Next, I need to block access to content.html through any other method but that redirect. If a user tries to head straight to the reference of the file, it will not allow access; the same goes for all my other folders. Also If the content page access via new tab , then also it redirect to login page .
How can I go about doing this? Usage of .htaccess?
I'm about to vote to close this, but commenting here rather than in the comment box (due to space restrictions).
You have a "login.html" page but you don't want users to login before getting access to the content. This appears to be absurd. There might be a sensible reason for it, which might have something to do with the problem you are trying to solve. If that is the case, then knowing what it is would help in formulating a response.
Next, I need to block access to content.html through any other method but that redirect
This requires you to perform some sort of state management. You've not mentioned any capability serverside for this (PHP, Perl, python etc). You could drop a cookie in Javascript and redirect away based on the cooie, but this only proves that the user has previously visited the login.html not that they navigated to the page via the previous redirect. Further state is therefore maintained and asserted by the client which is insecure.
You've provided no explanation of what you are trying to achieve with this redirection, nor provided any context nor details of any constraints.
You can use document.referrer to see where the user came from. Then if a user didn't come from there you redirect him back or something like that.
You could also set a cookie on the login page and the content page checks for that.
Currently I'm working on a project where a user enters a lot of data constantly for a hour long window. I'm looking to have one user control all the data via some control panel and then have a link they can distribute to other users that will allow them to view that data without the ability to edit it.
Right now I'm doing some extremely weird methods. I have an XHR request on the control page that fires whenever a field is finished being edited. From there the data is sent to a php file that converts the data into a simple text file. Then the distributed link file will load that file one time and translate it into the necessary format.
Some potential problems I've run into are it seems odd that I'm sending starting as javascript data then going to a php file then to a text file then translating the data all the way back into javascript data again. Another problem I've come into is I'm not sure of a way to force users to reload the page when a field is edited in the control panel after the user has opened the view page.
Have I totally gone overboard here? What are some better concepts I could employ to accomplish this task?
If i understand what you want to do this is how i will do this:
First the data entry
if you have lot of fields you better use a form wizard, i don't have a particular one in mind right now but there is lot of them just search jQuery Form wizard
Here is an example:
http://i.stack.imgur.com/Luk2b.jpg
The concept of the form wizard is to guide user via multiple page and also validate the data. And click save when and the end.
Then save date in database.
Display content
All you need to do is to create a global separate page to display your content.
Let see something like: http://yourserver.com/view/{id}
where id is the identifier of the particular row in your database.
i'm not sure if i totally understand what u about to do. i'm trying to make your work description shorter here:
want to build a website that one person can edit a single page's content in 1 hour, and others can view the content change in that 1 hour.
if this is what u want to build, here's the module:
teacher: the one who can edit the page
student: the one who can only view the page
server: information center
teacher client edits page -> teacher client sends update data to server -> server saves data -> server sends update notice to student client -> student client receives update notice -> student fetches update data from server
to make this module work well, i suggest try socket instead of http reqeust, just like online games or IMs do.
well, try socket.io
BACKSTORY
I am building a module that extends a .NET web app that I did not develop. All I know is that if I create a "view.ascx" file, populate it with the appropriate vb .net html and javascript code and put that file in the right place, that some good stuff is going to happen. Im having issues though.
My Goal, enable a web based TWAIN scanning utility.(I'm using a scanner to get a picture of the sole of the foot of a patient.) The scanning plugin (DynamicWebTwain) has the ability to set some http form fields and call a post method to an action page (aspx) file. The action page should then use those fields to store the file and make write a record in SQL with a pointer to the uplaoaded file destination and associated that with the patient chart id. The uploaded file name, storage path etc are all composed of data that sits in variables in the application mentioned above.
ISSUES
The view.ascx file (which encodes the reading of the application variable instances, the plugin embedding and the JS triggers) is loaded one time when the application loads. Therefore, the patient specific information, captured in a form is not actually available unless I reload the page. This of course is because you cant specify the patient demographics before the application is opened.
As a result of item 1. I am unable to set form fields with meaningful information and as such cannot pass it to the actionpage.aspx and upload and save everything properly in the filesystem and DB in the first pass.
WORKFLOW SUMMARY
Patient enters, dr loads web app. at this time the variables pertaining to the Patient are empty. the control is not reloaded at any point and those variables remain unchanged (blank) in my module as the Dr. navigates through the app. Dr. puts in PT name and DOB and clicks next which goes to the Scanner form.
Scanner module has not refreshed variable data. Dr. Takes scan via plugin, triggers JS to set and drive scanner, is presented with a Save button, Save button sets form fields and calls the action page.
ATTEMPTED WORKAROUNDS
Point the action page to the ascx file, in other words call myself - FAIL - Would love a good explanation of why this is not OK.
Re-evaluate tha variables within the actionpage.aspx file. ( well to do that i tried using the same references in the headers as found in my view.ascx file
"<%# Control Language="vb" AutoEventWireup="false"
Inherits="DriveWorks.Live.Parts.Modules.LiveModuleControl" %>
<%# Import Namespace="DriveWorks.Live.Parts.Theme" %>"
And of course this did not fly - FAIL - If I could somehow talk to the application again from the actionpage.aspx file, i.e. call another ASCX page that would revaluate the variables and give me back the results, then that might solve my problems. Would love a good explanation on feasibility and approach with code samples.
Still green please be kind and Mind you the web app that I am building the module for is a black box to me..