I have a chrome extension that, when clicked, needs to display a modal to the user. For convenience we would like to pull all the necessary code for the modal from a server and then execute the JavaScript in the context of the extension, before displaying anything to the user.
(running a Node.js server)
Is there a way to do this?
If not, any suggestions on alternative routes we could take?
cheers!
Have a read through https://developer.chrome.com/extensions/contentSecurityPolicy
In short - it's possible, but you need to serve the script over HTTPS, or else Chrome will reject the origin. You also need to explicitly write the CSP in the manifest.
"Convenience" is a strange word to use here though. What if the network is flaky or slow?
Related
I generate chrome trace files and with to open them non interactively from a script. However, I do not want to use the default chrome://tracing page, instead I use https://ui.perfetto.dev which I find much more convenient.
The only problem is that it is an interactive process - I need to open the file dialog and select the trace file from there, then the traces in that file are displayed. There is no network traffic here, purely Javascript.
But maybe there is another way to open trace files in https://ui.perfetto.dev that can be scripted? Or maybe there is another site that gives the same kind of GUI, but also satisfies my requirement?
By scripting I mean I want to run a script with a trace file and as a result the default browser opens with the tracing page.
Look at what tools/record_android_trace does here:
https://github.com/google/perfetto/blob/master/tools/record_android_trace#L345
Essentially you can achieve that by:
Serving the file over HTTP (it MUST be port 9001 to satisfy ui.perfetto.dev Content Security Oolicy)
Open https://ui.perfetto.dev/#!/?url=http://127.0.0.1:9001/file.trace
The url= argument will cause the UI code to automatically fetch the trace from your local web server. You can kill it soon after the GET request is done.
I have WAMP installed on a network machine. I have a table with file links, for people could open those files directly from a web page.
Those files are in another server, in the same network as WAMP.
When the users click on the link it appears the following error:
"not allowed to load local resource: file:///networkdrive/directorie/file.xls"
How can I resolve this?
I have this:
<button type="button" onClick="openfile('networkdrive/ptlr/Sectorial/LRCD/Horários/Equipas Turno.xls')">botao</button>
<script>
function openfile(file) {
window.location = "file:///" + file;
}
</script>
Just read the error: "not allowed to load local resource (...)"
Or on Firefox I get "Access to (...) from script denied".
It seems you are looking for a magical solution that will solve it, but no, it's exactly as the description of the error says: you are not allowed to do that because of security reasons.
The problem is that you're trying to make the browser open a file on your local drive, and that's not allowed from any protocol other than file:/// itself. So, what you'll want to do is either make sure the local file is also accessible via a server, or open the webpages that contain this script from file:/// too.
You can see this at work by first opening http://jsbin.com/OYObEMA/1/ and seeing this same error occur, then pressing CTRL+S and saving it as a single HTML file, and opening that HTML file then. The JSBin one opens via the internet, so isn't given access to the file:/// protocol, but the local (downloaded) HTML file can access it.
One way you could kind-of do this is to just provide the url the user needs to go to instead. So, just make an <input> that has a value set to the url the user would need to go to, and then provide the instructions "please copy this url into your url bar to open this file". That's not an elegant way to do it, but it would kind-of work.
About your answer to my initial comment: sure, I understood that. The question was not meant in a literal way, but to make you start thinking about what you actually try! You mix different environments.
either need to use webdav for this, if your client side applications are able to use that http extension to load and save files, or
you have to do the old scheme known from the IT middleages which is still typical for MS-Windows systems: offer the file for download via http and add an additional upload service (which will give you versioning pain), or
deliver your web page via the same protocol (network share) so that it is opened with as a local file on the client side, since then your are allowed to open additional local files referenced inside the web page.
In Chromium, 'console.log()' lets you print to the error console, but only from javascript embedded in the html, or in a .js file on the local machine.
What are your workarounds for debugging Javascript that is contained in .js files on a remote machine and included in a page?
Add breakpoints and / or watch expressions.
See http://code.google.com/chrome/devtools/docs/scripts-breakpoints.html
I recently had to do this with a Facebook SDK javascript, hosted by Facebook. I downloaded the script and hosted it locally for debugging. I could then add in all the console.log messages I wanted.
When everything was done I removed the local file and returned to Facebook's hosted script.
Phil's suggestion of breakpoints is also very useful when you want the value of a variable at a specific location in the code.
Another useful technique for code executed upon a user action, such as a button click, is to use the Scripts tab of the Chrome inspector, or FireBug in FF, to edit the javascript prior to execution. I've had limited use for this, but it's quite useful from time to time.
The problem is cross-domain security policy. Only javascript from the domain of the html file can use console.log
Ok so I'm lost here, frustrated and pulling my hair and out. Plus probably about to be fired or take a pay cut.
I moved Files from a development server to my local machine. The files are consistent (used diff tool), all the dependencies are there. It works for the most part. The problem is that the some of the javascript (not all) is just not working. We're using jquery and a lot of plugins for it. I've checked with the web developer plugin in firefox and all the js files are loading. I cleared the cache in both firefox and chrome multiple times to no avail. The development server is a windows server running wamp. My local machine is running ubuntu. Somebody tell me what I missed.
Download firebug as a Firefox extension and view the http request and responses.
Easiest may be from within the 'net' tab to determine if your script is making a request.
Very likely that it is a source domain issue. There are no work-around for this issue. The ajax request and the source data must be on the same domain.
It may have something to do with JavaScript's security limitations. (In certain circumstances) You can only operate on URLs or pages from the current domain, which most likely changed when you moved the files off the other server. More here.
Are you running the files via a webserver, or just opening the files directly? If it's the latter, you'll want to set up a server on your local machine for local testing, and serve the files using it. Otherwise, you'll very likely run into the domain restrictions others have mentioned above.
You may need to host the site using a local server. VS IDE has an add-on called live server. You need to set up a workspace in order for it to work. The port used on my machine was 5500.
You need to make sure any dependencies for javascript are running on your server or the javascript will not be executed. These dependencies are listed in the json file.
ex. If you require express, you need to be running node or the javascript won't execute in your web browser.
In the terminal:
node app.js
Any dependencies that are not installed and running on the server will not execute.
Are you accessing the html web pages through the webserver and not simply double clicking the file to open it?
Also if you have WebDeveloper toolbar installed the click "Disable", "Disable Javascript" and make sure "All Javascript" isn't ticked.
During a normal browsing session I want to edit a specific javascript file before the browser receives since once it gets there it's impossible to edit. Is there are any tool for this? For what I need it I can't just save it and edit it on my disk.
I'm ready to learn how to program it myself but if anyone can point out more or less what I have to do I'd be very grateful. I'd have to intercept the packets until I have the whole file while blocking the browser from receiving it any part of it, then edit it manually and forward it to the same port.
I don't think I can do this by just using pcap, I've read a bit about scapy but I'm not sure if it can help me either.
Thanks in advance.
You'd need to implement some sort of proxy, or hook into an existing one, and intercept the file as it's being downloaded and replace it.
Not trivial for a beginner, but a good learning project.
If you are happy to, rather then editing a file, replace it with a local one, then I would* use Charles and its Map To Local function.
Actually, "did". This helped me debug a problem with a browser and a JS file I couldn't edit yesterday.
You can probably achieve whatever it is you are wanting to do by using the firefox firebug plugin, chrome's development tools or the firefox greasemonkey plugin.
Or you could enter the files domain into your hosts file and point that domain to your local machine (running a web server), edit & save that javascript file locally and serve it from your own web server.