How to send large data from native Java to JavaScript? - javascript

I am developing an Android app, I have a large JSON string around 5 MB in the Java native code. I need to send this string from Java code to JavaScript (JS files are in assets folder). When I run the application, it hangs.
public String readFileDataofIamge()
{
StringBuilder text = new StringBuilder();
String FILE_NAME = "ImageDataFile.txt";
try {
BufferedReader reader = new BufferedReader(new InputStreamReader(openFileInput(FILE_NAME)));
while ((line=reader.readLine())!=null) {
text.append(line.toString());}
reader.close();
}
catch (Exception e) {
}
return text.toString();
}
#JavascriptInterface
public String readImageData()
{
return readFileDataofIamge();
}
JS Code:
function getDatafromFile() {
var imageData=Android.readImageData();
}
If I return some small string value like hello world, I get the value in JavaScript code.
So is this possible to send this large data from native code to JavaScript code? If not possible is there any other approach to send large data from native code to JS Code?
Condition given: There is no internet connection, so I cannot make any HTTP or network call.
============================================================================
Application overview:
I have an Android app, in which I'm using WebView. all web related files (js and HTML) are inside the assets folder. On first launch I need to get all the data from the server. (I have internet connection at the very first time of app launch) Data is very large, it's around 5 MB, but it may very up to 50 MB. I need to store this data somewhere. so that If I relaunch the app anytime without the internet connection, the app should have this data and it should work in offline mode.
So for this requirement, I have tried to write this data (around 20 MB) into internal storage file and trying to read this file and sending data to JavaScript code. But it's not working.
I have thought to use SQLite DB instead of storing in File, But I think again there will be the same problem while sending data from native code to JS code.
So could you guys please suggest some better approach.

Your problem won't get solved if you store the data in a database unless you won't need the whole file at once.
If the Website uses REST or similar and you have access to the code you could hook the requests and send them over to the Java / Kotlin part of your App. Otherwise you could use WebViews interceptRequest.
Once you are able to get the requests you can return the required data from your database. Imagine it like representing the backend for the website.
Example:
Website requires all users via GET users/all. You intercept this request via a hook which calls a Java method and then returns the result OR via interceptRequest. Either way you will have your local database on which you run a query like (pseudocode): Select * from USER. Then return the result.
Since you are dealing with JSON you could use a NOSQL database like CouchbaseLite which directly stores the JSON. Disadvantage: if you need to modify the data you will have to convert it to a POJO and back to JSON once you return it / store it again. Or use a SQLite database. For this you would have to convert the JSON you download to POJOs and then store them.
It would be great if the backend (from where you get your JSON) allows you to get different model types and not everything at once (otherwise you might run into memory issues). You could use Retrofit for networking and Moshi or Gson for your conversion to POJOs.
If there are no REST requests or similar and you need the whole file at once. Honestly I'd say there is no way of handling this in pleasent way.

Related

Error: 413 “Request Entity Too Large” Html + MVC WCF service

Basically, I created one page into HTML then i want to send two files XML & SVG. Both files are converted to text and then send to the WCF service in the MVC project. but it gives "Error: 413 “Request Entity Too Large”. I tried a small file & its works. but more than 200kb is not working well.
i tried to convert stream, but I had no luck. so I decided to convert it into string & pass it.
My HTML Page -
My WCF code -
also, i checked online solution for that but its already done.
ERROR -
If anyone knows, how to convert string to Stream in javascript, then tell me. I am able to accept stream value.
You can set the Maximum limit for receiving files in WCF like this:
WebServiceHost webServiceHost = new WebServiceHost(typeof(UploadService), uri);
WebHttpBinding binding = new WebHttpBinding();
binding.MaxReceivedMessageSize = Int32.MaxValue;
webServiceHost.AddServiceEndpoint(typeof(IUploadService), binding, "WebServiceHost");
webServiceHost.Open();
And you can try setting the upload size limit in HTML web.config.
I found the solution after spending 1-2 days. look into this url
https://cmatskas.com/upload-files-in-asp-net-mvc-with-javascript-and-c/

Streaming a file from URL in smaller chunks from a controller back to view for client to download

I am looking to stream a file in chunks from a URL to avoid memory issues(I cannot download the file locally at all and I cannot pass the URL to the client). My main issue that I cannot get passed is returning it to the view for and it starting a download for the user.
js
async downloadAttach(ID: any) {
window.open(await ApiFunc.post('Ticket', 'Download', CommID));// my own API call fucntion that works.
}
This code calls to the API in the C# Controller when a button is clicked. This API works for functions that I currently have in place.
Controller
[Route("api/Ticket/Download")]
[HttpPost]
public async Task<//Streamed file> Download([FromBody]string uri)
{
//Load file into stream in chunks recursively, to pass back to view
}
This is the controller that takes the URI supplied from the view section and loads in chunks back to the client.
What is the best practice around this?( I am looking to chunk it out already to avoid memory issues). I have also seen uses of HttpWebRequest but I'm not exactly sure how it works out returning to the view.
HttpWebRequest
Example from: Download/Stream file from URL - asp.net
This is the example I have been looking over that splits it up into small chunks but Im unsure how to get it to return through to the view and download. I have coded it up and made the proper modifications to fit with the packages Im using but onclick nothing happens.

