如何为免费融合表配置客户端 ID答案

【问题标题】：how to configure the client id for a free fusion table如何为免费融合表配置客户端 ID
【发布时间】：2014-04-29 22:58:50
【问题描述】：

我创建了一个包含融合表的地图，并希望仅通过我的网站显示它

我使用 Oauth 为 Web 应用程序创建了一个客户端 ID，并在地图上复制了该 ID，但我无法使其工作

如果我尝试从我的站点打开地图，它会打开一个没有标记的空白地图我做错了什么？

你能帮我找出错误吗？

谢谢

我为我的英语道歉

这是页面的代码

Google Maps JavaScript API v3 示例：融合表层函数初始化（） { 地理编码器 = 新的 google.maps.Geocoder(); var italia = new google.maps.LatLng(42.147114,13.25964); 地图 = 新 google.maps.Map(document.getElementById('map-canvas'), { 中：意大利，缩放：6， mapTypeId：google.maps.MapTypeId.ROADMAP }); var campminuscolo = idcamping.value var camp = "'" + campminuscolo + "'" var camp1 = "'Nome' 包含忽略大小写" + camp var layer = new google.maps.FusionTablesLayer({ 询问： { 选择：'indirizzo'，来自：'1mMSBct8LQjKiZBj-BqLYhszMgjKXUJnHxlQQaSgS'，地点：camp1 }, 选项： { 风格ID：2，模板编号：2 }, 样式：[{ 标记选项：{ 图标名称：“grn_circle” }, }] }); layer.setMap(地图); } 功能 testenter(e) { if (e.keyCode == 13) { // tasto enter 初始化（）; 返回假； } } var 地理编码器；变量映射；变量标记数组 = []; 变量标记；函数代码地址（）{ var address = document.getElementById("address").value; geocoder.geocode({ 'address': address }, function(results, status) { 如果（状态 == google.maps.GeocoderStatus.OK）{ clearOverlays(); document.getElementById("address").value = results[0]['formatted_address']; map.setCenter(results[0].geometry.location); map.setZoom(8); 标记 = 新的 google.maps.Marker({ 地图：地图，标题：结果[0]['formatted_address']，位置：结果[0].geometry.location，图标：“箭头.png”，动画：google.maps.Animation.DROP }); 标记数组.push（标记）； } 别的 { alert("地理编码不成功，原因如下：" + status); } }); } 函数 clearOverlays() { 如果（标记数组）{ 对于（我在标记数组中）{ 标记数组[i].setMap(null); } } } 功能 testenter1(e) { 如果（e.keyCode == 13）{ 代码地址（）；返回假； } } #头像面板{ 位置：绝对；底部：17px；右：0px；左边距：-180px；宽度：144px；高度：53px； z-index：1；背景颜色：透明；填充：1px；边框：0px 实心 #999; } 输入 { 边框：2px 纯灰色；背景：RGB（243、243、243）；宽度：150px；左：100px；填充：4px；位置：绝对； z-index：1； }

【问题讨论】：

标签： oauth google-api google-fusion-tables

【解决方案1】：

OAuth 用于对您的应用程序数据进行用户级别的访问。如果您只希望您的站点具有访问权限，您可以使用 API 密钥并将使用限制在 API Console 内的站点域中。您需要有一个项目并将其设置为浏览器键。这篇About.com 文章可以帮助您了解如何让一切顺利进行。

使用 OAuth 的一种简单方法是使用 Google's Javascript API。您可以通过使用<script src="https://apis.google.com/js/client.js?onload=init"></script> 加载脚本来加载它，其中init 是它应该在加载时运行的javascript 函数。

我有类似下面的东西来加载 Javascript API：

function init() {
    gapi.client.load('fusiontables', 'v1', function() {
        gapi.client.setApiKey( YOUR_API_KEY_AS_STRING );
        //Stuff to do once Fusion Tables API is loaded 
        gapi.client.fusiontables.query.sql({
            sql: "SELECT * FROM" + YOUR_TABLE_ID
        }).execute( YOUR_FUNCTION_ON_SUCCESS ); //Example
    });
    //Load other APIs as needed.
}

auth 函数附加到按钮的单击事件处理程序以授权 OAuth 请求。

function auth(e) {
    e.preventDefault();
    gapi.auth.authorize({
        'client_id': YOUR_BROWSER_API_KEY,
        'scope': 'https://www.googleapis.com/auth/fusiontables', //or other scope
        'immediate': false
    }, function() {
        //Execute this on successful auth like create another UI
    });
}

【讨论】：

感谢您的回复，我已经尝试使用该方法，但无法使用该方法，我获得了 API 密钥，对吗？要插入我的融合表表中，我需要一个客户 ID 对吗？ API Key 和 Client ID 是一回事吗？再次感谢
@HumusSapiensIta，如果您打算查看您的表格，API Key 有效。但是，如果您需要修改或获取有关表的特定详细信息，那么您将需要使用 OAuth for user-by-user case 来处理它。要具体知道哪个是哪个，您可以查看Fusion Table API Explorer。我有类似的事情发生，并使用Javascript API 为授权用户设置 OAuth 部分，未经授权的用户只需使用 API 密钥。
使用 OAuth 更新了我的答案。
再次感谢回复，我只要求创建地图时仅显示融合表 vensa，但仅在我的网站上，问题是我不明白如何做，一旦我有了 API密钥我如何与地图 API 密钥的 ID 对话或交互？我必须编辑用于查看地图的 html 文件？
如果您使用的是 Javascript API，那么您可以只使用第一个函数来处理您的站点的身份验证以使用您的 Fusion Tables 数据。您可以让google.maps.event.addDomListener(window, 'load', initialize); 运行函数initialize()，其主体包含创建的google.maps.Map，并添加引用刚刚创建的地图的google.maps.FusionTablesLayer。所有这些都记录在Javascript API - Fusion Tables Layer。

【解决方案2】：

感谢您在另一个 comment 中澄清。

您可以将FusionTablesLayer 添加到您的地图中。大多数细节可以在他们的Documentation 中找到。您需要事先设置地图环境，并确保您的 Fusion Table 列为public。

假设你有一个元素<div id="mapElement"></div>：

var map;
function initialize() {
    // Initialize the map
    map = new google.maps.Map(document.getElementById('mapElement'), {
        center: new google.maps.LatLng(0, 0), //Initial coordinates to center on
        zoom: 10, //Initial Zoom level
    });

    var ft = new g.FusionTablesLayer({
        query: {
            select: 'LOCATION_COLUMN_NAME', //From the Fusion Table
            from: 'TABLE_ID' //Fusion Table ID (long string in its URL)
        },
        map: map
    });
}
google.maps.event.addDomListener(window, 'load', initialize);

这与他们的example 中反映的代码相同。

【讨论】：