首先解释一下链接参数。
https://player.bilibili.com/player.html?cid=134715710&aid=78736512&page=1&as_wide=1&high_quality=1&danmaku=0
| key | 说明 |
|---|---|
| aid | 视频ID 就是B站的avxxxx后面的数字 |
| cid | 应该是客户端id clientId 的缩写(推测的, 不一定准确) 经过测试, 这个字段不填也没关系 |
| page | 第几个视频 起始下标为 1 (默认值也是为1) 就是B站视频, 选集里的, 第几个视频 |
| as_wide | 是否宽屏 1: 宽屏, 0: 小屏 |
| high_quality | 是否高清 1: 高清, 0: 最低视频质量(默认) 如视频有 360p 720p 1080p 三种, 默认或者 high_quality=0 是最低 360p high_quality=1 是最高1080p |
| danmaku | 是否开启弹幕 1: 开启(默认), 0: 关闭 |
可以优化的问题
按比例播放视频
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
.aspect-ratio {
position: relative;
width: 100%;
height: 0;
padding-bottom: 75%;
}
.aspect-ratio iframe {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
</style>
</head>
<body>
<h1> test </h1>
<div class="aspect-ratio" >
<iframe src="https://player.bilibili.com/player.html?aid=78736512&cid=134715710&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
</div>
</body>
</html>阻止跳转到B站
在网页上, 用户选择清晰度, 或者点击视频上面的一些图标, 会跳转到B站. 这个可通过设置 iframe 的 sandbox 属性去禁止。
| sandbox=“allow-top-navigation allow-same-origin allow-forms allow-scripts” |
<iframe src="https://player.bilibili.com/player.html?cid=99269782&aid=56824180&page=1&as_wide=1&high_quality=1&danmaku=0"
allowfullscreen="allowfullscreen" width="100%" height="500" scrolling="no" frameborder="0" sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>值得注意, 如果单单设置了 sandbox , 却没有传参 high_quality 字段为 1, 那么用户是切换不了视频质量的.
就是用户只能在 360p, 而点击了 720p 或者 1080p 都无效。
解决iOS上自动跳转到B站APP (Universal Links)
因为需求, 还要可能访问到B站, 但是又不想跳出, 这又牵扯到 Universal Links 的问题 ( 自动跳转是因为 Universal Links )。
虽然系统没有公开给我们选项, 但通过直接强加就可以了 (下面是 WKWebView 的代理 WKNavigationDelegate 方法)。
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
decisionHandler(WKNavigationActionPolicyAllow);
}
<br>
//当前设备系统版本号
#define SYSTEMVersion [[[UIDevice currentDevice] systemVersion] floatValue]
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
if(SYSTEMVersion < 9.0f) {
// iOS 9 还没有
decisionHandler(WKNavigationActionPolicyAllow);
}else{
// 返回+2的枚举值, 意思允许链接跳转, 但是类似这种 Universal Links, 就不会去瞎跳到什么APP
decisionHandler(WKNavigationActionPolicyAllow + 2);
}
}iOS 播放自动放大问题
这个是 webView 默认配置问题, 改一下默认配置就好。
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
// 允许不全屏播放
configuration.allowsInlineMediaPlayback = YES;
WKWebView *webView = [[WKWebView alloc] initWithFrame:CGRectZero configuration:configuration];