Preview an uploaded file that is stored in database - javascript

I have a database with text files, images, etc. Now I want to preview them in another process(not part of the upload page or proceess). What tool could/would I use for this, and/or how?
In my research I have found a list of libraries, but I cant see how the libraries can be used to open/preview the file directly from the database(with out downloading the file).
I am working on a web application using pyramid(python).
In my research, I found:
shelve
webbrowser
In the above mentioned libs, as far as I can understand, the file has to be local, i.e. on the computer or device you are using or is there a way to use these libs?.
I have also looked at possible JavaScript or jQuery packages to do this, though the only packages I can find is to deal with uploading.
I have code to download the file:
#view_config(name="get_compliance_document", permission="compliance_admin")
def compliance_document(self, rid=None, filename=None):
doc_id = self.request.subpath[0]
if doc_id and ComplianceDocument.by_id(doc_id):
compliance_file_id = ComplianceDocument.by_id(
doc_id).document_file_id
compliance_file = Files.by_id(compliance_file_id)
f = StringIO.StringIO(compliance_file.data)
return Response(
content_type=str(compliance_file.type),
content_disposition="attachment; filename=" +
str(compliance_file.name),
content_length=compliance_file.size,
app_iter=FileIter(f, compliance_file.size)
)
raise HTTPNotFound()
Is there perhaps a way I can use Response to preview the file?
All suggestions welcome.

Related

How to convert editable PDF to non-editable PDF in PHP/NodeJS?

Problem
I would like to know is there any PHP/NodeJS API available to convert editable PDF to non-editable PDF online. We have a client application where we need a scenario where the user downloads the PDF should not able to modify it thought any software (eg. Foxit reader, Adobe)
Basically, we are using PDF-LIB right now and it seems there is no solution for the non-editable pdf API to set access privileges, I have search a lot but does not found any API for that, Am not using the pdf-flatten because we want everything selectable, Appreciate your help.
List of libraries tried and fail to achieve the results
bpampuch/pdfmake issue can't load an existing pdf
PDF-LIB issue can't support permissions
nrhirani/node-qpdf issue File restrictions not working properly
I think flattening the PDF might help you to make it un-editable in case your target is
Just the form fields then you might use this from the PDF-LIB github repo
The entire PDF then, see if pdf-flatten package helps for Node.js
After a lot of research work and tried multiple libraries in PHP/Node. I don't found any library that is mature enough to proceed with that, so I decided to make an API that will build in different technology C# and Java
Solution
we post the PDF URL through API, the API download that file, and apply for multiple permission according to the dataset.
Library
the library we choose is ASPOSE
// These can be true/false
config.IsPrint = true;
// Document is allowed to be changed.
config.IsModify = false;
// Annotation is allowed.
config.IsAnnot = true;
// Form filling is allowed.
config.IsFillForm = true;
// Content extraction is allowed.
config.IsExtract = true;

Javascript to read Text File to Array without a Webserver or external libraries local on Windows PC

