Skip to content

Instantly share code, notes, and snippets.

@sw926
Last active August 23, 2018 06:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sw926/97f2ba6cc628406226b362dab7deac97 to your computer and use it in GitHub Desktop.
Save sw926/97f2ba6cc628406226b362dab7deac97 to your computer and use it in GitHub Desktop.

Webview Js注入说明

完整的Js注入文件如下,注入函数改变的话,Js代码有可能会变。

(function (w) {
        console.log('Javascript inject start');
        if (w.HostApp) {
            console.warn('Already exits, return');
            return;
        }
        var injectApp = {
            queue: [], callback: function () {
                var d = Array.prototype.slice.call(arguments, 0);
                var c = d.shift();
                var e = d.shift();
                this.queue[c].apply(this, d);
                if (!e) {
                    delete this.queue[c]
                }
            }
        };
    injectApp.alert
     = injectApp.doCreateNewPost
     = injectApp.doGetImage
     = injectApp.doGetImageLoadStrategyNoneWifi
     = injectApp.doGetNetworkType
     = injectApp.doSetShareLink
     = injectApp.doViewImage
     = injectApp.getToken
     = injectApp.getUser
     = injectApp.logEvent
     = injectApp.logEvent
     = injectApp.logEvent$default
     = injectApp.login
     = injectApp.logout
     = injectApp.openHayaaUrl
     = injectApp.openNewWindow
     = injectApp.queryDialog
     = injectApp.setShowPostBottomBar
     = injectApp.shareLink
     = injectApp.showMessage
     = injectApp.switchFullScreen
     = injectApp.toast
     =  function () {
            var functionArgs = Array.prototype.slice.call(arguments, 0);
            if (functionArgs.length < 1) {
                throw 'injectApp call error, message:miss method name'
            }
            var e = [];
            for (var h = 1; h < functionArgs.length; h++) {
                var c = functionArgs[h];
                var j = typeof c;
                e[e.length] = j;
                if (j === 'function') {
                    var d = injectApp.queue.length;
                    injectApp.queue[d] = c;
                    functionArgs[h] = d
                }
            }
            var g = JSON.parse(prompt(JSON.stringify({
                method: functionArgs.shift(),
                types: e,
                args: functionArgs
            })));
            if (g.code !== 200) {
                throw 'injectApp call error, code:' + g.code + ', message:' + g.result
            }
            return g.result
        };
        Object.getOwnPropertyNames(injectApp).forEach(function (d) {
            var c = injectApp[d];
            if (typeof c === 'function' && d !== 'callback') {
                injectApp[d] = function () {
                    return c.apply(injectApp, [d].concat(Array.prototype.slice.call(arguments, 0)))
                }
            }
        });
        w.HostApp = injectApp;
    w.HostApp.reserved_device_os_version="8.0.0";w.HostApp.app_name="Hayaa Internal";w.HostApp.reserved_device_app_version="3.1.1";w.HostApp.reserved_current_app="info";w.HostApp.device_model="Nexus 5X";w.HostApp.reserved_selected_language="zh";w.HostApp.reserved_device_unique_id="7163cacc7119d86b";w.HostApp.reserved_device_os_type="android";    var readyEvent = document.createEvent('Events');
        readyEvent.initEvent('HostAppReady');
        document.dispatchEvent(readyEvent);
        console.log('Javascript inject end');
    })(window);

Android端实现

在window注入一个HostApp对象,注入的js函数参数支持以下变量类型:

  • String 字符串
  • 数组类型 int long float double
  • boolean
  • object 一个json对象
  • fuction 函数

注入的函数格式为

foo(param2, param2, callback)

每个函数只有一个function callback,只能为最后一个参数,callback返回一个json对象,json对象格式为:

{
    "success": true
}

必须包含一个success属性,用来表示调用的结果

目前实现的函数

展示提示:

HostApp.toast("Message") // 显示一个toast
HostApp.alert("Message") // 显示一个提示对话框

确认对话框:

 HostApp.queryDialog('确认对话框测试', function (json) {});

App会显示一个对话框,有确认和取消按钮,用户点击的结果通过json对象返回给js,json对象格式为:

{"success":true}

true表示用户点击了确认,false表示用户点击了取消

获取token:

 HostApp.getToken(function(token) {});

返回结果:

{
    "success": true,
  	"token": "abdceasdfe"
}

获取User

 HostApp.getUser(function(user) {HostApp.alert(JSON.stringify(user));});

返回结果

{
    "success": true,
    "user":
    {
        "avatar_url": "http://test-media-01.hayatapp.com/period/production/uploads/app_user/avatar/74b1b6ba93508d6cacf50bfc86f3ff14.jpg",
        "login_bindings":
        {
            "facebook": false,
            "google": true
        },
        "birthday": "1997-08-15",
        "default_menses_duration": 5,
        "default_menses_interval": 28,
        "fans_count": 0,
        "id": "9b1ff5c3-513b-4301-8327-b45f8cd9ae71",
        "idols_count": 0,
        "is_new": false,
        "is_anonymous": false,
        "name": "user12580",
        "token": "GHUBDJVEEJECUJWDFSBBFYO",
        "woman_wish": "menses"
    }
}

