I launch chrome with --disable-web-security flag for testing purposes", then my html page is loaded(http://my.page.com/), and opens a new tab using var wnd1 = window.open('https://other.domain.com'). When the new page is loaded (in a new tab), I can execute some javascript on the new window object, for instance: wnd1.document.querySelector(".class1 p"). So far everything makes sense.
Then again, I open a page from different domain: var wnd2 = window.open('https://different.domain2.com'), and try to access its document with javascript code: wnd2.document, but now I get an error that looks related to iframes: "Uncaught DOMException: Blocked a frame with origin "http://my.page.com" from accessing a cross-origin frame.
at :1:4"
This error occurs only with specific domains (in contrast to "regular" domains - msn.com, google.com, etc., which I can open and execute JS code on). Any header that makes it act like an iframe? some other protection methods?
Related
I am trying to migrate my extension which records screen/tab/window according to the chosen option from manifest V2 to V3. In manifest V2 I was able to use background script as persistent and reach html page objects such as mediaRecorder, navigator. However in manifest V3 background script works as a service worker. So, I have to start the screen record in content-scripts to be able to reach the html objects. When I start chrome.desktopCapture API from the background script, I have to start the screenRecord in one of the tabs (should give a tabid to chrome.desktopCapture.chooseDesktopMedia API call). I cannot start it on the background page and when the page was refreshed or changed to a new URL screen record stops. Is there any workaround for this?
I believe the best way to handle updates such as a URL change on a tab is to attach the onUpdated listener to the chrome tabs in the background script.
chrome.tabs.onUpdated.addListener(function(tabId, changes, tab) {
//Detect Type of Change and Handle Accordingly
});
There are quite a few other events that may be of use that are listed in the chrome documentation Chrome Tabs Events. It's also possible to inject inline JavaScript from the content script so you can access the pages window object directly and attach event listeners there to handle reloads or URL changes. Check this stack overflow post for more information Modify Window Object in Chrome Extension
I am trying to develop a chrome extension which saves the url of webpages opened in all tabs and then load them whenever needed. Now I know content scripts, background scripts and popup.js. Content scripts mainly deal with the content of the loaded webpage and they have less chrome api interactions, background scripts are executed in an isolated environment and we can use all chrome api methods, popup.js is simply javascript that runs in context of popup.html.
Now here is my problem, I have a button in popup.html named "save" and on click of that button I want to save all the webpage urls opened in multiple tabs under one window. How can I do that?
Should I write a content or a background script?
Sorry for my noobish question. I am new to chrome api. Any help/suggestions?
Neither content script or background page is needed. You could do that just in popup.js, since popup page actually runs in the same context with extension.
In your popup.js, just call chrome.tabs.query to get tab info, including url (you would need to declare tabs permissions in manifest.json). If you want to specify window id, either use WINDOW_ID_CURRENT or retrieve it through other ways (depends on your logic)
chrome.tabs.query({ windowId: YOUR_WINDOW_ID }, (tabs) => {
tabs.forEach((tab) => console.log(tab.url));
});
I downloaded Google push-sample-app code, removed the key from the manifest, uploaded the app to the Chrome Web Store, then installed it in Chrome from the Web Store.
Now chrome://extensions/ lists the app as "Enabled", with "Inspect views: background page (Inactive)".
Chrome Task Manager doesn't list the app as currently running.
If at chrome://extensions/ tab, I click "background page (Inactive)" link for "Push Messaging Sample" app, then an inspect view shows up in a separate Chrome window, and a new entry appears in the Chrome Task Manager: "Background Page: Push Messaging Sample". As long as an inspect view Chrome window is open, an event page "background.js" doesn't get offloaded. And When a message is sent to the push messaging service, a popup window with the message text appears.
If I close the inspect view Chrome window, and send a message to the push messaging service, Chrome Task Manager shows that an event page "background.js" gets loaded, then offloaded in a few seconds disappearing from the Task manager. However, a popup window with a message does not appear.
How this app needs to be changed to show popup messages without any extra Chrome windows running?
The sample app does not show notification from "background page is inactive" state because when the background page is woken up, the event handler for chrome.pushMessaging.onMessage is not set up.
When user launches the app by clicking on its icon, the chrome.app.runtime.onLaunched() event is fired. But when background page is activated because of some incoming event (like push messaging or alarm), the onLaunched is not fired - instead, only the 'initial script', the JS code outside of functions, is executed. The initial script of background page must register event listeners so after initial load Chrome knows which handler to call. The sample app only registers the onMessage handler in onLaunched, but not from initial script.
It is easy to 'fix' the sample app - just move the call of setupPush() from onLaunched() handler to the very end of background.js file:
background.js:
....
// When a Push Message arrives, show it as a text notification (toast)
function showPushMessage(payload, subChannel) {
var notification = window.webkitNotifications.createNotification(
'icon.png', 'Push Message',
"Push message for you! " +
payload +" [" + subChannel + "]");
notification.show();
}
setupPush(); // <-- this executes every time page loads, not only in onLaunched
This will cause setupPush() to be executed every time background page is activated, whether user launched the app or the app is started in background in response to incoming push message.
This question / answer explained what is missing:
"Because the listeners themselves only exist in the context of the event page, you must use addListener each time the event page loads; only doing so at runtime.onInstalled by itself is insufficient."
To fix push-sample-app, all is needed is to add to background.js:
// Register with the Push Messaging system for the Push Message.
chrome.pushMessaging.onMessage.addListener(messageCallback);
Writing and reading from LocalStorage is working fine from my popup and tab. However, when I attempt to add a value from my background page, it doesn't seem to write at all. I'm viewing local storage in Chrome Developer Tools by refreshing and looking for the value to show.
In the following example code for background.html 'lastId' is displayed correctly in the alert when a new bookmark is added. However, the value is not stored. Additionally, the request for a known value appears to fail with no alert displaying. (Results are the same attempting both syntaxes shown below.)
<html>
<script>
// Grab the id of newly created bookmarks
chrome.bookmarks.onCreated.addListener(function(id) {
var lastId = id;
alert(lastId);
localStorage['lastId'] = lastId;
var testvalue = localStorage['309'];
alert(testvalue);
localStorage.setItem('lastId', lastId);
var testvalue2 = localStorage.getItem('309');
alert(testvalue2);
});
</script>
</html>
I keep thinking I must just be missing some small syntax issue or something but can't see anything. If my manifest declaration was incorrect I don't think the alert would work for the id. Stumped...
UPDATE: Turns out that you have to force reload of the extension on updates to background pages since they are persistent in browser memory when opened. That is why my saved code appeared not to work. It wasn't refreshed and I am duly embarrassed.
Hm, I can think about couple things.
You say that it works in a tab and a popup. This is very strange because it shouldn't (if by tab you mean content script). Content scripts are able to access only localStorage that belongs to a site they are injected. Popup, background, option pages, and any othe page from extension's folder can only access extension's own localStorage. Those two local storages and completely separated. So maybe you are inspecting wrong localStorage?
To see extension's own localStorage you need to inspect background or popup page and check resources tab in the inspector. To inspect site or content script localStorage you need to open regular inspector on the page.
Second moment is your localStorage assignment might be not what you are expecting.
If you run:
var lastId = 5;
localStorage['lastId'] = lastId;
you will get value 5 assigned to lastId property. So to read written value you need to run:
alert(localStorage['lastId']); //not localStorage['5']
If you want to store arrays then you would need to serialize/unserialize them through JSON as localStorage can store only strings.
We have some code where the user clicks a link which launches a pop up window. The code that creates the window then does an HTTP post to the window. Once the post has succeeded, the page is redirected (as a javascript location) to a PDF that was created during the post.
One person is getting an error where the posted data is not getting posted. In fact, the request is coming across as a GET.
Originally I thought this may be some kind of bookmark to the original page issue. But it happens in two different places that use the same concept in a different manner. And, since the post is triggered through JavaScript and the result is immediately relocated it would be no trivial matter to actually get a link to the original page.
So, the question is, are there any "pop-up" blocker like security tools that would allow pop-up's but convert all POSTS on them to GETS?
Example Call:
function LoadPDF(File){
document.forms[0].PDF.value = File;
win = "Window" + Math.round(Math.random()*100000);
open("",win,'toolbar=no');
function SubmitForm(){
document.forms[0].action = 'CreatePDF.cfm';
document.forms[0].target = win;
document.forms[0].submit();
}
//Give window time to open.
setTimeout(SubmitForm,550);
}
The code that creates the window then does an HTTP post to the window.
Popup blockers block popups as they are opening, which is pretty much the point of their existence. It would have to be a pretty lame popup blocker that allowed the popup to open and then translated the POST to a GET. It's possible a GreaseMonkey script or extension could translate it maybe.
Tell the user to disable any plugins/extensions and try again.