NodeJS Get Completely Rendered HTML Page - node.js

I want to get a html page content from a url using NodeJS after JavaScript is fully loaded and the page is completely rendered, or get the basic html then run all JavaScript files to achieve final content.
For example let's assume there is a website based on AngularJS, so the basic html is simple, but after loading all JavaScript codes in the page, page content is completely different. I want to get that final content on my server to find something in it. Any ideas?

After-Load is a NodeJS package that works like a charm :
var afterLoad=require('after-load');
then :
afterLoad('http://stackoverflow.com/questions/29366718',function(html){
console.log(html.indexOf('charm')>0);
//true
})

Maybe it's too late, but back in the day, PhantomJS solved my problem.

Related

ejs not rendering on website - only in source code

I don't know what the problem is, but when I render a route from an a dynamic get route ("/schools/:school") using res.render("school.ejs") the ejs isn't showing on my website. I actually looked in the source code and it worked, but for whatever reason the page isn't rendering it that way.
for example
res.render("school.ejs", {info: "hello})
my school.ejs is simply
this is the school info
<%= info %>
renders the following on the actual website
this is the school info
but in the source code it correctly shows
this is the school info
hello
(my server uses express) help much appreciated

instagram feed on website

I'm trying to display an Instagram feed on my website. I am not familiar with server side scripts. The explanations I have read go over my head.
I have managed to get an access key through Instagram but I don't know how to proceed.
I also tried the instructions from a video "How to implement an Instagram Feed in PHP without using the Instagram API"
For that, my php file works, displays the feed but I don't understand how to make it appear on my html page.
I'd be happy to make either method work.
In your HTML you should include a JavaScript 'script' element where you do something called an AJAX Request. The request will access the PHP file that produces the Instagram feed. ECHO the result from the PHP file and it will be returned into the DATA variable in the AJAX request. The request looks roughly like this:
$.ajax({
method: ‘POST or GET, most likely POST’,
url: ‘not always an actual url, this is the path to your PHP file’,
success: function(data) {
//php file returns into variable ‘data’
//display the feed within this function
}
});
The result from the PHP file should be echo’d back in JSON notation, if it isn’t, just add this to end of PHP the file:
$whatever = json_encode($your_result);
echo $whatever; //this is still the feed, just encoded in JSON
And if you need to decode it for some reason, just do
json_decode($variable_to_decode);
There are other parameters you can use in the AJAX request, like if for instance you need access to certain variables in your PHP file, that currently only exist in your HTML document.
this was solved by saving the html as php. i don't know why that is but it worked

Codeigniter Controller class login form : 404 page not found

Im trying to combine several tutorials about Codeigniter and bootstrap and understand per codes so i can integrate it in my project. What i am trying to do right now is create a login form using the two framework.
And i setup my View according to the turotial included in Codeigniter 'user_guide/tutorial/static_pages.html' which my landing page is named as 'home.php' is inside the folder 'pages' and header.php, and footer.php is inside the 'templates' folder. I created also a controller: Page.php.
I also use .htaccess to hide 'index.php'. Now i follow this tutorial how to create a login page:
http://learnjquerybootstrap.blogspot.com/2015/01/login-session-using-codeigniter-and-bootstrap.html?m=1
-the only difference is this since i use htaccess:
<?php echo form_open(clogin/index); ?>
But when I try to submit the page i receive a: 404 page not found.
My navbar links are working fine. I understand that the codeigniter works like this:
http://localhost/myfolder/index.php/class/function/
so when i submit my form the url that show up is:
http://localhost/myfolder/clogin/index
and gives me: 404 page not found.
Question:
What is wrong with it?
is there something wrong with the tutorial that i am using? i check other tutorials and the controller structure is just the same, like on this link:
http://www.kodingmadesimple.com/2014/08/how-to-create-login-form-codeigniter-mysql-twitter-bootstrap.html
do i need to include clogin.php in route.php?
or is it about the htaccess? my
uri_protocol
is configured as
'REQUEST_URI'
in config.php. i tried other options but still the same.
Don't need include to route.
I recommented ready auth library.
If you use DevTools in your browser maybe "Network" tab of devtools can help you to why you get 404 error.
i already firgured it out.The mistake was in the route.php, since i tried to combine two examples.. i realized that the wildcard route that i included from the Codeigniter user guide will not work with the Clogin.php.
Since it was set as
$route['(:any)']='pages/view/$1';
So the url works as
http://localhost/myfolder/pages/view/clogin
instead of
http://localhost/myfolder/clogin.
I removed it and now it is working.

How do I load phonegap/cordova with jade?

I am developing a Web Application using node.js, express and jade. I have the following jade template which I am seeing using a WebView in a Phonegap application:
doctype mobile
html
head
script(src="cordova-2.1.0.js")
script
var ready = function() {
alert(\'Ready\');
}
document.addEventListener("deviceready", ready);
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
h1= title
button(id='vibrateButton', onclick='navigator.notification.vibrate(2000);')Confirm
#services
- each service in services
div.service
a(href=service.link)!= service.name
div.desc= service.description
What this template will produce is a webpage with a list of items (a description and a link) which will be fetched from a mongo database. The page is served using node.js
Now, the cordova script is not loading because the alert ("Ready") is not being displayed. Also, if I hit the button the device won't vibrate and the console will display the following message:
Uncaught TypeError: Cannot call method 'vibrate' of undefined at http://xx.xxx.xx.x:3000/:5
How can I include the Phonegap script using jade? I have tried to load simple scripts with just an alert and it works, but in this case I don't know why it is not working.
Could anyone provide advise please? Thanks.
With recent changes to cordova, you should take a look into InAppBrowser api. That's the recommended way to deal with remote pages embedded in your application.
In the end, you'll probably have a single index.html on the application to make sure the cordova js api is loaded and everything is ok. Then you'll open an InAppBrowser targeting your remote page (remember to whitelist it on config.xml for a better experience!).
The dot after the script is missing. Read this:
"Often you might want large blocks of text within a tag. A good
example is with inline scripts or styles. To do this, just add a .
after the tag (with no preceding space)"
It's taken from the jade-lang reference.
Example:
script.
if (usingJade)
console.log('you are awesome')
else
console.log('use jade')
Will render:
<script>
if (usingJade)
console.log('you are awesome')
else
console.log('use jade')
</script>
these will never work.
the html pages needs to be on the client side( app side ) not in the server side(node).
Example. In a android phonegap proyect on the assets\www folder.
i dont know for wat SO is your app, but
App client side: views, phonegap, jquery .... and all the stuff to request the data to the node server.
Server side: dbStuff, and all the stuff to retrieve the data to the app requests.
hope it helps.

Google Chrome Extension Adding iframe from source

I'm trying to load myframe.html inside an iframe and attach that iframe to the DOM of the current page. Is this possible, if myframe.html is part of my extension source?
I was thinking something like
var iframe = document.createElement("iframe");
iframe.setAttribute("src", "myframe.html"); //what would be my path here, if this were possible?
document.body.appendChild(iframe);
It should be possible, use a content script to inject javascript into the page and then use the chrome.extension.getURL() method to get the correct URL to your file hosted inside your extension

Resources