How to manipulate a local text file from an HTML page - javascript

I've generated an HTML file that sits on my local disk, and which I can access through my browser. The HTML file is basically a list of links to external websites. The HTML file is generated from a local text file, which is itself a list of links to the remote sites.
When I click on one of the links in the HTML document, as well the browser loading the relevant site (in a new tab), I want to remove the site from the list of sites in the local text file.
I've looked at Javascript, Flask (Python), and CherryPy (Python), but I'm not sure these are valid solutions.
Could someone advise on where I should look next? I'd prefer to do this with Python somehow - because it's what I'm familar with - but I'm open to anything.
Note that I'm running on a Linux box.

First, Javascript cannot modify the local filesystem from the context of a webpage. To allow that would be a massive security concern.
Any server-side web framework can do this, and Flask is a great one to use because it's so lightweight. The general steps you would want to take are:
When / is requested, load the list of links.
Change each link to point to /goto?line=<line_number>.
Display the list to the user.
Then when you click a link:
When /goto is requested, load the list of links.
Remove the line number from the list.
Save the list of links.
Return status code 302, with the real URL as the Location header.

There is many ways to do this
Here is the easiest 3
Use JavaScript
2 install wampserver or similar and use php o modify the file
3 don't use te browser to delete and instead use a bat file to open the browser and remove the link from the text file

Related

Is there a way to save and retrieve text from contenteditable data box in a specific file ? (All client side)