退出登录

HostApp.logout(function (result) {});

返回结果:

{"success":true}

登录

HostApp.login(function (result) {});

返回结果:

{"success":true}

打开一个新的Webview窗口

 HostApp.openNewWindow('https://m.youtube.com/watch?v=OC-YdBz8Llw', function (result) {});

返回结果:

{"success":true}

进入全屏模式

HostApp.switchFullScreen(true, function (result) {});

返回结果:

{"success":true}

直接打开一个自定义的url

  HostApp.openHayaaUrl('hayaaonemena://article_pgcs/86814701-3bde-428b-a3f0-a9c8ee38c613', function (result) {});

返回结果:

{"success":true}

统计事件

HostApp.logEvent('health_article_read');
HostApp.logEvent('health_article_read', jsonObject);

显示分享菜单

HostApp.doSetShareLink('http://apistage.hayatapp.com/api/v1/article_pgcs/51a64db8-0de2-4679-92c5-0660cde72e1f');

不需要返回结果,第一参数为事件名称,第二个参数为param,必须是键值对的形式

分享Url

HostApp.shareLink('http://apistage.hayatapp.com/api/v1/article_pgcs/51a64db8-0de2-4679-92c5-0660cde72e1f', function (result) {HostApp.alert(JSON.stringify(result));});

返回结果

{"success":true, "share_status":"cancel"}

share_status: 有三种情况 success, error, cancel

需要注意的是:只有Facebook能获取分享的结果,其他的分享方式不会有callback,所以最好忽略分享结果。

显示隐藏帖子底部的菜单

HostApp.setShowPostBottomBar(true)

创建活动帖子

HostApp.doCreateNewPost(url, callback)

示例:

function createNewPost() {
    HostApp.doCreateNewPost('hayaaonemena://posts/new?anonymous_changeable=0&cell_post_kind_id=047bf08b-d24e-4fba-af68-488efcc26594&image_max_count=9&image_min_count=3&is_anonymous=0&is_async=0&tag=话题测试标签1&tag_editable=0',
    function (result) {HostApp.alert(JSON.stringify(result));})
}

获取图片

 HostApp.doGetImage(100, 100,
    'http://image5.tuku.cn/wallpaper/Landscape%20Wallpapers/8294_2560x1600.jpg',
    function(result) {
    var imageObj = document.getElementById("test_image");
    imageObj.src = result.image_data_base64;
    });

参数为期望的width、height,imageUrl, callback。返回的json结构为

{
    "success": true,
    "image_data_base64": "data:image\/jpeg;base64,\/9j\/4AAQSkZJRg"
}

image_data_base64为根据width和height缩放后的图片,数据的结构为:

"data:image/" + "图片格式" + ";base64," + "图片base64数据"

例如jpeg的图片

data:image/jpeg;base64,4AAQSkZJRgABAQAAAQABAA...

图片的Base64数据为encode后的进行base64编码

查看图片

var images = new Object();
images.default_position = 1;
images.images = new Array();
images.images[0] = 'http://image5.tuku.cn/wallpaper/Landscape%20Wallpapers/8294_2560x1600.jpg';
images.images[1] = 'https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/w%3D400/sign=41bbbd1af7faaf5184e380bfbc5594ed/314e251f95cad1c82826e91b753e6709c93d5168.jpg';
images.images[2] = 'http://pic.qiantucdn.com/58pic/11/10/80/70558PICvpu.jpg!qt290';
images.images[3] = 'http://image5.tuku.cn/wallpaper/Landscape%20Wallpapers/8294_2560x1600.jpg';

HostApp.doViewImage(images);

json数据结构为

{
  "default_position": 1,
  "images": [
    "http:\/\/image5.tuku.cn\/wallpaper\/Landscape%20Wallpapers\/8294_2560x1600.jpg",
    "https:\/\/gss3.bdstatic.com\/7Po3dSag_xI4khGkpoWK1HF6hhy\/baike\/w%3D400\/sign=41bbbd1af7faaf5184e380bfbc5594ed\/314e251f95cad1c82826e91b753e6709c93d5168.jpg",
    "http:\/\/pic.qiantucdn.com\/58pic\/11\/10\/80\/70558PICvpu.jpg!qt290",
    "http:\/\/image5.tuku.cn\/wallpaper\/Landscape%20Wallpapers\/8294_2560x1600.jpg"
  ]
}

获取网络类型

HostApp.doGetNetworkType(function (result) {
        HostApp.alert(JSON.stringify(result));
});

网络类型有三种

wifi
mobile
none

返回结果

{
    "success": true,
    "network_type": "wifi"
}

网络类型有三种

获取在非wifi状态下的图片加载策略

HostApp.doGetImageLoadStrategyNoneWifi(function (result) {
    HostApp.alert(JSON.stringify(result));
});

返回结果

{"success":true,"img_load_strategy":1}

img_load_strategy 的值为

  • 0 不加载图片
  • 1 加载原图
  • 如果需要其他功能,比如非wifi状态下加载小图,以后再定义
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment