We Keep Coding

Problem dowloading a pdf file through browser using javascript

I have to present for an exam a portfolio which allows visitors to download some documentations about my projects as pdf files.
I tried using an tag with a "download" attribute, unfortunately when I try to download the file by clicking on the link, the file is proposed to be recorded as .html or all files.
Whatever option I choose, after downloading the file, I'm not able to open it because it seems damaged or in the wrong format.
Here's the code I use :
My "demo" var is contained in an object Work as you can see on the screenshot :
In case it matters, my pdf file is stored here:
Thanks for you help ! =)

As a wild guess :
your path is wrong (documents/pdt-test.pdf)
your html is missing a doctype or a proper structure
you need a doctype/pdf somewhere. Something like in here Download a by ByteArray as pdf /handle error in React

Image from public directory not loading Express NodeJs

Hello I am writing an express app, i have a public directory and it has one image in it. In the app.js file I use the line "app.use(express.static(__dirname + '/public/'));" so express knows to use this folder.
The image loads on some pages and on other pages it doesn't, it loads on pages with URLs where its only one word after the base url, for example www.amazonaws.com/blogs or www.amazonaws.com/login but image doesn't load on pages with URLs such as www.amazonaws.com/blogs/best or www.amazonaws.com/blogs/102.
I'm using ejs files and they are all in the same folder, so for example the 'blogs' ejs file which is used for www.amazonaws.com/blogs works fine, but for the 'best' ejs file for www.amazonaws.com/blogs/best everthying works fine except this image does not load. Not sure why this is? Thanks for any help.

The URL to your image in the web page needs to start with / so it is not a "path-relative" URL. From your symptoms, it sounds like your image URL in the page is just a plain name such as:
<img src="image.jpg">
When you do it like that, then the browser will take the path of your web page and combine it with the filename and which URL the browser requests will differ based on whether the web page has a path or not. If, instead, you do this:
<img src="/image.jpg">
Then, the browser will only use the domain of the web page, not the path and you will get a consistent URL no matter which web page path this link is in because this is an absolute path, not a relative path.

Unable to use images from document directory in JavaScript file

I am storing user specific images getting from server in document directory. Then I want to display this images on bing map at certain pins(inside pin InfoBox). I am loading the images dynamically using javaScript. But images are not displaying on map.
I am setting images as HTML content of infoBox like,
pinInfoBox.setHtmlContent('<div class="arrow_box"><div class="content" id="content"><img id="localFile" src="file:///var/mobile/Containers/Data/Application/395E5EED-2FB4-4505-861E-2DA9AB96433B/Documents/my_image.jpg/"/>'+pin.Title+'</div></div>');
If I use any remote file and access it via http protocol it will work,
pinInfoBox.setHtmlContent('<div class="arrow_box"><div class="content" id="content"><img id="localFile" src="http://a.abcd.com/static/images/zoom/magnifying-glass.png" />'+pin.Title+'</div></div>');
I don't know why it is not taking image saved in my document directory.
Please help me to resolve this.

I solved this based on #tiblu's comment.
JavaScript file and images should be in same path.
But I can't write images to bundle as these images are downloaded from server at runtime. So I copied JavaScript file to documentDirectory during application launch to work with images. Then we can simply access the image directly with it's name and no need of specifying full path.
pinInfoBox.setHtmlContent('<div class="arrow_box"><div class="content" id="content"><img id="localFile" src="my_image.jpg"/>'+pin.Title+'</div></div>');

Is it possible in Javascript to open a directory and read an image file and display it to html?

I was wondering if it is possible in JS to open a directory, read an image file and display it to Html? I believe JS restricts from being able to open any file in a directory directly, but what I want is:
I have a XML file which will contain the path to a image file in the web server root folder
so my hierarchy is like this
webserver root folder--->|
html
js
css
images
xml
, and I will use XmlHttpRequest and feed the directory tag and file name tag to my JS file which has to display the image to my frame in the Html page.
[My image is also in the same webserver root folder but in a different folder from html]
Any pointers on how to go about it? I guess we can store the image file also in XML as a base64 encoded data, but that would make the data exchange huge, also don't know if this is a ideal method (is it? please suggest)
Please give me some tips for this.
Thanks
Balaji R

JavaScript does not have access to filesystem on server, since it runs on the client side.
But with JavaScript or Ajax you can call some php code on server which will read the image from the file system and then it will pass this image back to the JavaScript.
I have described here how to do this.

If I am following you correctly, example.com/js/somefile.js is trying to access something like example.com/images/image.jpg?
If so then i would either use the absolute URL of the image:
"http://www.example.com/images/image.jpg" or the relative path "../images/image.jpg"
When referencing the images in your code you could actually use a plain text file, one image path per line. Then in your onreadystatechange function:
pictures = var.responseText.split("\n");
now pictures is an array of picture paths.

JavaScript only has access to the information & priviledges that the browser has access to, so unless the image is in a directory that would normally be accessible on the web site, you're not going to have much luck using just JavaScript.
Is there any way that you can make the path in the filesystem available to the web document root folder? Maybe by using an Alias or Symlink?

How can I print the contents of a js file to the screen from a URL?

I have an application that will check if a javascript file exists on our CDN and I would like to display the contents of that file in the browser window. I have all the nuts and bolts figured out, I just need to display the contents of the javascript file when I put in the URL where it exists.
Thanks in advance.

I believe you can output a javascript file to a webpage by just making sure any html elements are escaped. You can use the htmleditformat() function to do this when you output the value.
For example:
<cfhttp url="#jsurl#" />
<cfoutput><pre>#htmleditformat(cfhttp.filecontent)#</pre></cfoutput>
Other options just using the js address directly are to 1) link to the js file if you just want to be able to see it in the window, or 2) show the js file in an iframe

I'm not quite sure what you're asking:
"I need to open a javascript file in a web browser"
A. this is OS dependant, you call the binary that's registered for .htm files with parameters pointing it's initial destination to that .js file.
"I have a web app and want to dynamically display the contents of remote files formatted as text"
A. Use a block and fill it with GetWebResourceUrl().
"I am writing a standalone app and want to display remote files as text"
A. If you are writing a standalone, why do you want to display the contents of a js file via a browser? Use your local API, or launch the default text viewer with a local temp copy.