@Vladislav6

Как включить геолокацию для расширения?

Здравствуйте дамы и господа.

У меня встал вопрос: я сделал небольшое приложение для определения погоды по геолокации в реальном времени (обновление по минуте). Обновление идет через API ну и через геолокацию в браузере. Все работает замечательно, если открывать как страницу в браузере.

Теперь я хочу сделать небольшое расширение для Chrome, немного изменив вид, но функционал оставить точно тем же. Вопрос, как мне это сделать? Тот же код не работает, хотя в фале манифеста все подключено верно. Код я ниже предоставлю, только без ключа API.

П.С. Появляется предупреждение: Is the 'geolocation' permission appropriate? See https://developer.chrome.com/extensions/manifest.h....
П.С.С. если включить разрешение на геолокацию для всех сайтов в хроме, это уведомление есть, если отключить для всех сайтов - оно пропадает.

Ссылка 404)

Код разметки, JS и JSON ниже, если вдруг надо CSS, то скину к комментарию. Единственное что я убрал window.listener(load), но ничего и не поменялось в работе.

Помогите кто чем может, в чем прикол?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
    <title>Weather App</title>
</head>
<body>
    
    <div class="container">
        
        <div class="location"></div>

        <div class="city-name"></div>

        <div class="icon">
            <img class="weater-icon" src="" alt="">
        </div>

        <div class="temperature"></div>

        <div class="weater-type"></div>
    </div>

    <script src="main.js"></script>
</body>
</html>


let long;
    let lat;
    let myLocation = document.querySelector('.location');
    let cityName = document.querySelector('.city-name');
    let iconSet = document.querySelector('.icon');
    let temperature = document.querySelector('.temperature');
    let weaterType = document.querySelector('.weater-type');
    
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function(position) {
            long = position.coords.longitude;
            lat = position.coords.latitude;
            const api = `https://api.weatherbit.io/v2.0/current?lat=${lat}&lon=${long}&key=здесь_должен_быть_ключ&include=minutely`;
            
            fetch(api)
                .then(respons => {
                    return respons.json();
                })
                .then(data => {
                    console.log(data);
                    const {temp, timezone, city_name } = data.data[0];
                    const { description, icon } = data.data[0].weather;
                    //set dom elements from API
                    cityName.textContent = city_name;
                    iconSet.innerHTML = `<img class="weater-icon" src="https://www.weatherbit.io/static/img/icons/${icon}.png" alt="">`;
                    temperature.textContent = temp;
                    myLocation.textContent = timezone;
                    weaterType.textContent = description;
                })
        });
    }


{
	"manifest_version": 2,
	"name": "Checking Weather",
	"description": "This plugin for checking your local weather",
	"version": "1.0.1",
	"icons": {"128": "cloudy.png"},
	"browser_action": {
		"default_icon": "cloudy.png",
		"default_popup": "index.html" 
	},

    "content_scripts": [
        {
            "matches": [ "*://*/*" ],
            "js": [ "main.js" ]
        }
    ]


}
  • Вопрос задан
  • 56 просмотров
Решения вопроса 1
@Vladislav6 Автор вопроса
Нашел решение, нужно было выдать отдельно разрешение в манифесте, тут в статье есть: https://developer.chrome.com/docs/extensions/mv3/d...

Проще говоря, добавить следующее:
"permissions": [
		"geolocation"
	  ]
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@66demon666
По навыкам джун - по факту безработный
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы