Question

我有一个网站，我已将其添加为Google Chrome中的扩展程序。我需要的是我必须从扩展程序访问服务器文件。我需要的是，无论服务器文件输出什么，我都需要访问扩展中的输出。这是我的manifest.json：

{
    "name": "Calpine Extension",
    "version": "1.0",
    "description": "Log on to calpinemate",
    "manifest_version": 2,
    "browser_action": {
        "default_icon": "icon_128.png"
    },
    "background": {
        "persistent": false,
        "scripts": ["background.js"]
    },

    "browser_action": {
        "default_title": "Test Extension",
        "default_icon": "calpine_not_logged_in.png"
    },

    "externally_connectable": {
        "matches": ["http://calpinemate.com/"]
    }
}

这是我的background.js

chrome.browserAction.onClicked.addListener(function (tab) {
    chrome.tabs.create({ "url": "http://calpinemate.com" });
});

现在我需要的是我有一个输出1的服务器文件（index.php）。现在我需要的是我希望在扩展中得到这个1。这就是我希望扩展输出的文件输出。我怎样才能做到这一点？这是我的index.php

<?php echo 1 ;?>

我试过了。但它仍然只在Onclick事件上工作。请检查我的代码。这是我的background.js

   function getGmailUrl() {
   return "http://calpinemate.com/";
   }
   function isGmailUrl(url) {

      return url.indexOf(getGmailUrl()) == 0;
      }
   chrome.browserAction.onClicked.addListener(gotopage);

      function gotopage(){    
      chrome.tabs.query({
       url: "http://calpinemate.com/*",
      currentWindow: true
     }, function(tabs) {
    if (tabs.length > 0) {
        var tab = tabs[0];
        console.log("Found (at least one) Gmail tab: " + tab.url);
        console.log("Focusing and refreshing count...");
        chrome.tabs.update(tab.id, { active: true });
         updateIcon();
    } else {
        console.log("Could not find Gmail tab. Creating one...");
        chrome.tabs.create({ url: getGmailUrl() });
         updateIcon();
    }
      });
    }

        if (chrome.runtime && chrome.runtime.onStartup) {
      chrome.runtime.onStartup.addListener(function() {

       updateIcon();
      });
      } else {
        chrome.windows.onCreated.addListener(function() {

        updateIcon();
           });
         }
     function updateIcon(){

   var req = new XMLHttpRequest();
     req.addEventListener("readystatechange", function() {
         if (req.readyState == 4) {
    if (req.status == 200) {
        localStorage.item=req.responseText;
        //alert(localStorage.item);
        if(localStorage.item==1){
          chrome.browserAction.setIcon({path:"calpine_logged_in.png"});
          chrome.browserAction.setBadgeBackgroundColor({color:[190, 190, 190, 230]});
          chrome.browserAction.setBadgeText({text:""});   
        }
        else{
        chrome.browserAction.setIcon({path:"calpine_not_logged_in.png"});
        chrome.browserAction.setBadgeBackgroundColor({color:[190, 190, 190, 230]});
        chrome.browserAction.setBadgeText({text:""}); 
        }
        // We received the data
        //alert("Data: " + req.responseText);
      } else {
        // Handle the error
        alert("ERROR: status code " + req.status);
      }
    }
   });
       req.open("GET", "http://blog.calpinetech.com/test/index.php", true);
      req.send(null);

}

Answer 1

首先请求访问您服务器的权限：

// In manifest.json
...
permissions: [
   ...
   "*://calpinemate.com/index.php"
],

然后使用AJAX访问数据：

var req = new XMLHttpRequest();
req.addEventListener("readystatechange", function() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            // We received the data
            alert("Data: " + req.responseText);
        } else {
            // Handle the error
            alert("ERROR: status code " + req.status);
        }
    }
});
req.open("GET", "https://calpinemate.com/index.php", true);
req.send(null);

从Chrome扩展程序访问API

1 个答案: