Admin 发布的文章

目前已知两种视频切片,一个是m3u8,一个是mpd

mp4转m3u8的命令:

ffmpeg -i principles.mp4 -vcodec copy -acodec copy -hls_time 360 -hls_list_size 0 index.m3u8

加密的m3u8视频:
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni4934e7b/50b072b0-6124-11eb-a16f-5b3e54966275.m3u8

未加密的m3u8视频:
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni4934e7b/53b1e0f0-6126-11eb-bdc1-8bd33eb6adaa.m3u8
https://vkceyugu.cdn.bspapp.com/VKCEYUGU-d420af8e-bb77-43b2-89e4-7bd5880cf860/158f758c-ebe7-4a4e-8c52-a2d22c73b449.m3u8 (74.8MB)

利用ffmpeg命令可以直接保存m3u8到本地mp4:

ffmpeg -i https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni4934e7b/50b072b0-6124-11eb-a16f-5b3e54966275.m3u8 -c copy C:/Users/John/Desktop/output.mp4

将mp4转为mpd的命令:

ffmpeg -i wolf.mp4 -c copy -f dash -min_seg_duration 60000000 wolf.mpd

mpd的例子:
https://static-b905bdbb-5254-4483-af4c-16e5bf477a2e.bspapp.com/mpd/wolf.mpd

网页播放mpd文件需要dashjs,示例:
https://static-b905bdbb-5254-4483-af4c-16e5bf477a2e.bspapp.com/mpd/dash.html

下载方式跟m3u8一样:

ffmpeg -i https://static-b905bdbb-5254-4483-af4c-16e5bf477a2e.bspapp.com/mpd/wolf.mpd -c copy C:/Users/John/Desktop/output.mp4

需要主意的是,这个命令在windows版ffmpeg 4.3版本无效,在windows版4.2.2上是效,但在Mac版4.2.2也无效
此外,测试“ffmpeg version 4.4-full_build-www.gyan.dev”这个版本也可以下载

今天是2020年最后一天,买了7台华为云非大陆300Mbps带宽的服务器,用于对比

imgbed.cn图床

测试数据如下:

地区国内平均ping值下载速度
香港58ms8MB/s
曼谷119ms8MB/s
新加坡89ms8MB/s
非洲428ms6KB/s
墨西哥311ms9KB/s
圣保罗395ms8KB/s
圣地亚哥387ms7KB/s

ping值为电信、移动、联通三网的均值。

下载速度测法:

  • 服务器放个100MB的zip文件,本地浏览器下载,南方电信宽带,8MB/s应该是我带宽和笔记本wifi的限制,抛开限制,下载速度应该可以更大。
  • 用华为云贵阳服务器去wget测下载,曼谷和新加坡只有100KB/s左右,香港1MB/s,从这点来看,还是香港比较好。

如果只考虑下载速度,南方买曼谷、香港、新加坡都差不多,再考虑ping值和全国速度的话,香港首选。

国内使用的话,亚太地区以外强烈不建议入手。

2021.01.13增加脚本测试如下:
imgbed.cn图床

imgbed.cn图床

imgbed.cn图床

imgbed.cn图床

imgbed.cn图床

有个项目需要获取上个月的“年-月”,用了php的这个方法:

date( 'Y-m', strtotime('-1 month') )

今天2020年12月31日,发现上述函数给出的结果是2020-12,仔细研究了一下,原来是php的bug:

echo date('Y-m-d', strtotime('-1 month', strtotime('2019-03-31')));
// 输出2019-03-03,非闰年,扣28天

echo date('Y-m-d', strtotime('-1 month', strtotime('2020-03-31')));
// 输出2019-03-02,闰年,扣29天

echo date('Y-m-d', strtotime('-1 month', strtotime('2020-06-30')));
// 输出2020-05-30,扣30天,这个正常

echo date('Y-m-d', strtotime('-1 month', strtotime('2020-05-31')));
// 输出2020-05-01,遇到有31天的月份依然扣30天

这个bug总结起来就是:

  • 在3月份,如果当年是闰年,则执行'-1 month'一股脑减29天,非闰年一股脑减28天。
  • 在非3月份,全部一股脑减30天。

结合“一三五七八十腊,三十一天永不差”,最后总结,正确地获取上个月“年-月”的姿势为:

date('Y-m', strtotime('-1 month', strtotime(date('Y-m'))))

也就是用每月1日为基准去扣天数。

支付宝网页支付的流程:前端请求支付宝支付表单参数->后端生成支付表单参数给前端->前端根据支付参数构建form表单对支付宝发起POST请求->支付宝支付成功POST异步通知开发者的服务器。

支付宝用到的是RSA加密,搞懂RSA加密的原理有助于理解支付宝支付流程。推荐李永乐老师讲非对称加密的视频。

代码很简单,直接看代码就理解了,注意点写在注释里。

支付宝官方文档:
https://opendocs.alipay.com/apis/api_1/alipay.trade.page.pay
https://opendocs.alipay.com/apis/api_1/alipay.trade.wap.pay

请求支付参数的服务端代码:

'use strict'
const NodeRSA = require('node-rsa') // 需要执行npm install node-rsa才能调用
const querystring = require('querystring') // node自带,无需安装,直接调用
exports.main = async (event, context) => {
    const appId = '支付宝的appId'
    let merchantPrivateKey = '支付宝商家公钥'
    
    let ua = ''
    try {
        ua = event.headers['user-agent']
    }catch(e){}
    let productCode = 'FAST_INSTANT_TRADE_PAY'
    let method = 'alipay.trade.page.pay'
    if (ua.indexOf('Mobile') > -1) {
        productCode = 'QUICK_WAP_WAY'
        method = 'alipay.trade.wap.pay'
    }
    let bodyObj = querystring.parse(event.body) // url请求参数字符串转object。uni-app云函数实例化后,POST的请求参数在body里
    if (Object.keys(bodyObj).length) {
        const passbackParams = JSON.stringify({mobile: '18888888888', sku: 'year'}) // 开发者想要传递的参数,字符串,支付宝异步通知会带上这个
        let bizContent = JSON.stringify({
            subject: '支付宝测试-'+bodyObj.price+'元',
            out_trade_no: (new Date()).getTime(),
            total_amount: bodyObj.price,
            product_code: productCode,
            quit_url: 'https://yourdomain.com/static/alipay-return.html', // 手机网页支付放弃支付时返回的网址
            passback_params: passbackParams
        })
        let queryObject = ksort({
            app_id: appId,
            biz_content: bizContent,
            charset: 'UTF-8',
            method: method,
            notify_url: '支付宝异步通知地址',
            return_url: 'https://yourdomain.com/static/alipay-return.html',
            sign_type: 'RSA2',
            timestamp: time2date((new Date()).getTime()), // Y-m-d H:i:s格式的字符串
            version: '1.0'
        })
        const query = querystring.unescape(querystring.stringify(queryObject)) // 要再套一层querystring.unescape,否则query被转义,会导致签名的字符串跟支付宝不一致
        const key = new NodeRSA(merchantPrivateKey, 'pkcs8-private')
        const sign = key.sign(Buffer.from(query)).toString('base64')
        queryObject.sign = sign
        return {code:0, alipayParams: queryObject}
    } else {
        return {code: 1, msg: 'event.body is empty'}
    }
    
    /****************************************************************************************************/
    // 毫秒时间戳转Y-m-d H:i:s
    function time2date(time) {
        const date = new Date(time)
        const year = date.getFullYear()
        const month = (date.getMonth()+1).toString().padStart(2, '0')
        const day = date.getDate().toString().padStart(2, '0')
        const hour = date.getHours().toString().padStart(2, '0')
        const minute = date.getMinutes().toString().padStart(2, '0')
        const second = date.getSeconds().toString().padStart(2, '0')
        return year+'-'+month+'-'+day+' '+hour+':'+minute+':'+second
    }
    
    // 对object的key进行排序
    function ksort(params) {
        let keys = Object.keys(params).sort();
        let newParams = {};
        keys.forEach((key) => {
            newParams[key] = params[key];
        });
        return newParams;
    }
}

前端支付代码,为了方便,我用了vue+vant:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0, viewport-fit=cover">
        <title>支付宝支付演示</title>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/lib/index.css"/>
    </head>
    <body>
        <div id='app' style="display: none; padding: 100px 15px 15px 15px;">
            <div style="max-width: 512px; margin: 0 auto;">
                <p><img height="44px" src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-imgbed/dca221bb-2a37-4527-bea7-6fcb92945c18.png"></p>
                <p v-for="price in prices"><van-button @click="alipay(price)" type="info" block>{{price}}元</van-button></p>
            </div>
            <div id="form-pay"></div>
            
            <van-overlay :show="showLoading">
                <div style="display: flex; align-items: center; justify-content: center; height: 100%">
                    <van-loading size="24px" vertical>加载中...</van-loading>
                </div>
            </van-overlay>
        </div>
        <script src="https://cdn.bootcdn.net/ajax/libs/zepto/1.2.0/zepto.min.js"></script>
        <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.12/vue.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/lib/vant.min.js"></script>
        <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.0/axios.min.js"></script>
        <script src="https://cdn.bootcdn.net/ajax/libs/qs/6.9.4/qs.min.js"></script>
        <script>
            const vm = new Vue({
                el: '#app',
                data() {
                    return {
                        prices: [0.01, 1, 10, 100],
                        showLoading: false
                    }
                },
                methods: {
                    alipay(price) {
                        if (navigator.userAgent.indexOf('MicroMessenger')>-1) {
                            vant.Dialog({ message: '点击微信右上角···,选择“用浏览器打开”' })
                        } else {
                            this.showLoading = true
                            axios({
                                url: 'https://b1ebbd3c-ca49-405b-957b-effe60782276.bspapp.com/http/alipay-params-demo', // uni-app云函数URL实例化的api
                                data: Qs.stringify({price: price}),
                                method: 'POST'
                            }).then(res=>{
                                this.showLoading = false
                                if (0===res.data.code) {
                                    const obj = res.data.alipayParams
                                    const keys = Object.keys(obj)
                                    let formHtml = ''
                                    formHtml += '<meta charset="utf-8">'
                                    formHtml += '<form id="alipaysubmit" method="POST" name="alipaysubmit" action="https://openapi.alipay.com/gateway.do?charset=UTF-8">'
                                    for (i=0; i<keys.length; i++) {
                                        formHtml += '<input type="hidden" name="'+keys[i]+'" value=\''+obj[keys[i]]+'\'>'
                                    }
                                    // formHtml += '<input type="submit">' // 手动提交表单
                                    formHtml += '</form>'
                                    $('#form-pay').html(formHtml)
                                    document.forms["alipaysubmit"].submit() // 自动提交表单
                                } else {
                                    console.error(res.data.msg)
                                }
                            }).catch(err=>{
                                this.showLoading = false
                                console.error(err)
                            })
                        }
                    }
                }
            })
            $(document).ready(function(){
                $('#app').show()
            })
        </script>
    </body>
</html>

支付成功后,支付宝会异步通知,开发者接收异步通知,验签,代码如下:

'use strict'
const querystring = require('querystring')
const NodeRSA = require('node-rsa')
exports.main = async (event, context) => {
    const alipayPublicKey = '支付宝公钥'
    
    let bodyObj = ksort(querystring.parse(event.body))
    if ('TRADE_SUCCESS'===bodyObj.trade_status) { // 支付失败也有可能会收到异步通知,所以这里要判断TRADE_SUCCESS
        const outTradeNo = bodyObj.out_trade_no
        if (outTradeNo是否已经存在于数据库) { // 异步通知可能会收到多次,判断out_trade_no是否存过数据库来判断重复通知
            const sign = bodyObj.sign
            delete bodyObj.sign
            delete bodyObj.sign_type
            const body = querystring.unescape(querystring.stringify(bodyObj, '&', '='))
            const key = new NodeRSA(alipayPublicKey, 'pkcs8-public')
            if (key.verify(Buffer.from(body), sign, 'utf8', 'base64')) { // 验签通过,继续执行业务代码
                // 用户处理订单的代码
            } else {
                console.error('验签失败')
            }
        } else {
            console.error('订单号已存在')
        }
    } else {
        console.error('trade_status', bodyObj.trade_status)
    }
    
    return 'success' // 一定要返回'success'给支付宝,否则会重复多次通知
}

// 对object的key进行排序
function ksort(params) {
    let keys = Object.keys(params).sort();
    let newParams = {};
    keys.forEach((key) => {
        newParams[key] = params[key];
    });
    return newParams;
}

2021.08.08补充:
后来开发中发现,前端js自带的fetch请求挺方便的,可以用fetch代替axios

2021.08.11补充:
支付完成跳转回如下页面,方便App端自动跳转回App首页

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>支付宝</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
    </head>
    <body>
        <div id="app" style="text-align: center; padding-top: 50vh;">
            <button onclick="goHome()">返回首页</button>
        </div>
        <script src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
        <script>
            document.addEventListener('UniAppJSBridgeReady', ()=>{
                goHome()
            })
            function goHome() {
                const ua = navigator.userAgent
                if (ua.indexOf('uni-app')>-1 || ua.indexOf('Html5Plus')>-1) {
                    uni.reLaunch({ url: '/pages/home/home' }) // uni.reLaunch在非webview的网页里不执行
                } else {
                    location.replace('/')
                }
            }
        </script>
    </body>
</html>