How can I display HTML file using nodeJS? - javascript

I am trying to display sample.html in an iframe inside index.html, I want to display index.html using NodeJs.
When I displayed the index.html I can see an empty frame. But when I open that index locally on a browser by double-clicking it works perfectly. What should I do to solve this?
Anyone, please help.

For that, I have to use express.
Before using any file, We need to use express.static to tell the node to use the files.
var express = require('express');<br>
var app = express();<br>
app.use(express.static(__dirname + "/directory_where_html_stored"));

Related

JavaScript path doesn't load on Live Server extension (VS Code)

HTML and CSS files are working perfectly on my live server. But every time I lead to a .js script it will not be shown on my live server. If I try to load the .js file directly through the URL it shows "Cannot GET /line.js". I already tried out everything I've found on the internet but it's still not working. Here are the points I checked/did:
Installed Code Runner
Installed Node.js = node.js system path done
Settings = Live Server Config = specified browser
"liveServer.settings.CustomBrowser": "chrome" on JSON settings
.js file is in a separate folder and accessed via <script src="line.js"></script> on index.html
Chrome is set as default browser on my system
Thanks for your inputs.
If the js file is in a separate folder, you need to provide the exact route to the folder in the script tag, since in the current form it is trying to find the js file in the root directory. The script tag should look like this:
<script src="FOLDER_NAME/line.js"></script>
It's possible that your javascript file is being loaded before the HTML page is rendered. You can try adding "defer" to your script tag like this:
<script src="demo_defer.js" defer></script>

jQuery AJAX Cannot Find Local File in WordPress Installation

I'm having trouble with a WordPress plugin I've been working on. A JS file is loaded as a resource with each page/post opened, which in turn has a request to load the contents of an HTML file.
Being that the page/post directories change frequently, I'm having a difficult time making the jQuery dynamically pin down the location of the file (even though it's in the same location as the rest of the plugin resources).
An example:
jQuery('body').append('<section id="asub00LOAD"></section>');
var url = jQuery(location).attr('hostname');
var dir = url + '/wp-content/plugins/adsenseunblock/html/adunblock.html #asub00AJAX';
jQuery('#asub00LOAD').load(dir);
That was placing the whole URL path to the file after the local install ("root.com/CHEETOS/" in this case):
After which, I did this, which works fine for the root directory only:
jQuery('body').append('<section id="asub00LOAD"></section>');
var dir = 'wp-content/plugins/adsenseunblock/html/adunblock.html #asub00AJAX';
jQuery('#asub00LOAD').load(dir);
After you venture to another page, obviously the directory location is wrong again.
I tried to place some PHP into my JS file before so I could take advantage of the $plugins_url feature, but that became very convoluted and it's hard to track any errors without a PHP console to work from...
I hope someone here will have a solution for me!
The first example probably fails because there's no http:// (or //)
Use var url = "//" + location.hostname;
The second example should work everywhere if you use a root-relative path:
var dir = '/wp-content/plugins/adsenseunblock/html/adunblock.html #asub00AJAX';

Loading Dygraph input inside a node app

I'm very new to node and am struggling to load the data for Dygraphs on a static page. I believe that my issue is to do with routing. My js for Dygraphs is:
g2 = new Dygraph(
document.getElementById("graphdiv2"),
"../newDataFile.csv",
etc....
I can see in the browser that newDataFile.csv is not being loaded, despite the file being in the root directory.
My routing code looks like this:
router.get('/Dygraphpage', function(req, res) {
res.render('Dygraphpage');
});
I guess that I need to pass the csv file into this routing code, but I don't know how to. Any ideas?!
Figured it out. I am using ExpressJS and the solution was to put the newDataFile.csv inside the Public folder. It then existed at /newDataFile.csv.

Load a directory in a js with flask

I would like to declare in a script, a directory.
$images_dir = '{{url_for('.../pictures')}}';
My flask application directory looks like:
Root
-wep.py
-templates
-gallery.html
-static
-pictures
The picture are located inside the pictures folder, and the html page that contains the script is gallery.html which located in the templates folder.
The purpose of that script is to list all the images that are located in the pictures folder and present them as a gallery view when the gallery.html page is loaded.
The script works fine if I run it in a normal apache webserver though.
When I run the web.py, the debuger gives me the error:
BuildError: ('../pictures', {}, None)
So I think the problem is to declare the directory in flask.
UPDATE:
Im using this guy's script : http://davidwalsh.name/generate-photo-gallery
As you can see in the source code:
/** settings **/
$images_dir = 'preload-images/';
$thumbs_dir = 'preload-images-thumbs/';
Im trying to adjust those line to work with flask.
I think you're misunderstanding the purpose of url_for. url_for is for generating a link to one of your application's HTTP endpoints/view functions. You don't need any flask-specific method to get a list of files. You might find glob or os.listdir() helpful for this purpose. Then you can pass a list of the relevant paths to your template for rendering.

Load HTML from applicationDirectory in TideSDK

I'm using the default index.html located in RessourcesFolder of my app. The index.html page is only there to check if my application has an update (new html pages to display in app).
It works perfectly.. I can download my new contents from the server in applicationDataDirectory
But.. when I finished the application update, I'd like to replace the current index.html page with my updateindex.html
Loading remote html pages works fine, for example:
currentWindow.setURL('http://www.stackoverflow.com/' );
However, when I try something like
currentWindow.setURL('C:\Documents and Settings\myuser\Application Data\TideSDK\testApp\index_update.html' );
Nothing is appended..
Can anyone help me?
you can modify the path of which index page you want to load within your application
this can be modified within the tiapp.xml file. Replace "app://index.html" with "app://updateindex.html" and you should be good to go

Categories