为Web浏览器使用Google URL Shortner API

我正在尝试使用谷歌URL缩短API。我已经启用了Google URL缩短器API并生成了API密钥。我遵循这个例子http://hayageek.com/google-url-shortener-api/。但是我不能缩短原来的URL。

<html>
<head>
<link  type="text/css" rel="stylesheet"  href="css/bootstrap.css" />    
<link  type="text/css" rel="stylesheet"  href="css/style.css" />    
<script src="js/bootstrap.js"></script>    
<script src="js/jquery-1.11.3.js"></script>    
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">    
</script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js">        
</script>  
<link rel="stylesheet" type="text/css"   
href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> 
</head>
<body background="eiffel10.jpg">
<script src="js/bootstrap.js"></script>    
<script src="js/jquery-1.11.3.js"></script> 
<script src="js/jquery.contenthover.js"></script> 
<!-- Form   -->
<br/><br/><br/>
<div class="container">    
<div class="row">
<div class="col-md-4">
<h2></h2><br/>
<form class="form-inline" role="form" >
<div class="form-group">
<label for="url" class="col-sm-2 control-label">Original URL</label>                     
</div>
<div class="form-group">
<input type="text" name="url" id="longurl" class="form-control"  
placeholder="Enter your name ..."/>                     
</div> 
<div class="form-group">
<button type="button" onclick="shortIt();" class="btn btn-primary">Short 
It</button>              
</div>    
</form>
</div>
</div>
</div>   
<div id="output">Result</div>
<script type="text/javascript">
 function shortIt() 
 { var longUrl=document.getElementById("longurl").value;
  //Below alert is displayed
 alert(longUrl);
var request = gapi.client.urlshortener.url.insert({ "resource": {
          "longUrl": longUrl
    }
    });
// Below alert is not displayed on clicking the Short It so the problem is 
//with the request variable
alert("xcvbn");
    request.execute(function(response) 
    {   
        
    if(response.id != null)
    {
    str ="<b>Long URL:</b>"+longUrl+"<br>";
    str +="<b>Short URL:</b> <a href='"+response.id+"'>"+response.id+"</a><br>";
    document.getElementById("output").innerHTML = str;
}
    else
    {
    alert("error: creating short url n"+ response.error);
    }
 
    });
    }
function load()
{gapi.client.setApiKey('AIzaSyC6iiKUFLkzpyGdvI5QdLf3m1shuM8xxxx');
    gapi.client.load('urlshortener', 'v1',function()    
 {document.getElementById("output").innerHTML="";}); 
}
window.onload = load;   
 
</script>
<script src="https://apis.google.com/js/client.js"> </script>  
</body>
</html>

client.js的用途是什么，是否必须包含client.js

Google的官方开发者网站有一个页面对此进行了解释。

基本上client.js是他们访问Google服务的javascript库。

专业提示:- 始终使用本地服务器来测试任何网站，而你做它，这样你就没有讨厌的惊喜，当你把它上传到生产服务器。

相关内容

最新更新

热门标签：