My code:
<script type="text/javascript">
var req = new XMLHttpRequest();
req.open("GET","http://surfkid.redio.de/link.php");
req.send(null);
document.write(req.responseText);
</script>
{
"name": "My First Extension",
"version": "1.0",
"description": "The first extension that I made.",
"browser_action": {
"default_icon": "android.jpg",
"popup": "link.html"
},
"permissions": [
"http://surfkid.redio.de/"
]
}
When i press the icon no text appears. Do anybody knows why?
I think it's because you're not using the onreadystatechange-event. Because the connection is asynchronous the response is null just after sending it.
You could do it like this:
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://surfkid.redio.de/link.php", true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
document.write(xhr.responseText);
}
}
xhr.send();
Related
So as you already read in the title my problem hast todo with popup.html
I have no idea what the problem is please help me!
this is the error code
Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist.
Stacktrace
popup.html:0 (Anonyme Funktion)
popup.html is:
<!DOCTYPE html>
<html>
<head>
<style>
#popup-container {
width: 600px;
height: 800px;
}
</style>
<title>DissBott</title>
</head>
<body>
<h1>ChatGPT Extension</h1>
<p>input</p>
<textarea id="input"></textarea>
<br>
<button id="submitButton">Submit</button>
<button id="clearButton">Clear</button>
<br>
<p>Response:</p>
<p id="response"></p>
<script src="popup.js"></script>
</body>
</html>
popup.js is:
// Popup Script
//background.js
const submitButton = document.getElementById("submitButton");
const clearButton = document.getElementById("clearButton");
const promptTextarea = document.getElementById("prompt");
const responseParagraph = document.getElementById("response");
submitButton.addEventListener("click", function() {
// onClick's logic below:
// Get the prompt from the textarea
const prompt = input;
// Send the message to the background script
chrome.runtime.sendMessage({
message: "clicked_browser_action",
prompt: prompt
}, function(response) {
// Display the response
responseParagraph.innerText = response;
});
});
clearButton.addEventListener("click", function() {
// Clear the textarea
promptTextarea.value = "";
// Clear the response
responseParagraph.innerText = "";
});
my manifest.json
{
"manifest_version": 3,
"name": "DissBot",
"description": "This is an extension that uses the ChatGPT model.",
"version": "1.0",
"host_permissions": [
"https://api.openai.com/"
],
"action": {
"default_popup": "popup.html"
},
"background": {
"script": ["bg.js"]
}
}
I tried to make a chrome extension it didnt work.
Here is a sample of chrome.runtime.sendMessage.
manifest.json
{
"name": "hoge",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"action": {
"default_popup": "popup.html"
}
}
popup.html
<html>
<body>
<button id="send">Send</button>
<script src="popup.js"></script>
</body>
</html>
popup.js
document.getElementById("send").onclick = () => {
chrome.runtime.sendMessage("send", (respose) => {
console.log(respose);
});
}
background.js
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
console.log(message);
sendResponse("response");
return true;
});
I am creating a chrome extension which extracts the inner text of h2> from the page in which the user is browsing. Although I learned about content scripts and have used it but it is not working I don't know where is the problem. If anyone could help me that would be greatly appreciated.
This is the js code:
document.addEventListener('DOMContentLoaded', function() {
var link = document.getElementById('button');
link.addEventListener('click', function() {
updateresult();
});
});
function updateresult() {
var i;
var x =document.getElementsByTagName("h2");
for(i=0; i< x.length ; i++)
{
document.getElementById("result").innerHTML = (x[i].innerHTML + "\n");
}}
This is the manifest file which I am using:
{
"manifest_version": 2,
"name": "Header Extractor",
"description": "Extension to search header",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"16": "icon.png",
"48": "icon.png",
"128": "icon.png",
"default_popup":"popup.html",
"default_title": "Open And Search headers"
},
"permissions": [
"storage",
"activeTab" ,"tabs"
],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": [ "popup.js"],
"run_at": "document_end"
}
]
}
Have you already created a result div to paste your results in?
Also your current function only returns one h2 value. Let's use concat to output them all together.
function updateresult() {
var i;
var x = document.getElementsByTagName("h2");
var string = "";
for(i=0; i<x.length; i++)
{
string.concat(x[i].innerText + "\n");
}
document.getElementById("result").innerText = string;
}
As a side note, we use innerText instead.
I'm doing chrome extension. On click button in popup.html a call scote to call alarm ffrom background.js.
popup.js:
document.addEventListener('DOMContentLoaded', function() {
var checkPageButton = document.getElementById('checkPage');
checkPageButton.addEventListener('click', function() {
//call alarm
chrome.runtime.sendMessage({greeting: "alert"}, function(response) {
//NONE response, why?
console.log(response.farewell);
alert("response:" + response.farewell);
});
document.getElementById('checkPage').innerHTML = "SET";
}, false);
}, false);
background.js:
//alarm
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.greeting == "alert"){
alert("alert alarm");
sendResponse({farewell: "goodbye"});
}
}
);
manifest.json
{
"name": "AlarmText",
"version": "0.0.1",
"manifest_version": 2,
"permissions": ["alarms", "http://my-url.com"],
"icons": { "128": "icons/icon128.png",
"64": "icons/icon64.png",
"32": "icons/icon32.png" },
"browser_action": {
"default_title": "Alarm test",
"default_popup": "popup.html"
},
"background": {
"scripts": ["background.js"],
"persistent": true
}
}
popup.html
<!doctype html>
<html>
<head>
<title>popup</title>
<script src="popup.js"></script>
</head>
<body>
<div id="out">???</div>
<button id="checkPage">Refresh</button>
</body>
</html>
What is wrong? In call alarm: chrome.runtime.sendMessage({greeting: "alert"}, function(response) is not response
My aim is to search for a div by id if it exists in all languages my site supports.
manifest.json
{
"manifest_version": 2,
"name": "Hello World!",
"description": "This extension is to check if link is not visible when it should not :)",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"content_scripts": [ {
"js": [ "jquery-1.11.1.min.js"],
"matches": [ "http://*/*", "https://*/*"]
}],
"permissions": [
"tabs",
"http://*/*",
"https://*/*"
]
}
popup.html -
<html>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<style>
table{background:#CCC;border:1px solid #000;}
table td{padding:15px;border:1px solid #DDD;}
</style>
<body>
<input type="hidden" id="currentLink"/>
<hr />
Checking ...
<div id="dynamictable"></div>
<script type="text/javascript" src="currentUrl.js"></script>
</body>
</html>
currentUrl.js -
chrome.tabs.getSelected(null, function(tab) {
var currentTab = (tab.url);
var languages = [ "en", "fr" ];
$('#dynamictable').append('<table></table>');
var table = $('#dynamictable').children();
var i;
for (i = 0; i < locales.length; ++i) {
chrome.tabs.update(tab.id, {active:true, url: currentTab + "?languageParam=" + languages[i]});
var query = document.querySelector("div#header");
if (query) {
alert("This page has a friendly div");
}
table.append("<tr><td>" + languages[i] + "</td><td>" + "</td></tr>");
}
});
In above query is not coming. How can I parse the DOM after chrome.tabs.update ?
Have you tried using a callback?
The api defines the function as chrome.tabs.update(integer tabId, object updateProperties, function callback).
Perhaps you could change
chrome.tabs.update(tab.id, {active:true, url: currentTab + "?languageParam=" + languages[i]});
for
chrome.tabs.update(
tab.id,
{active:true, url: currentTab + "?languageParam=" + languages[i]},
function() { // this is the callback you may want to use.
var query = document.querySelector("div#header");
if (query) {
alert("This page has a friendly div");
}
}
);
This may not work as-is, but I hope the idea is clear.
I am having problems with my google extension, I have followed what I believe is proper for sending information to a background page, but when I try to run my extension I am hit with "Uncaught TypeError: Object [object DOMWindow] has no method 'closer'" Does anyone know what is happening and why?
popup.html
var i = 0;
function start(){
var bg = chrome.extension.getBackgroundPage();
bg.closer(i); //chrome.extension.sendRequest({});
}
function add(){
i++;
document.getElementById('box').value=i;
}
function sub(){
i--;
document.getElementById('box').value=i;
}
background.html
var ctr = 0;
function closer(int i){
var t=setTimeout("close()",i*500);
}
function close(){
chrome.tabs.getSelected(null, function(tab) {
chrome.tabs.remove(tab.id, function() { });
});
}
manifest.json
{
"name": "Hello World!",
"version": "1.0",
"description": "My first Chrome extension.",
"permissions": ["tabs", "background"],
"background_page": "background.html",
"browser_action": {
"default_icon": "icon.png",
"popup": "popup.html"
}
}
you cannot just send message to that bg variable.
There is a special approach to send messages to bg, please read up on sendRequest() etc.
http://code.google.com/chrome/extensions/extension.html#method-sendRequest