Is there a way to use javascript or ajax to encrypt file uploads, if so can you give me an example or link to working example?
The answer is Yes, there is a way to use javascript or ajax to encrypt file uploads. You can use standard Web APIs that have built-in native support in browsers: Use the standard File API and WebCrypto API to get the file from your filesystem and actually encrypt it—along with the Indexed Database API (indexedDB) (if you want) to store the encrypted file on the client side in the browser. A good simple example with working code is at Upload a file, encrypt it, calculate the hash and store the results using indexedDB.
Short summary of how to do it
The first step is just the normal step of creating an input type=file element in your HTML, and binding a function to it for getting the file from your filesystem and doing something with it; e.g., use onsubmit="my_file_handler".
After that, inside your my_file_handler (or whatever name) function:
Use .files[…] from that to get the input file(s).
Define a function that takes a cryptographic key; within that function:
create a new FileReader object and use, e.g., .readAsArrayBuffer(…) to load the file
use crypto.subtle to create a new SubtleCrypto object
use .digest(…) with that SubtleCrypto object and then crypto.subtle.encrypt(…) to actually encrypt the file with that key
use indexedDB.open(…) and friends to open a connection to a DB and to put the encrypted file into it.
Use .importKey(…) to get the key and call your function in step #2 on it to process the input file with it and store it using indexedDB.
Use an HTTPS URL to upload the files and the browser will encrypt the data for transit automatically.
(This assumes you want to protect the file in transit and not that you are trying to protect the file from people with admin rights on the server)
Related
I am uploading files via fineuploader directly to Azure Blob Storage and I want to know if I can access file URI (on Azure Blob Storage) once file is uploaded?
I understand that I can call API where fineuploader provides all kinds of information which is described in http://docs.fineuploader.com/branch/fix_thumbnail-performance/endpoint_handlers/azure.html#optional-server-side-tasks but I wonder if there is some possibility to access this information (file uri etc) in javascript callback - without sending it to any API.
I'm not sure what your definition of "API" is. I assume you mean that you simply don't want to make extra calls to the server.
You can return any information needed by your client-side code your response to Fine Uploader's upload success POST. The parameters will be made available to your onComplete callback handler.
There are also a large number of API methods that may be of use, including one to retrieve the file name.
I resolved this one. I am using internal API of fineuploader - I didn't find it documented anywhere.
In complete event I am calling this:
var blobName = $(this).fineUploaderAzure("getBlobName", id);
Edit:
As Ray mentioned in comment below this feature is documented in official documentation
I made a game with javascript using this tutorial as a base: http://html5gamedev.samlancashire.com/making-a-simple-html5-canvas-game-part-3-drawing-images/
How do I get it to write the data from the item counter (var itemCounter = 50;) to a text file named savedata.txt? I googled it, but no helpful results came up. Can someone help me?
Technically, you can create a server with nodejs [which is built with javascript]. Details can be found here
Its not possible to store the data as a file on the client.
But you can use localstorage, websql, indexeddb or simply cookies for it.
Note that all of these storages have different properties in terms of lifetime.
You could also create a blob using the blobapi and then create a dataurl and request the user to save it, using drag and drop + fileapi to read the data, this approach however will make it easy for users to modify the data.
Writing a file is posible with the new FileWriter and FileSystem APIs.
More mature solutions (not using files) have already been mentioned
Javascript does not support working with files, for data storage several options are available:
cookies
Local Storage
Server side storage
I want to develop app for viewing newspaper/magazine using Titanium Appcelerator, and I have a problem how to store data on phone that user can't access it other way than by app ? what format should that data have (blob, pdf, plain text) ? should they be stored in db, or as a files ? Can You post your suggestions below, please ?
In Titanium you have several options to store data. First you should check the data you get as input. Is it JSON or PDF or plain text or whatever.
Following options are available:
- store data using integrated databases (SQLite) - this might be appropriate when your input data is plain text or json that can converted to text or something like that. You can also store blob data in database if you want.
- store data using file system: on both iOS and Android (not mobileweb i think) you can store data persistent on the file storage. This is useful if your input data is a binary file (pdf or similar).
However in both cases the user is able and not able to read data.
- iOS: The User will be able to read documents persisted on the filesystem and maybe also data located in the database
- Android: i think on android this depends on whether the device has root access or not and where you store that data (within app folders or in external / internal but free accessible storage)
In both cases it's not easy to access this data. Usually a common user won't do that. For a professional user reading this data should be easy. So how can you secure this data, so that the user is not able to read it?
Either you store the data encrypted in a database (database encryption is not available in titanium by default so you need to use a module or encrypt data on your own) or you store it encrypted (this is also up to you - there is no ready-to-use method) on the filesystem.
In my opinion the first solution is the better one. I would do the following:
- get data (from the server or elsewhere, data type doesn't matter)
- convert to base64 (useful & required for binary files but also for plain text)
- encrypt base64 with an encryption algorithm of your choice
- store in database
because this can require much memory you should provide the option to remove this data to save space.
I'm building an ASPX website that should allow the user to download a CSV/Excel file (including the 'Save To' dialog). The CSV contains encrypted data - the decryption key is available at user side and should be kept secret against the webservice.
So decryption actually should be performed within the browser, a javascript implementation (sjcl) has proofed to work fine.
But how can the incoming datastream during a file download be influenced? Something like a browser hosted proxy performing the javascript decryption?
#closure: thanks a lot! Ajax is no problem, and the idea
<a href='data:application/csv;base64,aGVsbG87d29ybGQNCg=='>click</a>
is really cool, but it has two problems: it seems not work with IE and it is not the right approach for really huge tables. The solution should be able to handle many thousands of records, therefore we need some sort of download stream encoder/decrypter.
Here are the steps to achieve this:
Instead of downloading the CSV directly to the client machine, fetch it via ajax
Once the data is received in via Ajax, parse the CSV via many available functions on internet. Let me know, if you need help on this. This function will convert the CSV to native Javascript Arrays.
Walk through the Array and covert the encrypted data to unencrypted data. Do it natively in the same Array.
Convert the array to CSV (Again there are functions in public domain)
Make a link (a element) and set the href to local data like data:text/csv;charset=utf-8, + encodeURIComponent(csv)
Present this link to the user and ask him to click on it to save the file locally.
How do I access a property file using javascript. Normally property file is a xml based file.
I java we access a property file like this:
Properties prop = new Properties();
fis = getClass().getResourceAsStream("props.xml");
if (fis != null) {
prop.loadFromXML(fis);
}
String dbUrl = prop.getProperty("dburl");
I want to do the same but using javascript. is there a possible way of doing it?.
JavaScript can't load files, as part of its security model. It can retrieve XML from the server using AJAX, but it can't read files from the client computer.
You can't load any files from the users computer with javascript in the browser.
If the file is from your own server you can load it, like any other ajax, with XMLHttpRequest.
Javascript doesn't use property files, as, either it has all the information it needs in the javascript files or in the html, or it will make an XMLHTTPRequest call to get the information from the server.
The server can look at the property file, and may use information passed in from the request, such as the header information, to know more about the client, to determine what information to pass back.
So, if you want to pass back some localized information, the server would have to get that from the browser request and then it could send back just what is needed for that transaction.
Javascript is different from java, so one limit is that javascript cannot read from the hard drive of the user, and since it is a webpage, the user wouldn't have the property file installed, it would still be on the server.
Javascript can only make requests to the address that that script came from, so there is a second sandbox rule that has to be met.
You may want to better understand javascript, then try to rephrase your question.
HTML5 now allows JavaScript to read local files, via the File API:
http://www.html5rocks.com/en/tutorials/file/dndfiles/