Question

我无法将我的chrome扩展程序填充到Gmail.com或Facebook.com上，我最好能说出来，有iframe的网站

我搜索了很多，并尝试了我发现的一切都没有成功。非常感谢帮助！代码如下

我的manifest.json

{
  "manifest_version": 2,
  "name": "NameDrop",
  "short_name": "NameDrop",
  "description": "Easily access NameDrop recordings in-page",
  "icons": {
    "128": "icon.png"
  },
  "version": "1.0.0",
  "author": "https://namedrop.io",
  // "createdBy": "Keshav Malani",
  "homepage_url": "https://namedrop.io",
  "browser_action": {
    "default_icon" : "icon.png",
    "default_title": "Access to NameDrop pronunciations"
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      // "run_at": "document_start", //If I enable appendChild fails
      "all_frames": true,
      "js": ["content_script.js"]
    }
  ],
  "web_accessible_resources": [
    "namedrop.png",
    "insert.js"
  ],
  "permissions": [
    "*://*/*",
    "tabs"
  ]
}

我的content_script.js文件：

//Insert the <script> tag for insert.js
var head1 = document.getElementsByTagName("head")[0];
fn1 = chrome.extension.getURL('insert.js');
var script1 = document.createElement('script');
script1.setAttribute("type", "application/javascript");
script1.src =  fn1 ;
head1.appendChild(script1);

//Identify the URL for image
var ndImgUrl = chrome.extension.getURL("namedrop.png");

//Insert the javascript code for playback on click
var head = document.getElementsByTagName("head")[0];
fn = "function playNDRecording(i){document.getElementById('ndlink'+i).play();} var ndImgUrl = '"+ndImgUrl+"';";
var script = document.createElement('script');
script.setAttribute("type", "application/javascript");
script.textContent = fn;
head.appendChild(script);

我的insert.js文件：

//Identify all a hrefs
arrayOfAs = document.getElementsByTagName("a");

// console.log(arrayOfAs);
console.log(arrayOfAs.length);

for (var i = 0; i < arrayOfAs.length; i++) {
    //Find indexes relevant to NameDrop links
    match1 = arrayOfAs[i].href.indexOf("namedrop.io");
    match2 = arrayOfAs[i].href.indexOf("nmdrp.me");

    if (match1 >= 0) {

      //Capture the username from link
      username = arrayOfAs[i].href.substr(match1+12,arrayOfAs[i].href.length);
      console.log("it is "+username);

      //Validation based on http://stackoverflow.com/questions/13840143/jquery-check-if-special-characters-exists-in-string
      if(/^[a-zA-Z0-9]*$/.test(username) == false || !username) {
        console.log("Not a NameDrop username");

      } else {

        //Determine height of the where the logo will be displayed
        //Based on http://stackoverflow.com/questions/526347/css-javascript-how-do-you-get-the-rendered-height-of-an-element
        var hght = arrayOfAs[i].offsetHeight;

        arrayOfAs[i].innerHTML += "<a href ='#' style='text-decoration:none;'><img src='"+ ndImgUrl + "'  height='" + hght +"' onclick='playNDRecording("+i+")'><audio id='ndlink"+i+"'><source src='https://namedrop.io/profile/audio/"+username+".mp3' type='audio/mpeg'><source src='https://namedrop.io/profile/audio/"+username+".wav' type='audio/wav'></audio></a>";
      }

      } else if (match2 >= 0) {

        //Capture the username from link
        username = arrayOfAs[i].href.substr(match2+9,arrayOfAs[i].href.length);
        console.log("it is "+username);

        //Validation based on http://stackoverflow.com/questions/13840143/jquery-check-if-special-characters-exists-in-string
        if(/^[a-zA-Z0-9]*$/.test(username) == false && !username ) {
          console.log("Not a NameDrop username");
        } else {

            //Determine height of the where the logo will be displayed
            //Based on http://stackoverflow.com/questions/526347/css-javascript-how-do-you-get-the-rendered-height-of-an-element
            var hght = arrayOfAs[i].offsetHeight;

            //Insert the logo etc.
            arrayOfAs[i].innerHTML += "<a href ='#' style='text-decoration:none;'><img src='"+ ndImgUrl + "'  height='" + hght +"' onclick='playNDRecording("+i+")'><audio id='ndlink"+i+"'><source src='https://namedrop.io/profile/audio/"+username+".mp3' type='audio/mpeg'><source src='https://namedrop.io/profile/audio/"+username+".wav' type='audio/wav'></audio></a>";
        }
      }
}

免责声明：这是一个新手，所以代码不是最好的

Chrome扩展程序可将图像插入Gmail电子邮件中

0 个答案: