I'm new to Vue.js and would like to know if there's a way to view PDF files that are stored independently from the Vue project through said Vue application.
Here's what I need:
All PDF files are stored in a folder. I'd like to provide links to access them in the application that I get from the backend server. Upon clicking the link, the PDF should open in a new tab and the URL would simply be something like
file:///C:/Users/user/Downloads/campusmap.pdf
What I have tried so far:
<a :href="fileAddress">View file</a>
When I hover over the link on my browser, It shows the right URL but clicking on it does nothing.
If I right-click to open in a new tab, it says blocked (about:blank#blocked)
Using <router-link> shows
localhost:8080/C:/Users/user/Downloads/campusmap.pdf
when hovered over it.
Is there a way to be able to just view the PDF through a link the way I want? Please note that I can't store all the PDF files in the asset or public folders.
Thanks for your help!
You can't link to a file:// protocol url from a page sourced via the http(s):// protocol - this is a security measure built in to modern browsers. Your only option is to also serve up the local files behind a web server, or run the app locally behind a file:// url.
I'm not sure how to go about this but I wanted to be able to load content from a file (i.e. txt, html, etc...) to my Tinymce instance.
So basically a button that initiates a file browser and then loads the content of the file to Tinymce.
I've seen this for images and image browsers but I'm not sure how to do this for files.
This would be done locally, not on a server as well.
Nick -
Prior to HTML 5, JavaScript in the browser cannot read files directly from the hard drive - this is done for security reasons:
https://en.wikipedia.org/wiki/JavaScript#Security
In HTML 5 there are new APIs that allow you to get to files. This page has a decent overview:
http://www.html5rocks.com/en/tutorials/file/dndfiles/
I would note that browser support for this is not yet universal:
http://caniuse.com/#feat=fileapi
Assuming you can use the File API you should be able to do what you want after a user selects a file.
I'm working on a web application that needs to have a link which opens a documents folder from a file server. The folder can be opened either in a new browser tab or new window, or using the computer's default file browser program (i.e. Windows Explorer). This javascript should do the trick:
window.open('file://///fileserver.companyname/public/Documents/','_blank);
and this html should also work:
Open Documents
but these both only work in Internet Explorer, and our users always use Firefox and Chrome. Apparently the default security settings for Firefox and Chrome don't let you open a "file://" when the request is called from an "http://" website.
I've seen several references to this page: Links to local pages do not work which describes why you can't open files from webpages using Firefox and offers a few workarounds. Unfortunately, it only offers two options: install a plug-in on each browser instance, or create a user preferences file for each browser instance. Neither of these options are acceptable because we have too many users. The company I work for is not willing to apply anything to each machine which needs to access this link. Aside from that, I tried both plug-ins and the preferences file anyway, and the only one that worked for me was the IE Tab plug-in. I think the reason LocalLinks didn't work is because I'm trying to open a folder, not a file.
This stackoverflow question described similar options for Chrome: Can Google Chrome open local links? but again, the LocalLinks plug-in didn't work for me and plug-ins aren't acceptable anyway.
I also found a website that suggested to use a command line argument top open files in Chrome (http://www.askyb.com/chrome/open-local-file-in-google-chrome/) and one that showed how to apply the argument automatically (https://askubuntu.com/questions/160245/making-google-chrome-option-allow-file-access-from-files-permanent), but if I read it correctly it still involves applying changes to every computer accessing our website.
Is there any way to open a file folder in both Firefox and Chrome entirely programmatically i.e. within my web application C# or Javascript code without installing a plug-in or adding a preferences file to individual computers? I cannot alter any of these business requirements.
Sidenote: We are using C# with MVC 4. I would prefer to open the folder using a Controller Action in C# (because I'd like to create the folder before opening it if it doesn't exist yet), but javascript or html on the client side is acceptable. For Internet Explorer, I can create that javascript in the C# code by wrapping it in the JavaScript( ... ) function built into MVC C# Controllers. When testing IE Tabs in Firefox and Chrome, I had to define it as an href link, not a function that opens a window, or IE Tabs wouldn't recognize it as a link. But neither of these were acceptable workarounds for our business needs.
The request was dropped before I could come up with a feasible solution, but in case anyone else is still struggling with this problem I will describe workaround that would not require any workstation customization.
They don't technically need to use the built-in file explorer to open a folder. Instead, a creative way to display the information the business wanted without breaking any browser security rules would be to iterate though the files without opening the file explorer and then display a list of folders/files in a browser window.
Using Directory.EnumerateDirectories(filepath) and Directory.EnumerateFiles(filepath) you can get a list of folders and files to display. When the user clicks one of the folders, call these methods again to get the next level of folders and filenames. When the user clicks a file, download/open it. These methods return the folder and file names as lists of strings, so you would just need to render the lists with custom icons in the browser. (The methods are from C#'s System.IO library.)
here is the simple html code:
<input type="file" webkitdirectory>
but the problem with this code is that it works only on google!
I am new to extension programming but find making extensions in Chrome much more easier, but now that I am trying to port my test extensions to FF I have a few questions of how to do the same things I do in Chrome... now in FF.
For example:
In Chrome I have a page in my extensions directory called: domains.html
I link to that page from my popup and it has access to all my scripts etc but the "outside" world cannot directly access that.
Is there any such thing in FF so that I can show a page that is in my add on folder and has access to my add-on's JS and other files?
Thanks!
Take a look at some of the docs for opening URLs in new Tabs and manipulating the content of the tab:
https://developer.mozilla.org/en/Code_snippets/Tabbed_browser#Opening_a_URL_in_a_new_tab
Once you get comfortable with that, try opening an HTML page that lives in your add-on. First, you need to be aware of the 'content' package name you registered in your chrome.manifest file. Second, make sure your 'domains.html' file is in the content folder of your add-on. To open the web page in a new tab using a button or menu in Firefox use code like this:
gBrowser.addTab("chrome://mypackagename/content/domains.html");
You can should be able to load other JS and CSS files from your add-on into the web page using similar chrome:// URIs.
If you call javascript window.open and pass a url to a .xls file it open on some machines in the browser window. How can you force it into Excel?
Only the users machine can "force" it into Excel. That said, 99% of the time if you send the correct mime-type and a user has Excel, then it will open in Excel assuming they approve.
And only the server can send the correct mime-type. The document type you pass to a JavaScript window.open call will have no effect on this. In fact, calling window.open will at best just open a superfluous window.
It's best to just link to the document with <a href="foo.xls">. And provided your server is sending a mime-type of application/x-excel or application/x-msexcel this will almost always nudge the browser into opening a new window with the Excel document.
If it's just a static file, and you're using Apache on Linux, check for a file called /etc/mime.types, and ensure that it has the following line in there to associate the .xls file extension with the correct MIME type:
application/vnd.ms-excel xls
I'm guessing the location of that file might vary across systems, but it's in /etc/mime.types on my server which is running RHEL4.
AFAIK you can't do this with JavaScript alone. If you have some sort of scripting language on the server's side you can alter the header to force a download.
Here's a simple tutorial in PHP, but you can easily find one in your favorite language.
You cannot force it into Excel. You can allow the browser to handle it whichever way it is configured to do so, or you can try to force it to download the file and let the user open if from their desktop. To force a download, search for "force download" and your server-side language (PHP, ASP.NET, JSP, etc.)
I don't think you can: you cannot call external programs using Javascript for security reasons. Assuming that the user has Excel installed, you may want to open the new window without the address bar to give the user "the illusion" that the file has been opened with Excel in Internet Explorer.
I wouldn't think this is possible from javascript due to security issues, there would be nothing stopping a rogue webpage from opening dozens of excel/word instances.
Could you not set a hyperlink to the url of the .xls, that way the user would get the usual download prompt to view the file.
Set the http content type to the Excel datatype: application/vnd.ms-excel
You shouldn't need to redirect to a new window, but you will get a popup asking the user to save or open the file.
In relation to (2): I'd worry if a browser could launch an external application and load data into it automatically without user intervention.
This is a setting in each user's browser and not in something that can be set by code. So unfortunately you do not have control of that.
You can not, as it depends on the client machine.
For example on Windows if you want it to always open it with Excel, not in the browser window, you have to open My Computer, Tools, Folder Options, File Types, select the XLS type, and click on Advanced. There are two checkboxes: Browse in same window and Open web documents in place. Uncheck both, close browser window, open it again and try again.
However as I said: it depends on the client, you can not force it.
You can do this using LaunchinIE, an ActiveX Control that will enable HTML pages to start whatever application on the client's machine, without security warnings.
Quote from the site: "At last, web pages can start Word, Excel, or any other corporate application without complaints. Securely."
For this you do have to install the control on the user machine and also add the URL that is allowed to execute local applications to the Windows registry.
Another quote from the site: "To ensure security, LaunchinIE needs to be carefully configured client-side; due to this restriction it's only fit for intranet use."
I use LaunchinIE in our training facility so I can use Internet Explorer as a menu which lets the user choose the machine setup. LaunchinIE then calls a batch script that configures the machine to best support the selected training.
Here are the steps to get this pop-up back when opening a saved Excel file.
Right-Click on the windows [START] button and select Explore to open Windows Explorer window will open.
From the menu select Tools \ Folder Options…
• Choose the File Types tab and scroll down the list of files.
• Left-Click to highlight the XLS Microsoft Excel Worksheet file extension and click on the Advanced button.
In the Edit File Type window, Uncheck the “Browse in same window” option.
Click OK button to accept your changes.
Start a new browser session. The next time you open your Excel spreadsheet in your Inbox, you should be prompted with the following window. Be sure to leave the “Always ask before opening this type of file” as checked. Clicking the Open button should now open your file in Excel.