How can I read a value from a webpage? - javascript

I ask now apologize for the issue that I will do, but already searched everywhere and found nothing relevant.
I need to read a data from a website, but not even managed to do.
The information is as follows:
And I need to read the numbers.
Did I could help please?
Thank you all.
If you need I clarify my doubts.

Very vague and unclear but it looks like json data so... how is this data retrieved? Is this a simple webpage loaded in a browser or the result from some ajax / rest request?
You could try using DOMDocument and then searching the DOM for the PRE tag and getting the contents that way.
If it is a json response from an ajax call then it is a trivial task. More info is required to get a sensible answer

Related

Display text value from Github Gist in Hugo site

I know I might be asking something quite simple but for the life of me I can't seem to get my head around this and I'm definitely overseeing something simple but I don't know what. Any help would be very appreciated.
I'm generating a static site using Hugo. On one of my pages, I want to create something like a progress bar, using a variable which I need to get from a file from a Github Gist.
Say this is the gist: https://gist.github.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b#file-thesis-words-txt
The file only has one number, that's it. What I'm asking is how to get that number from the gist and store it in hugo or at least just display it in some raw html. I want to mention that I'm not looking to use the provided embedded text, I'd rather just get the raw value. At the end of the day all I need is to read and display the number from the raw link here: https://gist.githubusercontent.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b/raw/8380782afede80d234209293d4c5033a890e44b6/thesis-words.txt
I've asked this question on the Hugo forum and that wasn't very helpful, instead of providing me with some guidance I got sent here. Here was my original question: https://discourse.gohugo.io/t/get-raw-content-from-github-gist-to-a-variable/38781
Any help would be greatly appreciated, I know there's something very obvious which I'm not seeing, please guide me to the right direction, this doesn't feel like it should be that complicated.
Best,
Bogdan
You could fetch this data and store it in Hugo as a data file but I don't recommend it.
Since Hugo is a static site generator, you would need to not only modify the data files in your repo every time the value changes, but re-build your site as well. Then you have to worry about running the script on a schedule. Meaning you can't be sure that the value is current the second someone visits your site. This is more headache than it's worth in my opinion.
The better route would be to write some client-side JavaScript that makes a call to the raw URL of the gist to get the content. This is Hugo-agnostic which is why I suspect you were pointed here.
From the Gists API docs:
If you need the full contents of the file, you can make a GET request to the URL specified by raw_url.
You can use something like the Fetch API for this or any other JS client. Simply make a GET request to the URL, parse the value from the response body, and write some JavaScript to insert the value in the DOM when someone makes a request to the page it's on.
#wjh18
Cheers! I didn't know about GET requests so I had to dig around for that a little bit but I managed to get it going with this:
<script>
fetch('https://gist.githubusercontent.com/bogdanbacila/c5a9683089c74d613ad17cdedc08f56b/raw').then(function(response) {
return response.json();
}).then(function(data) {
console.log(data);
}).catch(function() {
console.log("Booo");
});
</script>

How to allow output onto webpage from console log mqtt message

A few questions and I apologise if they seem unprofessional, I am a beginner programmer. But I would really appreciate any and all help you'd provide!
Currently, I have used an MQTT program to receive messages over websockets. I can view my message in the console.log but I would like to ask how can I convert it to the html output messages. is it by document.getElementById ? or is there a more better way to do that?
What is the benefit of using JSON for the messages?
What is the purpose of using variable.push(entry.anothervariable) is the push entry better and perhaps I should use an array to store the messages and then push them out?
Thank you!
Without context answering these questions are not really a good fit for Stackoverflow, but here are some answers.
Without the context of what frameworks you are using, yes finding an element with document.getElementById() and then updating it's content with .innerText or .innerHTML is probably the simiplest way forward
Sending messages encoded as JSON when working with JavaScript means that you don't need to worry about parsing any other encoding format, you can directly access fields using the native JavaScript Object Model.
This question is totally unanswerable with out any context for what you are actually working with. The .push() method is how you append an item to an existing array.

Using JSON file to load events to FullCalender. Will this work for multiple users?

