URL pattern for real website - google-chrome-extension

I use chrome.tabs.executeScript to inject script to sites, but I don't want to inject to invalid tabs, such as: chrome://extension, newtab, blank tab etc. Which pattern I can choose in
chrome.tabs.query({url:"????"}, function(tabs){
});
Can I use url:"*://*"? It still match to chrome://extension.

Related

Get Tabs URL, copy to new tab, change something in domain

Basically I just want to check links across different environments and thats just a different domain name. So basically I have my extension so far with buttons for each one but am having trouble getting anything to happen. Tried in b ackground.js as I thought that was the only place to access tab?
Tried this and some other variations but yeah this is very new to me so forgive my ignorance. I know javascript well enough but this is taking a bit to adjust.
let dev = document.getElementByID("dev");
console.log(dev);
dev.onclick = function(element) {
chrome.tabs.query({currentWindow: true, active: true}, function (tab) {
chrome.tabs.update(tab.id, {url: "www.google.com"});
});
1) An URL must start with a scheme: https://www.google.com. 2) Make sure to read about the extensions overview::architecture - the popup is a separate page with its own window, URL, and devtools which you can access by rightclicking the popup, then clicking Inspect. 3) Hint: no need to use tabs.query to change the active tab - simply omit tab.id, from tabs.update as it's an optional parameter. – wOxxOm
Thanks that helped a lot!

Difference between the <a> tag and get request

I have a perhaps simple question. What would be the difference between an <a> tag and a normal GET request with any element. I know the <a> tag automatically sends you to the url specified in its href attribute. So I assume that a Get request does something similar in it's success callback (as demonstrated below)
But let's say that I also want to send some information along with a normal get request when a for example <span> element is clicked on so I write:
$('span').click(() => {
$.ajax({
url: '/someurl',
type: 'GET',
data: {
title: someTitle,
email: someEmail
},
success: (data) => {
window.location = '/someurl';
}
});
});
Is there any way to achieve this with an <a> tag? Sending information to the server so it's available in req.query.title and req.query.email ?
Doing the ajax request above will run my app.get('/someurl',(req,res)=>{})twice because I am sending a GET request to send the data (title and email) and then I am making another GET request when I write window.location = '/someurl' How can I redo this so that it only sends the GET request ONCE but also allows for the sending and storing information to the req object AND ensures that the browser is now displaying /someurl.
Just create the appropriate query string in the URL you put in the href of the <a> tag and it will work just like your ajax call. Suppose someTitle has the value of "The Hobbit" and someEmail has the value of foo#whatever.com, then you can construct that URL like this:
Click Me
A number of non-letter characters have to be escaped in URLs. In the above URL, the space is replaced with %20 and the # with %40. In your particular example, you could open the network tab in the chrome debugger and see the EXACT URL that Chrome was sending for your ajax call, copy that to the clipboard and insert it into your <a> tag.
Here's a table that shows what characters have to be replaced in a query string component (the part after & or after =):
I'm just wondering then, aside from semantic reasons, is there any other advantages to using an a tag instead of anything else?
<a> tags are understood by all sorts of machines that may read your page such as screen readers for the disabled or crawlers indexing your site. In addition, they work automatically with browser keyboard support, Ctrl-click to open a new tab. Whereas a piece of Javascript may not automatically support any of that functionality. So, basically, if the <a> tag can do what you need it is widely preferred because it has so much other default functionality that can be necessary or handy for users.
Hello

ExecuteScript in a random tab that is not part of the chrome extension send result back to background javascript

I would like to check the html of an element of a
chrome.tabs.executeScript(tab_id,{code: 'sendRequestToBackground(document.getElementById('important_val').innerHTML); '},
function(){
});
I want to be able to get this value from my background script, I saw a lot of examples with chrome.extension.sendRequest and chrome.extension.onRequest.addListener because all the examples is for working from the extension popup.html to background script and vice-versa.
But I open a brand new tab, change the URL, and I want to get a value of a field that (which btw is generated via Javascript) belongs to this random tab.
Is it possible to do that?
Thanks!
If you want to inject your code to a random tab, do this:
Be sure to have permissions to "tabs" and "<all_urls>" in your manifest.json
Get all tabs using chrome.tabs.query
Pick random tab using Math.random()
Inject the code using chrome.tabs.executeScript
In the incjected code call chrome.extension.sendRequest
On the background page receive the message using chrome.extension.onRequest

Google Chrome Extension, Property Collector and URL Reconstruct

New to Chrome programming, but am more or less familiar with Javascript.
Goal:
A Chrome add-on that will allow me to:
1) Right-click on an link
2) then add a some more characters to that link
3) then reload the page with the new constructed URL.
EX:
A. Object has a link : www.address.com/34922
B. User righ-clicks on that object (Chrome's menu appears [which I know how to mod]), a menu option appears 'reconstruct rul.'
C. The add-on adds '/subfolderA' to the above mentioned url.
D. Page reloads with the following URL: www.address.com/34922/subfolderA
Thanks,
Steve
Use the chrome.contextMenus API, more specifically the create method.
// Add this to the background page
chrome.contextMenus.create({
title: 'Open this link plus /subfolderA',
contexts: ['link'],
onclick: function(info, tab) {
var linkUrl = info.linkUrl;
// Some logic, eg adding a fragment:
linkUrl += '/subfolderA';
// Replace URL on current tab
chrome.tabs.update(tab.id, {url: linkUrl});
},
// The following array should consist of valid match patterns
// This context menu item will only be visible on matching links
targetUrlPatterns: ['http://adress.com/*']
});
Relevant documentation
Used methods:
chrome.contextMenus API
chrome.tabs.create(<object createProperties>)
The onClickData type. This is just a plain JavaScript object. However, Chrome will validate this object, and throw an error when an unknown format (e.g. wrong property) is used.
chrome.tabs API
chrome.tabs.update(<integer tabId>, <object updateProperties>)
Further reading:
Background pages
Manifest file
Match patterns

Can I link to an HTML file in my project from a UIWebView?

If I load a string containing HTML into a UIWebView, and that string contains objects (hyperlinks) that are relative to that string, i.e. , where there is some object with id "something," then the link works - click on it and the web view jumps to the referenced object.
What I want is to get navigation to a different file in my project, in other words as though the path to the different file were a URL.
I have found that if the href IS a URL, such as href="http://www.amazon.com", then the link works.
If I put the name of a file, OR the [NSBundle mainBundle] pathForResource: ] of that name, in the href, then the link does not work.
Is there some way I can generate the equivalent of a URL pointing to an HTML file that is in the project, so that an can link to that HTML file?
I found a solution at this link:
How to use Javascript to communicate with Objective-c code?
Essentially, the solution is to implement the UIWebViewDelegate protocol's shouldStartLoadWithRequest method, and "trap" a particular value of scheme. So my links, instead of saying something like:
<a href="http://someplace.location">
are like:
<a href="mylink://#filename.ext">
By catching attempts to load anything with scheme "mylink," I can use:
[[request URL] fragment]
within shouldStartLoadWithRequest, and get the filename.ext. I then release my previous UIWebView, load in the contents of the specified file, and make that the contents of a new UIWebView. The effect is that the links work with normal appearance, even though they are being implemented with my code. I return NO because I don't want the usual loading to take place. If the scheme is NOT mylink, I can return YES to allow normal operation.
Regrettably, I still have no way to jump TO a fragment within a web view. In linking to a real URL, you can say something like "www.foo.org#page50" and jump straight to wherever an object on the new page has an id of "page50." With my method, I can only go to the top of the page.
This is also not going to give me a "go-back" function unless I record the filenames and implement it myself.

Resources