Web前端开发,JS就能实现Base64编码,MD5加密完成快递查询API接口的开发

举报
老杨占线 发表于 2020/05/19 21:03:03 2020/05/19
【摘要】 想调用快递鸟API接口实现快递查询,但是又不懂后端开发,不懂JAVA,不懂PHP,不懂C#,也不懂python,只懂一点点JS,已经足够,通过JS来实现600多家的物流轨迹查询。

有网友留言说,想调用快递鸟API接口实现快递查询,但是又不懂后端开发,不懂JAVA,不懂PHP,不懂C#,也不懂python,问我能不实现快递接口查询,我说你会什么,他说,我只懂一点点JS,

我回答他,已经足够了,我现在就来告诉你如何通过JS来实现600多家的物流轨迹查询。

你只需要一步,新建一个Text文本,把下面这段代码复制进去,替换你自己的快递鸟ID和APIkey, 将txt后缀改成HTML,用浏览器预览就可以看到效果。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>JS调用快递鸟API接口</title>
    <meta charset="utf-8" />
    <script src="/base64.js"></script>
    <script src="/md5.js"></script>
    <script src="/jquery.json-2.2.min.js"></script>
    <script src="/common.js"></script>
    <script type="text/javascript">
        function GetAPI() {     
            var key="快递鸟API Key";
            var id = "快递鸟注册ID号";
            var requestData="{'OrderCode':'','ShipperCode':'ZTO','LogisticCode':'78120038107849'}";
            //MD5加密
            var md5str = md5(requestData + key).toLowerCase();
            //base64
            var dataSign = Base64.encode(md5str);
            //拼接字符串(快递鸟请求报文格式)url编码
            var reqData = "RequestData=" + escape(requestData) + "&EBusinessID=" + id + "&RequestType=1002&DataSign=" + escape(dataSign) + "&DataType=2";   
            //reqData = "RequestData=%7b%27OrderCode%27%3a%27%27%2c%27ShipperCode%27%3a%27ZTO%27%2c%27LogisticCode%27%3a%2778120038107849%27%7d&EBusinessID=1264783&RequestType=1002&DataSign=NzMxNTAzZWYxYTJiOGIyMDhiNTVjMTc4MDQ0NjdlZDg%3d&DataType=2";

            //调用
            SubmitPost({
                method: 'post',
                url: '/api/dist',
                data: reqData,
                beforeSend: function (xhr) {
                    //调用前触发,如加载效果等
                },
                success: function (data, status) {
                    if (status) {
                        document.getElementById("msg").innerHTML = "";
                        for (var i = 0,
  len = data.Traces.length; i < len; i++) {
                            var acceptTime = data.Traces[i].AcceptTime;
                            var acceptStation = data.Traces[i].AcceptStation;
                            //页面展示效果自己开发,这里只实现功能
                            document.getElementById("msg").innerHTML += acceptTime + "&nbsp;&nbsp;" + acceptStation+"<br/>";
                        }
                      }
                },
                error: function (data, status, e) {
                    if (data.status == "401") {
                        alert(data.status);
                        return;
                    }

                }
            });
        }
    </script>
</head>
<body>
    <input id="Button1" onclick="GetAPI();" type="button" value="JS调用快递鸟API接口" />
    <div id="msg"></div>
</body>
</html>

运行效果如下:

image.png

注意:

<script src="/base64.js"></script>

<script src="/md5.js"></script>

<script src="/jquery.json-2.2.min.js"></script>


这3个js文件引用,网上都能下载到,都是通用的js,如果有更好的建议,欢迎下方留言一起探讨。



【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

举报
请填写举报理由
0/200