I'm making statistical reports for customers and I chose HTML solution as report template.
I have this issue where I want a user to be able to edit a text box of a html document and save it (as soon as he leave the area or when clicking save button) to annotate things like graphics for instance.
The content should be printed each time he opens back the .html file. Also, there are potentially multiple html pages inside the report (one editable box per sub html pages is enough)
Moreover, a big constraint here is that this html file is open locally and should be shared across users (I have to stick with this all-client side solution for now but I'm planning on doing it server side).
As you may have understood already I can't use localStorage solution as it is system/user dependant and data won't stick if people are sharing the report.
I'd rather go with a solution where it is possible to save it in a $UID.txt file for instance (one $UID for each sub pages people wants to annotate) and retrieve it so as long as the state of the editable content is saved at the same place in the report folder architecture, it will be opened as is by every other people when they get this edited report.
Thanks for your time !
A.
EDIT
I should have stipulated few things :
1- The report is composed of hundred of stand-alone html files. It is basic html and javascript components that are translated by a classic web browser without the need of an internet connexion or a localhost server.
2- Folder structure :
root_folder
|
|---- index.html (main page to access all sub pages)
|---- graphics
|---- graphic1.html
|---- graphic2.html
3- People need to share the report on their own and there is no user database. The only constraint is that after performing a modification on an editable content box, the text should be written somewhere in the folder structure (see 2) and retrieved automatically the next time some user (either the original editor or the next one on an other computer as long as the first editor shared the whole directory with its own edit) will open (or refresh) the html file.
I know that there are better solutions but I really have to stick with a stand-alone solution for now, hoping that there is a solution to this issue !
Thanks again for your time.
If there is no server-side component and you don't want to use the browser's (sandboxed) local storage (be that LocalStorage, IndexedDb or otherwise) then you are left with FileReader to read data and creating Blob URLs to download data.
The user experience would be something like this:
The user opens your (local) .html file
They are prompted to open the database (could be text file(s)) with a <input type="file">.
You use the FileReader api to load this file. Note: you can't use fetch or XMLHttpRequest to do this automatically.
When the user has finished entered their content, store it in a Blob object and then create a data:-link with createObjectURL. You could put that generated url in a <a href="..." download>Save</a> link.
As it would be up to your users to make sure they select the proper database file(s) and to save them under the right file name, this is not ideal. I would strongly recommend a (self-)hosted solution. That could deal with multiple concurrent users a whole lot better, too.
A server-side component doesn't have to be complex: If you start in a language you're comfortable with and use a SQLite database, you'll go very far in a less complex set-up than what you're describing.

Getting full page source information using PowerShell

So my ultimate problem is that I have a SharePoint list where each list item may have multiple image attachments. I am looking to scrape the list using PowerShell so that I can backup all the images.
I am able to access each item's page in the list because of similarities in the URL, but I am unable to extract the attachments. This is because the filename is non-determinant. Unfortunately, I don't seem to be able to parse the info with Invoke-WebRequest because it brings back the HTML of the page, which does not list the file attachments.
Instead, the file attachments can be viewed when you use the 'Inspect page source' button, and which I believe is because they are inside a JavaScript function.
So, my question is - Can I get each file in a page's attachment from the JavaScript function so that I can scrape the page? Also - am I interpreting this problem correctly, and are there any other ways to solve this problem?
Please note: I don't have access to SharePoint server dlls including Microsoft.Sharepoint.dll, so I can't use Classes from that dll (unless they might be easily imported without having to install the whole library).
Here is a photo of where the source changes. I believe this is where HTML ends and Javascript begins:
And the highlighted lines in this file shows the information that I am looking to parse from the page's source information so that I can form the URL to download the image attachments:

Download external website with nodejs (including resources)

I want to download a webpage, say http://www.stackoverflow.com with nodejs. Meaning that I have an offline copy of the static page. It has to download the resources (like styles, javascript files, images etc) and update the references to local ones.
In any case I want an offline page that once opened looks exactly like the real page. Just like what happens when I choose file->save in a web browser.
Basically I want to replicate the function of
wget --page-requisites
(Although this does not download css and images properly)
The background is that I want to execute Javascript on an external website. This is (rightly) not possible due to cross-domain-policies. To avoid this, I just want to download the website and statically host it myself, execute my Javascript analysis-code and then delete it.
I'm sort of spit-balling on a solution that could work for this:
A package like js dom could be used to grab all the page's script, link, img, etc's source URLs. You could then GET and save each of those resources to your local environment and replace their src attributes with a new URL that points to your local copy. Then you could stringify the resulting HTML and save that as well. Then just serve the containing directory statically in Node.
Maybe just running wget --page-requisites from within node is the easiest solution?
I'll be interested to know what the final solution to this is. Hopefully something I said helps.

Open local html file in current window with Javascript Bookmarklet

I'm trying to build a sample bookmarklet to grab current webpage source code and pass it to a validator. Validator is not a an online website, but a folder with bunch of javascript and html files. I'm trying to open file:///C:/Users/Electrifyings/Desktop/Validator/Main.html file with the help of javascript bookmarklet code and put the source code in the textarea in the newly opened window, but it is not working for some reasons that I'm not aware of.
Here is the sample code with algorithm:
javascript:(function(){var t = document.body.innerHTML;window.open('file:///C:/Users/RandomHero/Desktop/test.html',_self);document.getElementById("validator_textarea")=t;})()
Here are the steps:
Grab current web page source code in a variable.
Open locally stored HTML web page in current or new window or new tab (either way is fine with me, but no luck)
Put the source code from the variable into the validator textarea of the newly opened HTML file.
I have tried above code with a lot of variations, but got stuck on the part where it opens the new window. Either it's not opening the new window at all or it is opening blank window without loading the file.
Would love to get some help with this issue, thanks a lot.
Oh and btw,
Windows 7 x64, Tried IE, Firefox and Chrome. All latest and stable builds. I guess it's not a browser side issues, but something related to javascript code not opening the URI with file:/// protocol. Let me know if any more details are needed. :)
You wouldn't want a webpage you visit to be able to open up file://c:/Program Files/Quicken/YourSensitiveTaxInfo right? Because then if you make a mistake and go to a "bad" website (either a sleazy one or a good one that's been compromised by hackers), evil people on the intarweb would suddenly have access to your private info. That would suck.
Browser makers know this, and for that reason they put VERY strict limits to prevent Javascript code from accessing files on a user's local computer. This is what is getting in the way of your plan.
Solutions?
build the whole validator in to the bookmarklet (not likely to work unless it's really small)
put your validator code up on the web somewhere
write a plug-in (because the user has to choose to install a plug-in, they get much more freedom than webpages ... even though for Firefox, Chrome, etc. plug-ins are basically just Javascript)
* * Edit * *
Extra bonus solution, if you don't limit yourself to a purely-client-side implementation:
Have your bookmarklet add a normal (HTML) form to the page.
Also add an iframe to the page (it's ok if you hide it with CSS styling)
Set the form's target attribute to point to the iframe. This will make it so that, when the user submits the form and the server replies back to that submission, the server's reply will go to the (hidden) iframe, instead of replacing the page as it normally would.
Add a file input to your form - you won't be able to access the file within that input using Javascript, but that's ok because your server will be doing the accessing, not your bookmarklet.
Write a server-side script which takes the form submissions, reads the file that came with it, and then parrots that file back as the response. In other words, you'll have a URL that you can POST to, and when it sees a file in the POST's contents, it will respond back with the contents of that file.
Now that you've got all that the user can pick their validator file using the file input, upload it to your server, your server will respond back with the file it just got, and that file will appear as the contents of the iframe.
And now that you finally have the file that you worked so hard to get (inside your iframe) you can do $('#thatIframe').html() and viola, you have access to your file. You can save the current page's source and then replace the whole page with that uploaded file (and then pass the saved page source back to the new validator page), or you can do whatever else you want with the contents of the uploaded validator file.
Of course, if the file doesn't vary from computer to computer, you can make all of that much simpler by just having a server that sends the validator file back; this could be a pure Apache server with no logic whatsoever, as all it would have to do is serve a static file.
Either way though, if you go with this approach and your new file upload script is not on the same server as your starting webpage, you will have a new security problem: cross-domain script limitations. However, these limitations are much less strict than local file access ones, so there are ways to work around them (JSONP, cross-site policy files, etc.). There are already tons of great Stack Overflow posts explaining these techniques, so I won't bother repeating them here.
Hope that helps.

Is cross window-domain scripting possible?

Lets say for example i have an google search results page opened in a window or a tab in firefox.Is there a way i can retrieve the html code of that tab or window using javascript?
I suppose that the webpage html is saved temporarily somewhere in computer memory.
Can i load the webpage using memory saved address?
Is there a way for javascript to read html files saved in the same folder as the original?For example i have saved the webpage in a folder on my computer.If i create an html file inside the same folder does javascript consider the saved webpage as the same domain?
No, you most certainly can't do that unless you control both pages. This would be a huge security hole.
There is a custom search API which may help if you specifically want to do Google searches. It appears to have a JSONP implementation which should let you make a cross-domain request, but I haven't tried it out so I'm not sure how well it works.

Categories

Resources