利用有道翻译api的jsonp接口自动编写文章的url

摘要: 想在url中包含更多的信息(如http://www.baiwar.com/post/filezilla-upload-files-with-server-timestamp-donot-match这样的格式),以利于SEO,但每次写文章标题的时候又不想麻烦编写url(英语很差),于是想到用有道翻译的api接口请求jsonp自动编写url。

利用有道翻译api的jsonp接口自动编写文章的url

想在url中包含更多的信息(如http://www.baiwar.com/post/filezilla-upload-files-with-server-timestamp-donot-match这样的格式),以利于SEO,但每次写文章标题的时候又不想麻烦编写url(英语很差),于是想到用有道翻译的API接口请求jsonp自动编写url。
先看效果:
点取自动获取<img alt="点取自动获取" src="https://s.yunzhuji.shop/uploads/image/150825/1rtm1vj7x6.png_.jpg?media_id=223" title="点取自动获取" width="600" >


不是非常准确但稍微修改下,还是能用。
00<img alt="00" src="https://s.yunzhuji.shop/uploads/image/150825/1rtm1q7mf7.png_.jpg?media_id=224" title="00" width="600" >


1、申请有道翻译key

进入有道翻译Api官网 http://fanyi.youdao.com/openapi

进入有道翻译API官网<img alt="进入有道翻译API官网" src="https://s.yunzhuji.shop/uploads/image/150825/1s3i1oxehc.png_.jpg?media_id=225" title="进入有道翻译API官网" width="600" >


填写资料申请有道翻译key

填写资料申请有道翻译key<img alt="填写资料申请有道翻译key" src="https://s.yunzhuji.shop/uploads/image/150825/1s3i1z5s8z.png_.jpg?media_id=226" title="填写资料申请有道翻译key" width="600" >


有道翻译API申请成功,记下API key及申请的keyfrom;注意:使用API key 时,请求频率限制为每小时1000次,超过限制会被封禁。

有道翻译API申请成功<img alt="有道翻译API申请成功" src="https://s.yunzhuji.shop/uploads/image/150825/1s3j1oxgd9.png_.jpg?media_id=227" title="有道翻译API申请成功" width="600" >


2、编写代码

html代码,注意引入jquery代码(并使用的bootstrap)

 <form id="">
      <div class="form-group">
        <input type="text" class="form-control" id="post_title" name="post_title" placeholder="标题" value="" required>
        <div id="titleShow">
          <h4>链接: <input type="text" id="post_url_name" class="hidden" />.html
            <span>&nbsp;<a id="get_post_url_name_btn" class="btn btn-link" href="javascript:">自动获取</a> </span>
          </h4>
        </div>
      </div>
    </form>

js ,核心是$getJson,可参考jquery手册

$("#get_post_url_name_btn").click(function(e){
    e.prevntDefault();
    var postTitle=$("#post_title").val();
    if($.trim(postTitle)!=""){
        $.getJSON("http://fanyi.youdao.com/openapi.do?keyfrom=baiwar&key=**上一步获取的api-key**&callback=?",{only:"translate",type:"data",doctype:"jsonp",version:"1.1",q:postTitle})
        .done(function(data){
            //得到翻译结果,替换非字母为"-",并去除末尾"-",截取至255字符长度
            var postUrlName=data.translation[0].toLowerCase().replace(/\W{1,}/g,"-").replace(/-{1,}$/,"").substr(0,255);
            //填充到输出框
            $("#post_url_name").val(urlName);
            alert("获取成功");
        });
    }else{
        alert("标题为空!");
    }
});

3、其它

到此,这个有道翻译获取url已经可以正常使用了。其它需要改进的地方:可以配合php通过ajax判断url是否重复,附上php代码:

使用thinkphp框架,并且之前重写了success及error方法;
我的思路是:查询 post_id不等于此文章时是否存在post_url_name的列,存在则重复,返回更改后的post_url_name,不存在则返回原post_url_name。

    function get_post_url_name(){
        $post_id=I("get.post_id",0,"intval");
        if(empty($post_id))
            $this->error("文章ID为空");
        $post_url_name=I("get.post_url_name","");
        if(empty($post_url_name))
            $this->success(array("message"=>"postUrlName为空,自动设置为文章id","extends"=>array("post_url_name"=>$post_id)));
        $where["post_url_name"]=$post_url_name;
        $where["post_id"]=array("neq",$post_id);
        if(M("Posts")->where($where)->find())
            $post_url_name.="-2";
        $this->success(array("message"=>"获取成功","extends"=>array("post_url_name"=>$post_url_name)));
    }

猜你喜欢

微信QQ空间QQ好友新浪微博联系客服