Images from json data - javascript

I have following json data from a web api:
[{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/download (1).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/download (2).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/download.jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (1).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (2).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (3).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (4).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (5).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (6).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images (7).jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/images.jpg"},{"FileName":"D:\\StuckUpTask\\Insta\\Insta\\Images\\/island1.jpg"}]
Is it possible an angualar js code to call this json result and show the pictures as thumbnail?

No. The only data you have is about the file names in the machine that you got the JSON array from (maybe not even that), but to have access to those images, you would need to have the exact url to those images and also permission to view them.

Related

Why to use Blob at all if I can save file pathes in database and actual files in storage?

I know that blob is a data type for binary data as integer is a datatype for int. As they say, It's used to store files directly in database (we move our audio file into blob, and save that blob in database).
Question 1) why to store blob for audio if I can just put the audio in storage for example path /var/www/audio.mp3 and in database I store path_name /var/www/audio.mp3?
Question 2) which is better ? how netflix stores movies? just blobs or what?
Question 3) Curious if there're any cons or prons if you could just give me ideas so that I know when to use them .
Putting the blob in the database, rather than a file, allows you to grow to multiple servers with load balancing. If you put the data in files, you would have to replicate the files between the server. Most databases have built-in replication features, this isn't as easy for regular files.
Better to use external storage/cdn for serving such kind of large content.
How Netflix and our works? They upload content on external bucket i. e. S3 and write file name in db for identification. According to user file access frequency that file cache on CDN/edge location. User will get awesome experience while content server from their nearest edge location
With blob you can store all kinds of stuff.
Do you communicate with an API via SOAP or JSON and want to store it in the database? Use a blob. Want to log what a user filled into a form when it threw an exception? Store the entire post as a blob. You can save everything as is. It's handy for logging if you have different data formats. I know an API which expects some data via SOAP and some as JSON. To log the communication I use blob because the response may be in XML, JSON, a number (http code 203 for empty but accepted) or an exception as array.

How to cache an image from URL before displaying it

Basically, this app should contain a collection of objects in a view showing a representative image of each object (i.e. a movie should show its poster).
Talking about movies, I am trying to use the IMDB APIs in order to retrieve the metadata for a certain movie title, including its poster. However, hotlinking won't let me display the images once their URLs are obtained from the APIs (I keep getting the "GET [...] 403 Forbidden" error...).
Since I am using the JSONStore feature in order to cache the data, I would like to know if there is a possibility to store those images in JSONStore and then display them like a normal browser would do. I am trying to do all this sort of things from the front-end side, not the back-end one, using AngularJS, HTML5 and JavaScript.
Do you have any suggestions for this kind of problems?
Thank you.
Suggested solution: What you'd need to do is to encode the images to base64 and this way you could store the binary image as a string inside your JSONStore collection.
When you then need to display it you will need to base64 decode the string back into an image and display it in your HTML

How to get selective data from multiple json files?

Let suppose I have 5 json files in which data is stored.
Now I have 5 different logins(different users), and for each different login, seperate json data should be loaded. So, how can I implement this?
can I implement this without getJson() ??
I want to store it as 5 different js files with data as variables in it.
Any ideas?
I mean, I want to get variable from particular json file (same variable used in all json files)
of course you can.
As you mention, users should be logged in. So to each user can be attached specified attribute containing associated with him js file with data.
Or even simplier. JS file can be named as user login. So after login it can be loaded withot any troubles.

parse external json source to html

I need to get some data from a json file stored at another server than my own. I've received the url of the file but have to "anonymize" it below, the url is exactly as below but with a different domain.
http://api.somedomain.com/v1/26963723e61eae69cefd/companies/5565592010/related-articles.json?languages=nor&per_page=10&page=2
Now I want to render the data in that file into a list or table structure in my html file, preferably after the page has loaded. If jQuery can be used for this then that would be great otherwise regular javascript will do.
Unless someone can toss up a solution I'd be happy to take pointers on where to turn to learn about how this can be done.

How can I retrieve data from an external XML file and place it in an HTML file?

I am trying to retrieve data from an XML file that is not located on my site's server, and then use that data fro various things, such as charts. Here is one example: http://forecast.weather.gov/MapClick.php?lat=40.78158&lon=-73.96648&FcstType=dwml. This is an XML file with the weather data for central park. I want to retrieve the data that is in the <value>tag, which is in the <pressure> tag, so I can create a graph with barometric pressure. I would prefer to do this with JavaScript, but I don't think it's possible to do so when the file isn't on my server.
Note: I do not want a different solution to retrieve the pressure data from somewhere else, because I want to retrieve other pieces of data from other XML files as well.
There's an interesting article about using Yahoo! Pipes to transform Xml weather data to JSON and use the result in a web page without need for any server side stuff (PHP, curl, etc.).
EDIT
Being new to jQuery myself, I a had to dig a little more to find out that (almost) everything described in the first article can be condensed down to
$.getJSON("<your Yahoo pipes url here>&_callback=?", function (data) {
alert(data.value.items[0].data[0].parameters.wordedForecast.text[0]);
});
using jQuerys builtin JSONP.
Pitfall!
Beware that Yahoo expects the callback url param to be named _callback
Nice summary on Cross-domain communications with JSONP which helped a lot to come up with this answer.
If your javascript code is on a server (as opposed to a mobile device), have PHP code load the xml, escape it and insert it into the HTML page. Then you just have to grab that in your code and process it with DOMParser.
You could use curl to pull the data to your server and act on it from there.
curl -o data.txt "http://forecast.weather.gov/MapClick.php?lat=40.78158&lon=-73.96648&FcstType=dwml"
This will give you the information in a file called data.txt. You could then either parse it server side and then just give the bits of data needed, or make the whole file available to your client, since they are both now in the same domain.

Categories