Фрейм доступа DOM chrome расширение - PullRequest
0 голосов
/ 26 мая 2020

Я делаю расширение для получения выделенного текста с веб-сайтов и перетаскивания его в мой фрейм, который я открываю с помощью всплывающей кнопки. У меня возникают проблемы, когда я хочу получить свою DropZone из фрейма. html уже введен во фрейм.

Manifest. json выглядит так:

"content_scripts": [{
"js": ["jquery-3.5.1.min.js", "contentscript.js"],
"matches": ["*://*/*","<all_urls>", "http://*/*","https://*/*","ftp://*/*","file://*/*"],
"all_frames": true
}],
"web_accessible_resources": [
    "frame.html"
],
"background": {
    "scripts": ["jquery-3.5.1.min.js","background.js"]
},
"browser_action": {
    "default_icon": "icon16.png",
    "default_popup": "popup.html"
   },
"permissions": [
    "tabs", "<all_urls>","activeTab"
],

ContentScript. js выглядит так :

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
    if( request.todo == "showFrame"){
        var iframe = document.createElement('iframe');
        // Declared at web_accessible_resources in manifest.json
        iframe.src = chrome.runtime.getURL('frame.html');
        // Some styles for sidebar
        iframe.style.cssText = 'position:fixed;top:0;left:0;display:block;' +
                               'width:300px;height:100%;z-index:1000;';
        document.body.appendChild(iframe);
    }
}); 
//DnD
window.addEventListener('mouseup', wordSelected);
//Get selected text
function wordSelected(){
    let selectedText = window.getSelection().toString();
    if(selectedText.length > 0){
        var draggable = document.createElement('div')
        draggable.setAttribute('id', 'ghost');
        draggable.setAttribute('draggable', 'true');
        draggable.innerHTML += selectedText;
        console.log(draggable);
        var message = {
            text: selectedText
        }
        chrome.runtime.sendMessage(message);
    };
}
//triying to get iframe.html no way
chrome.runtime.sendMessage({cmd: "read_file"}, function(html){
    myDiv = $("#dropTarget").html(html);
    console.log(typeof html)
});

Получаю: enter image description here Фон. js выглядит так:

console.log("Bg Running");
chrome.runtime.onMessage.addListener(receiver);
//receive selected text
function receiver(request, sender, sendResponse){
    console.log(request)
}
//listen request 
chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    if(request.cmd == "read_file") {
        $.ajax({
            url: chrome.extension.getURL("frame.html"),
            dataType: "html",
            success: sendResponse
        });
       return true;
    }
})

Думаю скорее всего, я чего-то не понимаю в том, как добраться до DOM фрейма

Заранее благодарим за любые отзывы или помощь.

...