Enable javascript local files

Enable javascript local files

The browser does not allow opening a local file using window.open(‘local_file.txt’) and $.ajax(‘local_file.txt’) , because of security reasons. However, I want to use the file’s data in the client side. How can I read local file in JavaScript?

Solution — Use HTML5 FileReader

The HTML5 FileReader facility does allow you to process local files, but these MUST be selected by the user, you cannot go rooting about the users disk looking for files.

function readSingleFile(e) < var file = e.target.files[0]; if (!file) < return; >var reader = new FileReader(); reader.onload = function(e) < var contents = e.target.result; // Display file content displayContents(contents); >; reader.readAsText(file); > function displayContents(contents) < var element = document.getElementById('file-content'); element.innerHTML = contents; >document.getElementById('file-input').addEventListener('change', readSingleFile, false);

Solution — Use XMLHttpRequest

JavaScript cannot typically access local files in new browsers, but the XMLHttpRequest object can be used to read files. So it is actually Ajax (and not Javascript) which is reading the file.

Here is an example to read file abc.txt:

var txt = ''; var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() < if(xmlhttp.status == 200 && xmlhttp.readyState == 4)< txt = xmlhttp.responseText; >>; xmlhttp.open("GET","abc.txt",true); xmlhttp.send();

References & Resources

Latest Post

• Dependency injection
• Directives and Pipes
• Data binding
• HTTP Get vs. Post
• Node.js is everywhere
• MongoDB root user
• Combine JavaScript and CSS
• Inline Small JavaScript and CSS
• Minify JavaScript and CSS
• Defer Parsing of JavaScript
• Prefer Async Script Loading
• Components, Bootstrap and DOM
• What is HEAD in git?
• Show the changes in Git.
• What is AngularJS 2?
• Confidence Interval for a Population Mean
• Accuracy vs. Precision
• Sampling Distribution
• Working with the Normal Distribution
• Standardized score — Z score
• Percentile
• Evaluating the Normal Distribution
• What is Nodejs? Advantages and disadvantage?
• How do I debug Nodejs applications?
• Sync directory search using fs.readdirSync

Источник

Load local javascript file in chrome for testing?

The easiest way to get a modern browser to load and run JavaScript files in local HTML files is to run a local web server. Install Visual Studio Code You can get the Visual Studio Code editor for your platform from https://code.visualstudio.com/. It supports Windows, Linux, and Mac.

Load local javascript file in chrome for testing?

I am trying to test some JavaScript on my local computer using the Chrome browser but Chrome will not load local resources. Is there an easy work around for this?

If you are trying to just test the functionality of your JavaScript file: create a blank HTML file, add a link to your JS file as you would normally load a JS file from HTML, and open the HTML file in Chrome. Go to the JavaScript console. You’ll be able to interact with the functionality of your JS code as usual. You wouldn’t need to set up a server for this. If still not clear, here’s an example:

