Question

给定的是我创建的Web Data Connector Page的代码，它创建了一个URL来访问API中的json数据。

然后将json数据推送到阵列上，然后将其馈送到tableau。

我已经给出了以下代码，请告诉我他们是否在代码中有任何错误并帮助我解决问题。

<html>
<head>
<title> Topic Call</title>

<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<link href="http://fonts.googleapis.com/css?family=Didact+Gothic" rel="stylesheet" />

<link href="default.css" rel="stylesheet" type="text/css" media="all" />

<link href="fonts.css" rel="stylesheet" type="text/css" media="all" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>

<script src="https://online.tableau.com/javascripts/api/tableauwdc-1.1.0.js" type="text/javascript"></script>

<script type="text/javascript">
  (function() {

//HELPER FUNCTION USED TO BUILD THE API CALL.
    function buildUrl(option) {
        if(option==""){ 
                    var uri = "http://api.worldbank.org/topic?per_page=100&format=json";
                  }

              else{
                    var uri = "http://api.worldbank.org/topic/"+ option +"?per_page=100&format=json";
                  }
    return uri;
                       }

//Function to create an instance of the connector.
      var myConnector = tableau.makeConnector();

//Tableau calls this function to get column (field) information for the data that the connector provides.
      myConnector.getColumnHeaders = function() {
               var fieldNames = ['topic-id','topic-value','source-note'];
               var fieldTypes = ['string','string','string'];
               tableau.headersCallback(fieldNames, fieldTypes); //Passes information about the data schema to Tableau.
                                                }

//To get the data that's represented by the connector.
     myConnector.getTableData = function(lastRecordToken) {
                var dataToReturn = [];             
                var hasMoreData = false;          
                var ticker = tableau.connectionData;
                var connectionUrl = buildUrl(ticker);
                var xhr = $.ajax({                                       
                           url: connectionUrl,
                           dataType: 'json',
                               success: function (data) { 
                                       var ii;
                                       var length1 = data[0].total;
                                       for (ii = 0 ; ii < length1; ii++) 
                                         {
                                            var entry = {
                                           'topic-id':data[1][ii].id,
                                           'topic-value':data[1][ii].value,
                                           'source-note':data[1][ii].sourceNote
                                                        }; 
                                        dataToReturn.push(entry);
                                         }
                     console.log(dataToReturn);
        tableau.dataCallback(dataToReturn, lastRecordToken, false);//Passes data from the connector to Tableau
                                    },
//TO GET THE ERROR MESSAGE  
  error: function(xhr, ajaxOptions, thrownError) {           
          tableau.log("Connection error: " + xhr.responseText + "\n" + thrownError);
          tableau.abortWithError("Error while trying to connect to the World Bank data source.");
                         }       
                    });                   
              }
//Registers the connector with Tableau.
  tableau.registerConnector(myConnector);

//jQUERY USED FOR GETTING THE RESPONSE ON CLICKING THE BUTTON.  
  $(document).ready(function() {
                     $("#subGet").submit(function() {
                    var topic = $('#edit-topic').val();
                        if (topic) {
                        tableau.connectionName = "World Bank Data for " + topic;
                        tableau.connectionData = topic;//connectionData is used to pass information from the interactive phase to the data-fetching phase of the connector.
                        tableau.submit();//Tells Tableau that the connector has finished the interactive phase or the authentication phase. After this method is called, Tableau proceeds to the data-gathering phase.
                           }
                      });
                 });
            });
</script>
    <script src="https://public.tableau.com/javascripts/api/tableauwdc-1.1.0.js" type="text/javascript"></script>
<script type="text/javascript">
    (function() {
        var myConnector = tableau.makeConnector();
        myConnector.getColumnHeaders = function() {}
        myConnector.getTableData = function(lastRecordToken) {}
        tableau.registerConnector(myConnector);
    })();
</script>
</head>

<body>
<div id="header-wrapper">
    <div id="wblogo"></div> 
    <div id="banner" class="container">
        <div class="title">
            <h2>TOPIC calls</h2>
            <span class="byline">Select one of the Topic mentioned below</span>
        </div>
    </div> 
</div>
<div id="decor1"> </div>
<div id="wrapper">
    <div id="three-column" class="container">
        <div class="title">
            <span class="byline">Topics : <select name="topic" class="form-select" id="edit-topic"> <option value="">-</option> <option value="1">Agriculture &amp; Rural Development</option> <option value="2">Aid Effectiveness</option> <option value="3">Economy &amp; Growth</option> <option value="4">Education</option> <option value="5">Energy &amp; Mining</option> <option value="6">Environment</option> <option value="7">Financial Sector</option> <option value="8">Health</option><option value="9">Infrastructure</option> <option value="10">Social Protection &amp; Labor</option> <option value="11">Poverty</option> <option value="12">Private Sector</option><option value="13">Public Sector</option> <option value="14">Science &amp; Technology</option> <option value="15">Social Development</option> <option value="16">Urban Development</option> <option value="17">Gender</option> <option value="18">Millenium development goals</option> <option value="19">Climate Change</option> <option value="20">External Debt</option> </select><p></p>

            <input type="submit" name="op" id="subGet" class="button button-alt" value="Get Data"></span>
        </div>      
    </div>
</div>
<div id="decor1"></div>
<div id="footer"></div>
</body>
</html>

Answer 1

有两件事可以解决这个具体问题：

更新指向https://online.tableau.com/javascripts/api/tableauwdc-1.1.0.js的脚本代码，然后将其指向https://connectors.tableau.com/libs/tableauwdc-1.1.0.js。
删除指向https://public.tableau.com/javascripts/api/tableauwdc-1.1.0.js的重复脚本标记。

这两个版本的文件都是旧的，而在online.tableau.com上的版本实际上有一个错误（已经修复）。我们在网络数据连接器的生命周期早期搞砸了，并没有正确跟随semver。现在我们是。该库的所有未来版本都将遵循semver并托管在connectors.tableau.com/libs上。

希望有所帮助，

布兰登

Web数据连接器（Tableau）

1 个答案: