i'm developing a chrome extension which requires to get the values(to plugin) from local storage where values are stored by some other webpages that were created by me
In short: Access a webpage's localStorage from a Chrome extension script
I just tested it, and if you access localStorage from the context of a content script, you get the webpage's localStorage. So, nothing special is required besides injecting a content script into the webpage you need.
To communicate the value from the content script you can use Messaging API, and you can use chrome.storage.local API to save data in a way that's accessible from both the content script and the background page.
Related
Webextensios expose Javascript APIs under browser namespace. For example browser.topSites() in Javascript will return list of top visited sites as returned by the broswer.
I am interested how does this talk internally to browser object (presumably a C++ class) to call the appropriate method to get the list of top sites probably stored in some SQL Lite database.
So how does a call from Javascript map to appropriate C++ call architecturally?
There are JavaScript APIs made for this purpose.
JavaScript APIs for WebExtensions can be used inside the extension's
background scripts and in any other documents bundled with the
extension, including browser action or page action popups, sidebars,
options pages, or new tab pages. A few of these APIs can also be
accessed by an extension's content scripts (see the list in the
content script guide).
Update on comment:
Firefox has its own SpiderMonkey: The Mozilla JavaScript runtime
I'm implementing an application using react-filepond where once the user selects/drops the files, i need to get uris (for the files) for upload from an endpoint(server), and then using those uris to upload to our storage.(whilst also showing upload progress to the user)
is using onupdatefiles prop to send getURIs request and then using onprocessfile/onprocessfilestart to upload those files using the retrieved URIs, the best way to do this?
also what is the use of the progess parameter we get in the onprocessfileprogress(file,progress)? can it to be used to feedback the progress back to filepond component?
I think you can implement a custom server.process function and handle all upload logic in there, wether uploading to your local server of first uploading to a remote server it should give you enough control over the entire process.
https://pqina.nl/filepond/docs/patterns/api/server/#process-1
I'm working on a website made in react and all the changes I make in this site I always need to clean the AppData, does it always happen in React or do you have a way to bar it?
The browser may store cached files, cookies, as well as objects persisted with the Web Storage API within your AppData directory. You can clear this data by clearing your browsing data from within the browser.
I have 3 JSP views which all use the same JS file(say app.js).
My UI is on AngularJS which has a different controller for each of the JSP views and also has a custom service which shares information between the controllers. When I load the first JSP, its controller specified in the app.js file saves a value in the custom service. When I load the next JSP file, app.js gets reloaded and so the value that was saved in the custom service is lost.
Is there a way to not re-load JS files? Or is there a better way to go about this?
If you have no control on the server , you can save the data in browser's session storage object to keep data across requests and clean it, when you are done. https://developer.mozilla.org/en/docs/Web/API/Window/sessionStorage
// Save data to sessionStorage
sessionStorage.setItem('key', 'value');
// Get saved data from sessionStorage
var data = sessionStorage.getItem('key');
// Remove saved data from sessionStorage
sessionStorage.removeItem('key')
Javascript variable are not automatically preserved. When you open a new URL in your browser, you do not download again the JS files (they are cached), but they are loaded from scratch in that new page. That means that all previous values are lost, not by accident but by design.
You have different ways to deal with this persistence between page question. One way is server side by using the session:
the js part sends the value to save as parameters of a request
a spring-mvc controller puts that in the session
other views (jsp) or controllers (spring) access the saved value and pass it in the responses
An alternate way is the single page application pattern:
you only load one single full page from the server
the javascript then only sends requests that it processes directly to modify the DOM
Additionally, you could use Windows.sessionStorage to store data client side for the duration of a client session - credits should go to #AmitParashar for this one, more details in his answer.
You can of course mix the 2 patterns (this is commonly done in real world applications), but you must know that every page load will erase all client javascript state
A less common pattern (AFAIK) is to put the state in a cookie. That way it can be shared by the server and the client but:
it is limited to 4k size
you cannot use it for server side security, because it can too easily be forged
Background
I am attempting to develop an AngularJS app that is to be hosted as 'offline html' as part of the Resco MobileCRM software. This software provides offline access to CRM data via its own javascript libraries and this is working fine. I am also able to get a very simple angularjs application working, in terms of retrieving and displaying the data.
The AngularJS application is uploaded to the CRM using the Resco interface and then is download to each client machine via the resco software. The actual files end up in the users AppData folder on each client machine.
Problem
When I introduced routing to the angular app, either using ngRoute or ui-router, I am getting Access Denied errors. The resco software uses the underlying browser, which in my case is IE11. I have narrowed down the error to when angular is attempting to load the partials for the routes.
The offending code is below (angular.js v1.3.15 line 9805)
xhr.open(method, url, true);
From my research, it seems like IE believes I am attempting a CORS request, however I am just attempting to load a file from disk.
Various posts suggest I add the site to 'Trusted Sites', however I am not actually accessing another site. I also cannot host this on a web server as the whole purpose is to have this angular application accessible offline within the Resco MobileCRM application
I also get the same error if I navigate to the AppData folder and run the angularjs application directly from there (i.e. not in the resco application).
Other posts have suggested that I need to replace the XMLHttpRequest created by Angular with XDomainRequest but I am reluctant to change the angular library, especially if I don't understand why.
Would appreciate it if anyone could shed some light on why this is happening and how to fix it.
I have confirmed that this is not possible on any of the browsers. You cannot make xhr requests to files served locally from disk.
I got around this problem for directives by loading my 'partials' in to script tags and referring to the id of these script tags in the directives.
I did not try that with ui.router or ngRoute and instead opted to redesign my application in to a number of smaller application as they did not need to share any context