谷歌地图api不适用于谷歌浏览器扩展 [英] google maps api does not work in google chrome extension

问题描述

我正在使用JavaScript，HTML，CSS制作Google Chrome扩展程序。为此，我需要读取用户提供的地址的经度和纬度。在测试我的扩展时，我总是收到错误消息。

这是我的js代码

  result：{
 data：函数（from，to，hrs，mins）{
 fromaddress = from; 
 toaddress = to; 
小时= hrs; 
分钟=分钟; 
 
 View.result.readLatLng（）; 
}，
 
 readLatLng：function（）{
 // var addressone = document.getElementById（addressone）。value; 
 geocoder = new google.maps.Geocoder（）; 
 geocoder.geocode（{'address'：fromaddress}，function（results，status）{
 if（status == google.maps.GeocoderStatus.OK）{
 var latitude = results [ 0] .geometry.location.latitude; 
 var longitude = results [0] .geometry.location.longitude; 
 console.log（'lat：'+ latitude +'，lng：'+ longitude） ; 
} else {
 alert（由于以下原因，Geocode不成功：+ status; 
} 
}）; 
 
 
 $ / code $ / pre 
 
 
这里是我的manifest.json文件
  {
name：Name，
version：1.0，
 manifest_version：2，
background：{
scripts：[
js / result.js，
js / script.js
 
 
description：Desc，
browser_action：{
default_icon：images / icon.png，
 default_title：Title，
default_popup：html / popup.html
}，
permissions：[
http：// * /， 
https://maps.google.com/*，
https://maps.googleapis.com/*，
http：// localhost / *， 
geolocation
]，
content_security_policy：script-src'self'https://maps.googleapis.com https://maps.gstatic.com; object-src 'self'
} 
  
请问我该如何解决这个问题？
解决方案
答案是 in addendum  Marcelo的答案，因为我还没有评论和我的编辑被拒绝。
 
 
 
您可以通过更改content_security_policy通过添加'unsafe-eval'属性，比如
 content_security_policy：script-src'self''unsafe-eval'https：//; object-src'self'
  
 讨论Chrome扩展内容安全政策 
 
 
 
正如Marcelo的回答，谷歌地图API源代码中的街景代码使用document.write（），这是一种类似eval的构造.Eval本质上是不安全的，因此希望Google可以通过他们的Maps API源代码解决这个问题。
 
 
 
我不确定这是否会影响向Chrome商店提交扩展程序，但我已成功将Google Maps API用于本地解包扩展。
 
I am making a google chrome extension using JavaScript, HTML, CSS. For this I need to read longitude and latitude of an address provided by a user. While testing my extension I am keep getting below error



Here is my js code
result: {
            data: function (from, to, hrs, mins) {
                fromaddress     = from;
                toaddress   = to;
                hours       = hrs;
                minutes     = mins;

                View.result.readLatLng();
            },

            readLatLng: function () {
                //var addressone = document.getElementById("addressone").value;
                geocoder    = new google.maps.Geocoder();
                geocoder.geocode( { 'address': fromaddress}, function(results, status) {
                  if (status == google.maps.GeocoderStatus.OK) {
                    var latitude = results[0].geometry.location.latitude;
                    var longitude = results[0].geometry.location.longitude;
                    console.log('lat: ' + latitude + ', lng: ' + longitude);
                  } else {
                    alert("Geocode was not successful for the following reason: " + status);
                  }
                });
            }
        }
and here is my manifest.json file
{
  "name": "Name",
  "version": "1.0",
  "manifest_version": 2,
  "background": { 
    "scripts": [
      "js/result.js",
      "js/script.js"
    ] 
  },
  "description": "Desc",
  "browser_action": {
    "default_icon": "images/icon.png",
    "default_title": "Title",
    "default_popup": "html/popup.html"
  },
  "permissions": [ 
    "http://*/",
    "https://maps.google.com/*",
    "https://maps.googleapis.com/*",
    "http://localhost/*",
    "geolocation"
  ],
  "content_security_policy": "script-src 'self' https://maps.googleapis.com https://maps.gstatic.com; object-src 'self'"
}
Please help me how can I solve this?
解决方案
This is answer is in addendum to Marcelo's answer as I cannot yet comment and my edit was rejected.

You can circumvent the issue by changing the "content_security_policy" key in your manifest file by adding the 'unsafe-eval' attribute such as
"content_security_policy": "script-src 'self' 'unsafe-eval' https://; object-src 'self'"
Discussion of Chrome Extension Content Security Policy

As mentioned in comments on Marcelo's answer, the Streetview code in the Google Maps API source makes use of document.write(), an eval-like construct. Eval is inherently unsafe so hopefully Google will address this issue with their Maps API source code.

I'm not sure how, if at all, this might affect submitting an extension to the Chrome Store. I have, however, successfully used the Google Maps API in a local unpacked extension.

                        
这篇关于谷歌地图api不适用于谷歌浏览器扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！