Есть ли способ связать html-файл в другом каталоге при создании окна из background.js?
Я нахожусь на ранней стадии создания приложения Chrome, которое я планирую развернуть в интернет-магазине Chrome. У меня есть действительный манифест, файлы index.html, index.css, properties.css и background.js в папке приложения. В файле background.js у меня есть «обработчик событий», который ожидает запуска приложения. Затем он создает окно с телом index.html. Проблема в том, что файл background.js находится в папке, отличной от папки index.html. Вот иерархия папки моего приложения:
My app Name
images
My app icon.png
index
index.html
index.css
scripts
background.js
styles
properties.css
manifest.json
Всякий раз, когда я пытаюсь создать ссылку на файл index.html, это не удается. Когда приложение запускается, оно просто создает пустое окно. Я храню их в отдельных папках для организации, и если нет возможности сделать это, я просто соберу их вместе.
- Проверил консоль на ошибки. Их нет.
- Я пробовал метод html: ../index/index.html. Это не работает (о боже).
ПРИМЕЧАНИЕ: Я планирую добавить блок заголовка, который будет действовать как строка заголовка, потому что при создании окна я отключу блок по умолчанию.
фон.js
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create("../index/index.html", {
id: 'main',
bounds: { width: 620, height: 500 }
});
});
manifest.json
{
"manifest_version": 2,
"name": "UI Button Designer",
"version": "1",
"icons": {
"128": "images/icon_128.png"
},
"permissions": [],
"app": {
"background": {
"scripts": ["scripts/background.js"]
}
},
"minimum_chrome_version": "28"
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<link rel = "stylesheet" type = "text/css" href = "../styles/properties.css">
<link rel = "stylesheet" type = "text/css" href = "index.css">
</head>
<body>
<div id = "container">
<div id = "header"></div>
</div>
</body>
</html>
index.css
#container {
width: 100%;
min-width: 100%;
max-width: 100%;
height: 100%;
min-height: 100%;
max-height: 100%;
margin: 0;
padding: 0;
border: none;
}
#header {
width: 100%;
height: 10%;
background-color: #fbbc05;
}
Я должен увидеть полосу, которая составляет 10% от высоты окна просмотра, но я просто вижу пустое окно.
@wOxxOm К сожалению, это не работает :(
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я думаю, вы можете просто заменить это:
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create("../index/index.html", {
id: 'main',
bounds: { width: 620, height: 500 }
});
});
с участием:
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create("index/index.html", {
id: 'main',
bounds: { width: 620, height: 500 }
});
});
В основном вам не нужны эти ../ до index/index.html
Это уже было предложено, и, похоже, это не работает :( Спасибо, что нашли время, чтобы ответить на мой вопрос, это много значит :)
Рад слышать
Почему бы вам просто не использовать абсолютный путь от корня расширения, где находится manifest.json? Например
"/index/index.html"