Data의 HTML 파일에서 Lib의 JavaScript 파일을 참조하는 방법은 무엇입니까?

Question

나는 Mozilla's Add-on Builder을 시도하기로 결정했습니다. 내 디렉토리 구조는 다음과 같은 :

문제는 필요 popup.html 파일이 stackapi.js를 참조하는 것입니다. 그러나 나는 그걸하는 법을 전혀 모른다.

var data = require("self").data; 
var url_of_popup = data.url("popup.html"); 

이 lib에 스크립트 데이터에서 데이터 파일에 액세스 할 수 있습니다 : 모질라 문서를 통해 찾고, 반대 할 수있는 방법이 될 것 같습니다. 그러나 나는 그 반대를 할 필요가있다.

Answer 1

추가 기능 SDK로 작성된 추가 기능에서 (빌더는 SDK의 웹 인터페이스 일뿐입니다) 웹 페이지는 확장 모듈을 직접 액세스 할 수 없으며 필요한 권한이 없습니다. 웹 페이지에서 JavaScript 파일을 포함하기 만하면 파일을 data 디렉토리에 저장해야합니다. 그러나 특별한 권한은 없습니다 (예 : require()).

당신은 어떻게 popup.html을 사용하고 있는지 말하지 않지만 나는 그것이 panel이라고 생각합니다. 해당 페이지가 애드온과 통신하도록하려면 컨텐츠 스크립트를 사용해야합니다. 내용 스크립트 파일을 data 디렉토리에 넣고 contentScriptFile 매개 변수를 통해 패널에 지정하십시오. documentation on content scripts을 참조하십시오. 콘텐츠 스크립트는 self.postMessage()을 사용하여 메시지를 내선 번호로 보낼 수 있으며, 내선 번호는 필요한 작업을 수행하고 그때 메시지를 보낼 수 있습니다.

당신은 /data 폴더로부터 이동하여 다시 같은 그래서 /lib 폴더 아래 stackapi.js 파일의 URL을 얻을 수 있습니다

Answer 2

: 스크립트를 부착 할 때

var url=require("sdk/self").data.url("../lib/stackapi.js"); 

는 그 다음 contentScriptFile 매개 변수에 해당 자원의 URL을 사용하는 것 나는 popup.html이 될 것이라고 생각합니다.

exports 개체에 대한 참조를 추가해야하는지 결정하려면 현재 어떤 환경인지 확인하고 추가 기능 내에서 액세스 할 수있게해야합니다.

if(typeof(exports)!="undefined"){ 
    exports.something=function(){...}; 
} 

Answer 3

동일한 시나리오를 진행해야했지만 jongo45의 솔루션은 더 이상 작동하지 않습니다. 어떻게 든 나를 위해 일한 해결책을 찾았습니다. 아래에 게시하면 도움이 필요한 사람을 도울 수 있습니다.

아래 코드는 "lib/subdir"아래의 모든 파일 목록을 얻습니다.

const fileIO = require("sdk/io/file");  
const fspath = require("sdk/fs/path"); 
const {Cc, Ci} = require("chrome"); 

const currDir = Cc["@mozilla.org/file/directory_service;1"] 
      .getService(Ci.nsIDirectoryServiceProvider) 
      .getFile("CurWorkD", {}).path; 

const listOfFiles = fileIO.list(fspath.resolve(currDir,'lib/subdir'));