Here is how I am getting event information from my database into FullCalender, using PHP:
Query database for event information.
Place that information into an array and make my formatting edits, add colors, whatever.
Use json_encode to put array into JSON format.
Write the file to my server as "results.json".
Then in my javascript I use this file to fill my Calendar object:
$('#calendar').fullCalendar({
events: 'results.json'
});
So that all works great.
Here is my concern:
What happens when I have multiple users?
Jim is going to query the database for his events.
Those events are going to be written to results.json.
At the same time, Sue may open the page and query the database for her events.
The code is going to overwrite results.json.
Who knows what events are going to show up on their calendar!
I see some suggestions about using socket.io, but there are other articles suggesting that people should be moving to use WebSockets. And I understand that these are supposed to help with real-time applications.
But I'm not following a chat session that is being updated real-time. I have many users that are accessing their own data. Does that mean that every user needs to have their own JSON file? That seems... yucky. Should this file be saved to their local device? That seems full of permission issues.
Any advice?
Many thanks to Roljhon and Archer, who pointed out that I'm asking the wrong question here.
The short answer to the question above is:
NO, you should not be saving a file to the server with data that is going to change and be different for each user. There is a better way.
The REAL question is, once I have my data in a PHP variable, how do I get it to JavaScript?
There is a very good explanation here: How to pass variables and data from PHP to JavaScript?
This explains how to use AJAX, or use the DOM in Javascript, or simply echo your PHP variable into a Javascript variable. (Did NOT know you could do that.)

How to load large JSON file into javascript

Firstly, thanks for taking time to view my post. I am working on a project with a few people, and we basically have a webpage, and once you log in, it displays all the data from a mysql database which has 6 tables, 3 of which have data in them. We figured out that in order for us to go about this, we need to transfer data by exporting the data into JSON file(s), then from there load the JSON files into java script so it can communicate with the web server. We were wondering what would be the best way to go about this. One way we found out is to reference the JSON ddata as variables and just list everything out, but several of our files have loads and loads of data. Would there be an easier approach?
This would be the first time we are doing something like this, so we are learning and appreciate your feedback!!
If you're using some kind of AJAX library, you can easily request the .json file from the browser.
For example with jQuery:
$.post("ourJSONFile.json", function( data ) {
..logic to display data..
});
NOTE - The comment about no PHP was not posted while I was writing this. Until I know why there can be no PHP, I'm just going to leave this answer here.
I think you're going at this in the wrong way. There is no need for JSON here, just query your database for the information.
The overview of what you need to do is (in PHP or the language you use to talk with your server) you need to
connect to the database
query database for information (query in your case, more or less means get the information)
do something with the returned information (such as echoing it in PHP so it will go to the user)
Now, it doesn't look like there is much effort place for getting this done, only planning. So, I'll just show you a few links to read up. (Which is also why people has devoted your question, Stackoverflow doesn't like asking question with no effort to research answers)
I'd use php.net for looking up methods, such as the mysqli_query method. This is very useful for learning small but important things about the method, like what it returns when an error occurs.
http://php.net/manual/en/mysqli.query.php
Taking a quick look through this guide, I think it should suffice. Besides syntax and such, some other important points are use MySQLI (when using PHP 5 or higher) and use prepared statements.
http://www.pontikis.net/blog/how-to-use-php-improved-mysqli-extension-and-why-you-should
The use of prepared statements is to protect your queries from injections. w3schools gives a good explanation about this # http://www.w3schools.com/sql/sql_injection.asp
MySQLI is MySQL Improved, it is more secured and supported. MySQL has been deprecated since PHP 5, and php.net pages on a MySql method will actually say this at the very top.
Finally, Andrew mentioned AJAX. AJAX is (for example) a way of doing things that would normally require reloading the page, without reloading the page. There is more to that, and I would recommand looking into it once you get use to the languages you are using.
Note, AJAX does not require libraries to use, it can be done with pure javascript. Libraries simply (as seen around) simplify AJAX a lot.

Single Item Array Read as Object in React

I'm hoping someone can help me bug fix an issue I'm having where an array that contains a single item is read as an object in json data. I'm using .mapto loop over the values like defined here: https://facebook.github.io/react/docs/multiple-components.html
The build I'm using is: https://github.com/newtriks/generator-react-webpack, so I'm not sure if this is a webpack issue, fetch issue (how I'm requesting the data), or something much more obvious. Any insight would be appreciated. Thanks.
I found where the error was. I was using YQL as a proxy service to get around CORS. Turns out the default response is “lossy”, where single element arrays are returned as an object.. had me scratching my head for a while trying to figure out where this was coming from. Solution was to add jsonCompat=new to the query string. Listed in the docs here: https://developer.yahoo.com/yql/guide/response.html#json-to-json-transformation

Categories

Resources