How to push data to external JSON file (Using jQuery)?

I want to push an data to array in external local JSON file using jQuery.
So any ideas?
I have tried this:
$.getJSON('test.json', function(data) {
data.push('Something');
});
And it wont be pushed into local JSON file
You can do this in JavaScript with node.js (or a multitude of other languages/platforms) but not with a browser & jQuery.
Here's how to read and write a json file in node.js
On the other hand, users could upload a JSON file to your server, where you modify the structure and send them a modified JSON file back as a download.
Is not possible to write files using Javascript (can cause security problems through xss, csrf ..)
No, JavaScript doesn't have access to writing files as this would be a huge
security risk to say the least. If you wanted to get/store information server-
side, though, you can certainly make an Ajax call to a PHP/ASP/Python/etc.
script that can then get/store the data in the server. If you meant store data
on the client machine, this is impossible with JavaScript alone. I suspect
Flash/Java may be able to, but I am not sure.
If you are only trying to store a small amount of information for an
unreliable
period of time regarding a specific user, I think you want cookies. I am not
sure from your question what you are trying to accomplish, though.
Read/write to file using jQuery
You cannot access the files in a local client's machine. May be for development setup you can do it. But before you need to restart the browser with file-access flag set.
You can see my answer here that describes the opening browser setup with the flag set.
Then, you can use the following code to read the data.
var data = [];
var url = "/Users/Vignesh/Desktop/test.json";
var req = new XMLHttpRequest();
req.open("GET",url,true);
req.onreadystatechange=function(){
if(req.readyState === 4)
{
data = JSON.parse(req.responseText);
}
};
req.send();
To write into the file you may look into this. (Not sure it is working or not)

How to implement Play2 API server returning File via Ajax?

I am using Scala Play2 framework and trying to convert SVG String data to other file types such as PDF,PNG,JPEG and send it to Client as a file.
What I want to achieve is that
client send Data via Ajax(POST with really huge JSON)
server generates a file from the JSON
server returns the file to the client.
But It seems that It's hardly possible that sending a file and let clients save it as a static file, So I am planning to make new static files on clients request and returns its access url to client side and open it via Javascript. and after clients finish the downloading, delete the file in a server though,In this approach, I have to
def generateFile = {
...
...
outputStream.flush() // save the file to a disk
}
and
Ok.sendFile(new File("foo.pdf"))
I need to write and read file to a storage disk. and I do not think this is a efficient way.
Is there any better way to achieve what I want?
Thank you in advance.
Why do you think this is not efficient enough?
I've seen a similar approach in a project:
Images are converted and stored in an arbitrary tmp directory using a special naming scheme
A dedicated server resource streams images to the client
A system cronjob triggered every 5 minutes deletes images older than 5 minutes from the tmp directory
The difference was that the image data (in your case the SVG string) was not sent by the client but was stored in a database.
Maybe you could skip the step of writing images to disk if you're conversion library is able to generate images in memory.

knockout.js external model js file

I have an MVC.NET app which using Knockout.js (+ knockout.mapping) to deal with some cascading dropdowns. The data for these comes from a WebAPI call to an external service. As it happens this service requires an authentication token which expires after 2 hours, so I have the MVC app put the data from the service in a System.Web.Caching.Cache and return it from there unless the token has expired where it will grab it again from the service.
This is working fine.
However when I need to get this to the View, I am currently using the following method, which is to have a property of the ViewModel that I assign the service/Cache data to and then do this in the view:
var model = new ViewModel(#Html.Raw(Json.Encode(Model.ReferenceData)))
ko.applyBindings(model);
where Model.ReferenceData is the data from the service.
again this is working fine, but... the thing is with this, that the page then has all that Json data dumped in it on each request.
I would like to use an external JS file for the ReferenceData as then at least it can be cached by the browser and lessen the weight of the page on future requests.
However, I imagine that the overhead of generating a JS file is not that small, along with – what I really need is it to generate a link to that file that changes in much the same way that the built in MVC bundling of js files works – generating a link with a querystring.
My question is: is there an easy way of doing this?
For sure I can, when the cache is filled that first time, generate a js file and reference that from the View, but as I say getting that to change its link each time it is refreshed – or at least working out whether the data in it has changed and updating it only then is where the problem lies.
Any insight to this would be of great help
Thanks
Nat
Version the JS file (you can keep a GUID in the file it-self).
In Application_Start() get this version ID to a static variable.
In your controller pass this static variable data to ViewBag.
Ref your script with this ID
When you regenerate the file, update the version in file as well as your static variable. Next request from the client get the new version with new key.
Now if you want to update clients on the new version you have to use bi-directional protocol like web sockets or long-polling.

Categories