Как читать локальный файл из webextension в Firefox?

Как указано в теме, мне нужно заполнить веб-форму, используя данные, доступные локально в качестве таблиц Excel. Я уже делаю это с помощью комбинации python и autohotkey, но я хочу иметь некоторый уровень управления JavaScript, чтобы правильно обрабатывать времена загрузки и условные обозначения. Как новичок в области веб-разработки, я сначала подумал, что могу просто иметь локальный iframe, контролирующий веб-сайт, на котором находится форма, но я обнаружил достаточно скоро, что вещь XSS, которая не допускает такого взлома. У меня нет доступа к серверу.Как читать локальный файл из webextension в Firefox?

Последняя итерация моего опыта связана с веб-расширениями Firefox, с которыми я надеялся открыть локальный файл (через виджет ввода файла html5), где ранее я написал свой код js для заполнения формы. Но, видимо, здесь есть и ограничения, и я не могу понять, какие документы я рассматриваю. Мой код в настоящее время так:

popup.html

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    </head> 
    <body> 
    <input type="file" id="liquida-file" name="liquida"> 
    <br> 
    <script src="background-script.js"></script> 
    </body> 
</html>

фон-script.js

function handleFiles() { 
    var fileList = this.files; /* now you can work with the file list */ 
    var myFile = fileList[0] 
    var reader = new FileReader(); 

    reader.onloadend = function(evt){ 
    if (evt.target.readyState == FileReader.DONE) { // DONE == 2 
      var filedata = evt.target.result; 
     console.error("Analyzing file data") 
     console.error(filedata) 
     var data = JSON.parse(filedata) 
     console.error(data) 
    } 
    }; 
    reader.readAsText(myFile) 
} 
var inputElement = document.getElementById("liquida-file"); 
inputElement.addEventListener("change", handleFiles, false);

Это работает как отдельный файл, но не в качестве всплывающего окна. html-файл моего веб-расширения. В этом случае ни одна из строк console.error не будет достигнута. Кстати, вот мой manifest.json:

manifest.json

{ 

    "manifest_version": 2, 
    "name": "My extension", 
    "version": "1.0", 

    "description": "Retrieve local data.", 
    "homepage_url": "http://Nonefornow", 
    "icons": { 
     "48": "icons/beautiful-icon.png" 
    }, 

    "permissions": [ 
     "activeTab" 
    ], 

    "browser_action": { 
     "browser_style": true, 
     "default_icon": "icons/icon.png", 
     "default_title": "My Ext", 
     "default_popup": "popup.html" 
    } 

}

Есть ли более простой способ сделать то, что я делаю? Я ожидал, что такая вещь станет общей потребностью, я ошибаюсь? И почему мой код не работает?

источник

2017-01-26 Tiago

-2

This works as a standalone file, but not as the popup.html file of my webextension.

Aha. Я бы проверил ...

источник

2017-01-29 08:45:01

Какие разрешения я должен установить, то? – Tiago

Эта проблема была указана в этом вопросе: Firefox WebExtensions, get local files content by path. The solution данного имеется следующее:

function readFile(_path, _cb){ 

    fetch(_path, {mode:'same-origin'}) // <-- important 

    .then(function(_res) { 
     return _res.blob(); 
    }) 

    .then(function(_blob) { 
     var reader = new FileReader(); 

     reader.addEventListener("loadend", function() { 
      _cb(this.result); 
     }); 

     reader.readAsText(_blob); 
    }); 
};

, но в этом растворе абсолютный путь должен быть передан функции, как здесь:

readFile('file:///home/saba/desktop/test.txt', function(_res){ 
    console.log(_res); // <-- result (file content) 
});

Если вы хотите загрузить файл с <input>, вы также должны пройти путь к файлу, потому что по соображениям безопасности вы не можете получить это из поля <input>.Мое решение было прочитать путь от входного текстового поля, что значительно снижает удобство использования

HTML

path: <input type="input" id="importFilePathInput" value="file://" /> 
<br /> 
file: <input type="file" id="importFileInput" />

Javascript

function importFromfile(){ 
    let filename = jQuery('#importFileInput').val().replace('C:\\fakepath\\', ''); 
    if (!filename) { 
    console.log('Select a filename'); 
    } else { 
    let path = jQuery('#importFilePathInput').val() + '/' + filename; 
    if (!path.startsWith('file://')) { 
     path = 'file://' + path; 
    } 
    fetch(path, {mode:'same-origin'}) 
     .then(function(result){ 
     return result.blob(); 
     }) 
     .then(function(blob){ 
     let reader = new FileReader(); 
     reader.addEventListener('loadend', function(){ 
      Model.save(JSON.parse(this.result)); // your function here 
     }); 
     reader.readAsText(blob); 
     }); 
    } 
}

Обратите внимание, что, к сожалению, это решение не работа на Firefox 57, давая ошибку:

TypeError: NetworkError when attempting to fetch resource.

источник

2017-12-27 13:20:34 beaver

Как читать локальный файл из webextension в Firefox?

ответ

Смежные вопросы