How can I dynamically use images outside of my reactjs project? - reactjs

I am developing a client-only ReactJS application (only for local usage) where I need to save and load images by filepaths (URL and local file system).
The paths are stored in the local storage and images from URLs can be used. Anyway, local images cannot since ReactJS is using the project directory and I cannot escape it.
Is there the possibility to open files with absolute path from the local file system or can I/do I have to upload it in the project directory?

Are you running this through a browser? If so Javascript on browsers does not yet have the ability to access local file systems. I haven't tried this but you could run Node locally and use ExpressJs for client-server communication.
As stated here:
you'll need two pieces:
A browser piece, which does the UI with the user.
A Node piece, which runs on the user's machine (and thus can access the file system) and which the browser piece uses to do the actual file operations.
Probably the easiest way for the pieces to interact would be HTTP, which you can trivially support using ExpressJS.
So for instance, if the user wants to delete a file:
User clicks something to say "delete this file"
Browser JavaScript sends the command to the Node process over HTTP via ajax
Node process does the deletion and reports success/failure
Browser JavaScript displays the result

Related

Cefpython app with html/js files in local filesystem

I'm trying to make a hybrid python-js application with cefpython.
I would like to have:
JS and HTML files local to the cef python app (e.g. in './html', './js', etc)
Load one of the HTML files as the initial page
Avoid any CORS issues with files accessing each other (e.g. between directories)
The following seems to work to load the first page:
browser = cef.CreateBrowserSync(url='file:///html/index.html',
window_title="Rulr 2.0")
However, I then hit CORS issues.
Do I need to run a webserver also? Or is there an effective pattern for working with local files?
Try passing "disable-web-security" switch to cef.Initialize or set BrowserSettings.web_security_disabled.
Try also setting BrowserSettings.file_access_from_file_urls_allowed and BrowserSettings.universal_access_from_file_urls_allowed.
There are a few options in CEF for loading custom content and that can be used to load filesystem content without any security restrictions. There is a resource handler, a scheme handler and a resource manager. In CEF Python only resource handler is currently available. There is the wxpython-response.py example on README-Examples.md page.
Resource manager is a very easy API for loading various content, it is to be implemented in Issue #418 (PR is welcome):
https://github.com/cztomczak/cefpython/issues/418
For scheme handler see Issue #50:
https://github.com/cztomczak/cefpython/issues/50
Additionally there is also GetResourceResponseFilter in upstream CEF which is an easier option than resource handler, to be implemented via Issue #229:
https://github.com/cztomczak/cefpython/issues/229
You could also run an internal web server inside your app (easy to do with Python) and serve files that way. Upstream CEF also has a built-in web server functionality, however I don't think this will be exposed in cefpython, as it's already easy to set up web server in Python.

Use a remotely rendered page instead of /public/index.html

I wonder if its possible to insteady relying on the source code of the file stored in /public/index.html one can use a remotely generated page to be used as the template for the dev server of create-react-app.
The point is that I'd like to take a page that contains data that is generated by the server and have my react app running in there for development purpose.
As far as I understand, the webpack dev server loads the file from the HDD upon request, modifies the content and delivers it to the browser. So technically it shouldnt be a problem to retrieve the source from a remote URL instead of the local hard drive, right?

HTML5 Database Use without Server