You can use a light weight webserver to serve the file.
For example,
1. install Node
2. install the «http-server» (or similar) package
3. Run the http-server package ( «http-server -c-1») from the folder where the script file is located
4. Load the script from chrome console (run the following script on chrome console

var ele = document.createElement("script"); var scriptPath = "http://localhost:8080/.js" //verify the script path ele.setAttribute("src",scriptPath); document.head.appendChild(ele) 

To load local resources in Chrome when just using your local computer and not using a webserver you need to add the —allow-file-access-from-files flag.

You can have a shortcut to Chrome that allows files access and one that does not.

Create a shortcut for Chrome on the desktop, right click on shortcut, select properties. In the dialog box that opens find the target for the short cut and add the parameter after chrome.exe leaving a space

e.g. C:\PATH TO\chrome.exe —allow-file-access-from-files

This shortcut will allow access to files without affecting any other shortcut to Chrome you have.

When you open Chrome with this shortcut it should allow local resources to be loaded using HTML5 and the filesystem API.

For security reasons, modern browsers won’t load resource from locally running HTML files (files using file:// protocol in the address bar).

The easiest way to get a modern browser to load and run JavaScript files in local HTML files is to run a local web server.

If you don’t want to go through the trouble of setting up a Node or Apache web server just to test your JavaScript, then I’d suggest you install Visual Studio Code and the Live Server extension.

Visual Studio Code

Visual Studio code is a source code editor for pretty much any programming language under the sun. It has built-in support for JavaScript, HTML, CSS, TypeScript, and almost any kind of language used for Web development.

Install Visual Studio Code

You can get the visual studio code editor for your platform from https://code.visualstudio.com/. It supports Windows, Linux, and Mac. I think it also works on your Surface Pro if that’s your thing.

Add the Live Code Extension

After installing VS Code, you can add the Live Code Code Extension using the Extension panel (Ctrl+Shift+X in Windows) in Visual Studio Code.

After adding the extension, you should see a «Go Live» button in the bottom-right corner of the Visual Studio code IDE (as shown in the above screenshot).

Open in Code

Open the root folder where your HTML and JavaScript files exist in Visual Studio Code and click the «Go Live» button. Optionally, you can right-click the HTML file in the Explorer (Ctrl+Shift+E) and select Open with Live Server from the pop-up menu that appears.

This should create a locally running web server and open the file or folder in your web browser. If your file paths are correct, your JavaScript files should also load and run correctly.

Troubleshooting

If for some reason, the page doesn’t load in your favorite browser, check that the address and port number are correct. If the Live Server is running, it should display the port number in the bottom-right corner of the Visual Studio IDE. Make sure the address in your browser says http://127.0.0.1:/index.html where has the same number as shown in the status bar in Visual Studio Code.

How to Enable Javascript on Google Chrome on, Learn How to Enable Javascript on Google Chrome on Windows 10. It is simple process to allow and turn on javascript on google chrome on Windows 10, …

How to Enable Javascript on Google Chrome on

Learn How to Enable Javascript on Google Chrome on Windows 10. It is simple process to allow and turn on javascript on google chrome on Windows 10, …

How to Enable & Disable JavaScript in Google Chrome

How to Enable & Disable JavaScript in Google Chrome ? In this tutorial, I show you how to turn off or on JavaScript in the Google Chrome browser. This can be

Enable Or Disable JavaScript In Google Chrome In

Enable Or Disable JavaScript In Google Chrome In Windows 11 [Tutorial]You may be wondering how a site looks with or without JavaScript . On Chrome , JavaScript

How to enable JavaScript with headless Chrome in selenium

import requests from bs4 import BeautifulSoup from selenium import webdriver from selenium.webdriver.common.keys import Keys from selenium.webdriver.common.by import By from selenium.webdriver.support.ui import WebDriverWait from selenium.webdriver.support import expected_conditions as EC from selenium.webdriver.chrome.options import Options import time def checkLinkedIn(command): url = f"https://www.linkedin.com/in/" path = "C:\Program Files (x86)\chromedriver.exe" options = Options() options.add_argument("--headless") driver = webdriver.Chrome(path, options=options) driver.get(url) soup = BeautifulSoup(driver.page_source, 'html.parser') time.sleep(2) driver.quit() name = soup.find("h1", attrs=) if name: print("LinkedIn profile found") print(url) else: print("No LinkedIn profile found") def checkTwitter(command): url = f"https://www.twitter.com/" path = "C:\Program Files (x86)\chromedriver.exe" options = Options() options.add_argument("--headless") driver = webdriver.Chrome(path, options=options) driver.get(url) soup = BeautifulSoup(driver.page_source, 'html.parser') time.sleep(2) driver.quit() at_tag = soup.find("div", attrs=) print(soup.text) if at_tag: print("Twitter profile found") print(url) else: print("No Twitter profile found") usrname = input("--> ") checkTwitter(usrname) 

The LinkedIn function works. However, the Twitter one comes up with this:

JavaScript is not available. We’ve detected that JavaScript is disabled in this browser. Please enable JavaScript or switch to a supported browser to continue using twitter.com. You can see a list of supported browsers in our Help Centre.

How do I enable Javascript in a headless Chrome? Thanks in advance.

This maybe because the website detects it’s a headless browser and disables some features.

To get around it you can spoof (as much as possible) the identity of the headless browser to trick the website.

Try the following options:

from fake_useragent import UserAgent options = webdriver.ChromeOptions() options.add_argument('--headless') options.add_argument("--incognito") options.add_argument("--nogpu") options.add_argument("--disable-gpu") options.add_argument("--window-size=1280,1280") options.add_argument("--no-sandbox") options.add_argument("--enable-javascript") options.add_experimental_option("excludeSwitches", ["enable-automation"]) options.add_experimental_option('useAutomationExtension', False) options.add_argument('--disable-blink-features=AutomationControlled') ua = UserAgent() userAgent = ua.random driver = webdriver.Chrome(options=options) driver.execute_script("Object.defineProperty(navigator, 'webdriver', undefined>)") driver.execute_cdp_cmd('Network.setUserAgentOverride', ) 

This worked for me with a particular stubborn website. The options I gathered from many SO answers but particularly this one: https://stackoverflow.com/a/53040904/5339857

options.add_argument("--enable-javascript") 

How to Enable & Disable JavaScript in Google Chrome, How to Enable & Disable JavaScript in Google Chrome ? In this tutorial, I show you how to turn off or on JavaScript in the Google Chrome browser. This can be

How do you launch the JavaScript debugger in Google Chrome?

When using Google Chrome, I want to debug some JavaScript code. How can I do that?

Try adding this to your source:

It works in most, if not all browsers. Just place it somewhere in your code, and it will act like a breakpoint.

Windows: CTRL — SHIFT — J OR F12

Also available through the wrench menu (Tools > JavaScript Console):

Ctrl + Shift + I keys to open Developer Tools

Ctrl + Shift + J to open Developer Tools and bring focus to the Console.

Ctrl + Shift + C to toggle Inspect Element mode.

⌥ + ⌘ + I keys to open Developer Tools

⌥ + ⌘ + J to open Developer Tools and bring focus to the Console.

⌥ + ⌘ + C to toggle Inspect Element mode.

Press the F12 function key in the Chrome browser to launch the JavaScript debugger and then click «Scripts».

Choose the JavaScript file on top and place the breakpoint to the debugger for the JavaScript code.

Enable Or Disable JavaScript In Google Chrome In, Enable Or Disable JavaScript In Google Chrome In Windows 11 [Tutorial]You may be wondering how a site looks with or without JavaScript . On Chrome , JavaScript

Источник