I have an HTML file with JavaScript that I am running without any Webserver/host so I am just opening the file in a browser local to my windows PC. In that HTML file I would like to be able to read a text file in the same folder as the html file. That file will contain data in rows and columns separated with tabs. i.e
1 a
2 b
3 c
I want to keep this as simple as possible so all I have to do is share the HTML and Text file to others so the can open it up local to their computer without any webserver/host and without having to also copy of external libraries like node.js or jquery.
I have searched and tested everything I can find but either I need to reference an external library or I have to run it in a webserver or I need to click a button to load the file through the browser, none of what I want.
Does native JavaScript support the function to read a text file and save it to an array? If so, any code direction would be great.
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest
XMLHttpRequest() exists in native JavaScript, I think it will help you.
You also can send a request to the file. Or use library: axios.js because when you use XMLHttpRequest() you lose many time to write code which just get content from file, with axios I got file content with one line: `axios.get('file.txt').then(result => console.log(result.data));
To connect Axios: <script src="https://unpkg.com/axios#0.18.0/dist/axios.min.js"></script>
You can read official documentation about axios.js and XMLHttpRequest() in the net.

Cordova - Saving/ Downloading a backup JSON file that is dynamically generated

I am building an HTML5 phonegap application. This app exports data so that the user can backup and restore any time. I'm doing this exporting with the following javascript code:
var dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(this.data, null, "\t"));
var dlAnchorElem = document.createElement('a');
dlAnchorElem.setAttribute("href", dataStr);
dlAnchorElem.setAttribute("download", "data.json");
document.body.appendChild(dlAnchorElem);
dlAnchorElem.click();
This generates an anchor tag with an encoded file and clicks so it downloads. Works great on browser, but does nothing in a compiled Cordova application.
After doing some research, I found that the default solution would be to use a download plugin for Cordova, specifically this one: https://github.com/apache/cordova-plugin-file-transfer
I read the documentation, but it does not seem to take an encoded file as parameter, but an encoded URL for download. Also, it takes the save path on the phone, which I prefer would just default to the download folder.
My question is: What is the best way to achieve this, considering I'm dynamically generating the JSON backup file. Is there perhaps an AndroidManifest directive that allows for file downloads?
After some research and trying many different hacks, I came to the conclusion that it's currently not allowed natively with cordova or with the available plugins. My solution was to, instead of writing to the filesystem, use the web share api to let the user export the way he finds best (including file, if he chooses dropbox, onedrive or google drive).

Reading local XML file with javascript

I am new to HTML/Javascript, as well as coding in general so bear with me :). I am trying to create a "Spot the Difference" game in html5 using javascript. Everything is local (on my machine). I have two pictures, of the same size, one with differences. To generate data about the clickable fields, I have a java program that reads both of the images and outputs all of the positions in which pixels are different into a XML file. My plan was to then use this XML file with my javascript to define where the user could click. However, it appears (correct me if I'm wrong) that javascript cannot read local XML files for security reasons. I do not want to use an ActiveXObject because I plan on putting this onto mobile devices via phone gap or a webkit object. Does anyone have a better approach to this problem, or perhaps a way to read local XML files via javascript? Any help would be greatly appreciated, thanks.
If you are planning to put this into a smart phones (iOS and Android) and read local files, I have done similar things with JSON (yes, please don't use XML).
Convert your output to JSON
Put this as part of your application package. For example, in Android, I put it as part of the .apk in /appFiles/json
Create a custom content provider that would read the local file. I create mine as content:// but you create whatever scheme you want. You could leverage android.content.ContentProvider in order to achieve custom URL Scheme. iOS has its own way to create custom scheme as well. The implementation simply read your local storage and give the content
To read it from Javascript, I simply call ajax with the custom scheme to get the json file. For example content://myfile/theFile.json simply redirect me to particular directory in local storage with /myfile/theFile.json appended to it
Below is the sample to override openFile() in the ContentProvider
public ParcelFileDescriptor openFile (Uri uri, String mode) {
try {
Context c = getContext();
File cacheDir = c.getCacheDir();
String uriString = uri.toString();
String htmlFile = uriString.replaceAll(CUSTOM_CONTENT_URI, "");
// Translate the uri into pointer in the cache
File htmlResource = new File(cacheDir.toString() + File.separator + htmlFile);
File parentDir = htmlResource.getParentFile();
if(!parentDir.exists()) {
parentDir.mkdirs();
}
// get the file from one of the resources within the local storage
InputStream in = WebViewContentProvider.class.getResourceAsStream(htmlFile);
// copy the local storage to a cache file
copy(in, new FileOutputStream(htmlResource));
return ParcelFileDescriptor.open(htmlResource, ParcelFileDescriptor.MODE_READ_WRITE);
} catch(Exception e) {
throw new RuntimeException(e);
}
}
I hope it helps
I would suggest modifying your java program to output a JSON formatted file instead of XML. JSON is native to JavaScript and will be much simpler for you to load.
As for actually loading the data, i'm not sure what the best option is as you say you want to evenutally run this on a mobile device. If you were just making a normal website you could setup a web server using either Apache or IIS depending on your OS and put the files in the document root. Once you've done that you can load the JSON file via Ajax, which can easily be googled for.
Not sure if this helps any.
Since this is a local file, you can do this with jQuery
$.ajax({
type: "GET",
url: "your.xml",
dataType: "xml",
success: function(xml){
///do your thing
}
});
http://api.jquery.com/jQuery.ajax/

Drupal Filefield won't upload javascript files?

I've got a site where individual pages might require some javascript or CSS files hooked into their heads. I'm trying to keep everything client side when it comes to managing this process, rather than getting on the FTP and sorting everything out in the code so I need to be able to upload css and js files.
I've got CCK filefield up and running, and it works with css files, but it refuses to upload .js files. It instead seems to view every .js as ".js.txt" and then the file appears on the server as thisismyfile.js.txt
Not ideal...
Does anyone know how to work around this. Is it a mime type problem with Drupal or the server, or is Drupal set up to avoid script uploads and n00b hack attacks.
Once the files are uploaded I intend to use PHP mode on the page or node to call drupal_add_css and drupal_add_js.
Looking at the field_file_save_file() function in field_file.inc from filefield module, you can find the following snippet
// Rename potentially executable files, to help prevent exploits.
if (preg_match('/\.(php|pl|py|cgi|asp|js)$/i', $file->filename) && (substr($file->filename, -4) != '.txt')) {
$file->filemime = 'text/plain';
$file->filepath .= '.txt';
$file->filename .= '.txt';
}
So yes, it's a 'security thing', as Jeremy guessed.
You could patch that RegEx for an immediate 'fix', but that would remove this otherwise useful security check completely for all filefields used on the site.
So a more specific workaround might be a better approach. Since you want to add the files via drupal_add_js() calls from code anyways, you might as well do the renaming there, adding some kind of verification to make sure you can 'trust' the file (e.g. who uploaded it, whatever).
Edit: Concerning options to rename (and alternatives) when calling drupal_add_js():
For renaming the file, look into the file_move() function. A problem with this would be that it won't update the corresponding entry in the files table, so you would have to do that also, if the move operation succeeded. (The filefield just stores the 'fid' of the corresponding entry in the files table, so you'd need to find it there by 'fid' and change the 'filename', 'filepath' and 'filemime' entries according to your rename/move)
Alternatively, you could just load the content of the *.js.txt file and add that string with the 'inline' option of drupal_add_js(). This would be less 'elegant' and could be a performance hit, but if those are not important criteria in your specific case, it is less trouble.
Yet another option would be just passing the *.js.txt file as is to drupal_add_js(), ignoring the 'wrong' extension. A short local test showed that this works (at least in firefox). This might be the 'least effort' solution, but would need some additional testing concerning different browser behavior concerning usage of 'misnamed' js files.
Allowing Drupal to upload javascript files would be a security risk, which is also why it doesn't allow you to do it, but instead appends the .txt extension. The reason is that js files are executable along with php, pl, py, cgi, asp. So if Drupal could upload those files to the server, it would be possible for evil doers to upload a file and run it doing all kinds of nasty things on your server, basically anything is possible. Best thing would be to find a different way of uploading files which are secure.
I had a similar need, and found a way to get around the security by first changing the 'allow_insecure_uploads' variable value by running this line of code in your hook_install:
variable_set('allow_insecure_uploads', 1);
Then in a module add this function
/**
* Implementation of FileField's hook_file_insert().
*/
function MODULE_NAME_file_insert(&$file) {
//look for files with the extenstion .js.txt and rename them to just .js
if(substr($file->filename, -7) == '.js.txt'){
$file_path = $file->filepath;
$new_file_path = substr($file_path, 0, strlen($file_path)-4);
file_move($file_path, $new_file_path);
$file->filepath = $file_path;
$file->filename = substr($file->filename, 0, strlen($file->filename)-4);
$file->filemime = file_get_mimetype($file->filename);
$file->destination = $file->filepath;
$file->status = FILE_STATUS_TEMPORARY;
drupal_write_record('files', $file);
}
What this does is in the hook_insert call it checks if a file has the extension ".js.txt". If it does it copies it to a new location and renames it. This is after the security check so its ok. I don't think you need to worry about the cache clear deleting your js files as long as you don't put them in the files/js directory. Create your own directory for you module and you should be ok.
I faced this situation when I wanted to allow .js file to be upload as is (without .txt and with 'application/javascript' mimetype) for a specific field. Also, I didn't wanted to alter Drupal core... of course.
So I needed to create a module implementing hook_file_presave(). This also work for Multiupload File Widget, since its hook is on file_save().
Note that you would have to replace MYMODULE_NAME and MYFIELD_NAME by your own values.
function MYMODULE_NAME_file_presave($file) {
// Bypass secure file extension for .js for field_additional_js field only
if((isset($file->source) && strpos($file->source, "MYFIELD_NAME") !== FALSE) && substr($file->filename, strlen($file->filename) - 7) == ".js.txt") {
// Define new uri and save previous
$original_uri = $file->uri;
$new_uri = substr($file->destination, null, -4);
// Alter file object
$file->filemime = 'application/javascript';
$file->filename = substr($file->filename, null, -4);
$file->destination = file_destination($new_uri, FILE_EXISTS_RENAME);
$file->uri = $file->destination;
// Move fil (to remove .txt)
file_unmanaged_move($original_uri, $file->destination);
// Display message that says that
drupal_set_message(t('Security bypassed for .js for this specific field (%f).', array('%f' => $file->filename)));
}
}
Drupal also "munges" javascript files. To prevent Drupal from automatically adding underscores to the filename there is a hidden variable that is checked before the filename is "munged".
Setting the variable to 1 solves the issue for me (along with altering the REGEX in includes/file.inc).
I hate hacking core, but this seems like a poor design to me. Javascript files are not server side scripts like php, py, pl, cgi, and asp.
You can use the allowed file extensions settings to prevent php and other server side scripts from being uploaded.
eg:
variable_set('allow_insecure_uploads', 1);
See:
http://api.drupal.org/api/function/file_munge_filename/6
So uploading .js files to the files directory is pretty much impossible.
Even if you manage to get .js files uploaded cleanly, these files will get deleted when the cache is cleared.
Any js files that live inside the files directory will be deleted whenever the drupal_clear_js_cache() function is executed.
http://api.drupal.org/api/function/drupal_clear_js_cache/6
So Drupal sees .js files living in the file uploads directory as temporary.
Now I understand why they are appending ".txt", it is to prevent them from being removed when the cache is cleared.
So as a compromise I guess I will just be uploading .js files manually (via FTP) to the /misc folder. :(

Categories

Resources