Is it possible to use a local database file with html5 without using a server. I would like to create a small application that depends on information from a small database. I do not want to host a server just to pull information. Is it possible to create a database file and pull information from the local files ?
Depends on the following:
The type of application you want to build:
Normal website with some data being pulled from a local storage;
Special purpose hosted website / application with data generated by the user;
Special purpose local application with a dedicated platform (a particular browser) and with access to the browser's non-web API -- in order to access the browser's own persistent storage methods (file storage, SQLite etc.);
Special purpose local application with a dedicated environment -- in order to deploy the application with a local web server and database;
Available options:
Indexed DB
Web Storage
XML files used for storing data and XSLT stylesheets for translating the data into HTML;
Indexed DB and Web Storage ar available in some browsers but you need to make sure the targeted browsers have it. Their features aren't quite as complete and flexible as SQL RDBMSs but they may fit the bill if your application doesn't need all that flexibility.
XML files can contain the data you want to be shown to the user and they can be updated manually (not by the user) or dynamically (by a server script).
For dynamic updating the content of the XML is kept in JavaScript and manipulated / altered (using the XML DOM) and when the session is over the XML content is sent to the server to entirely replace the previous XML file. This works OK if the individual users have a file each and they never write to each other's files.
Reading local files:
Normal file access is prohibited (for security reasons) to all local (JavaScript) code, which means that "having" a file locally implies either downloading it from a known source (a server) or asking the user to offer access to a local file.
Asking the user to offer access to a local file which implies offering the user a "file input" -- like for uploads but without actually uploading the file.
After a file has been selected using FileAPI to read that file should be fairly simple.
This workflow would involve the user "giving" you the database on every page refresh -- but since it's a one page thing it would mean giving you the data on every session as long as your script does not refresh the page.
You can use localstorage but you can run a server from your own computer. You can use Wamp or Xampp. Which use Apache and mysql.
What i'm looking for is a little more robust than a cookie. I am making a web application for a friend that will be 1 page, and have a list of names on the page. The person wants to be able to add names to the list, however they do not want to use a web server. Just want the files locally on a computer so a folder called test-app , with index.html, and possibly a database file that can be stored in the web browser or a way to save information to the web browser for repeated use.

only logged in users can play audio from our server

We have made a silverlight application where users can preview audio files from their browser from the telerik radmediaplayer control.
The files are on a webserver and anyone who sniffs the trafic can download the file.
We would like to prevent non-logged-in users from accessing/downloading these files.
Besides providing the application with some sort of temporary valid url and implementing a custom httphandler... what are our options?
It's not too big of a problem if our customers can download the files, we just don't want the rest of the world to also have access.
Any ideas would be more than welcome!
[Update]
The only thing I can come up with is:
host the files in a non-public folder
if a user requests to prelisten a file, copy it to a public folder under a new name ([guid].mp3) and return it's url
every x minutes clean the public folder.
Don't let the web server serve up the files straight out of a directory. Put part of your application in front, and left one of your server-side scripts serve up these files. Keep the raw audio files out of the web root.
For instance, your client-side application would access files like so:
http://someserver/yourscript?audio_asset_id=12345
The code at yourscript would verify the session data, ensuring that a user is logged in, would then go figure out the real path to asset ID 12345, and echo its contents to the client. Don't forget to include the proper Content-Type header as well.
Once the accessing of these assets is under your control, you can implement whatever security measures you like. If your sessions area already pretty well safe-guarded, this should be fine. I would also recommend implementing sane quotas. If you get 100 requests on an asset using the same session ID from multiple IP addresses... something isn't right.

Changing permissions on a File from applicationDataDirectory in Titanium Mobile

I'm trying to send a file, as an attachment, via the phone's e-mail client using Titanium Mobile. I've run into a snag where the attachment is sent, but is received as a 0-byte file.
The problem is that the file created in data/data/package/app_appdata is -rw------
From glancing at the Android SDK, this is by design. The app's "private storage" is readable only by the owner of that folder, the running application.
I presume that the Android e-mail client can see that file, but cannot read it.
The full Android SDK mentions a MODE_WORLD_WRITABLE that allows you to keep using the applicationDataDirectory and give all apps permission to read/write that file. Does an equivalent exist in Titanium Mobile?
The other solution is to create a temp file, which unfortunately uses Titanium's own naming scheme (tiXXXXX.txt), or I could write to the "external storage" since it is public (which may not always be available, however.)
This is the call I'm using to get the current file, it can be read within my app just fine, but when I use the addAttachment call of an emailDialog it simply sends a 0 byte file to me.
var f = Ti.Filesystem.getFile(Ti.Filesystem.applicationDataDirectory, "generated_filename.txt")
Have you tried using tempDirectory instead. I'm of course assuming once the file is emailed you don't need to keep it as the applicationDataDirectory is fully backed up and usually used to store data the app retains.
http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.Filesystem.tempDirectory-property.html

Resources