视频支持拖动进度条播放的实现（基于nginx）

最新推荐文章于 2024-02-24 15:34:39 发布
最新推荐文章于 2024-02-24 15:34:39 发布
阅读量2.5k 收藏 2
点赞数
分类专栏： 前端技术 文章标签： 视频支持拖动进度条播放的实现（基于nginx）
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39306005/article/details/88105214
版权

http协议下的flv/mp4流式播放支持的三个要点：

1 服务器端要支持flv/mp4流式播放，现在nginx或者lighttpd都是支持这样的应用的，还支持mp4的流式播放（默认编译版本一般都是打开了flv流式播放，而mp4要自己编译，若需要，也可以自己编译），但要专门配置。

参考文章《使用Nginx搭建flv流媒体服务器》

http://www.yanghengfei.com/archives/475/

2 播放的flv/mp4有完整的mete信息，其中包括视频分辨率、帧率等信息。有相应的软件对一般的flv上添加这样的标记信息，添加后的也支持一般的应用，而且数据量增加不多

参考文章《x264编码器参数完整对照表》

http://www.php-oa.com/2009/03/09/ffmpeg_x264.html

3 客户端允许发生请求流式播放的请求，并且能够处理获取的流式数据，从随机点开始播放。

如jwplayer支持播放http流媒体。

参考文章《JW Player使用简介》

http://j-coriolanus.blog.163.com/blog/static/64211038200992011745532/

参考文章《基于nginx+jwplayer的flv流媒体》

http://www.iinuu.eu/en/it-guru/flv-streaming-using-nginx-and-jw-player-5-1

首先配置nginx服务支持flv模块功能

⑴查看你的nginx是否已支持flv功能模块

[root@localhost ~]# /usr/local/nginx/sbin/nginx -V //查看nginx服务支持

结果：

nginx version: nginx/0.8.24

built by gcc 4.4.4 20100726 (Red Hat 4.4.4-13) (GCC)

configure arguments: --prefix=/usr/local/nginx --with-http_flv_module --with-http_gzip_static_module --with-http_stub_status_module

分析：我的nginx版本0.8.24，http_flv_module已经开启，支持flv服务。

⑵安装支持flv模块的nginx服务器：

#tar zxvf nginx-0.8.24.tar.gz

#cd nginx-0.8.24

#./configure --prefix=/usr/local/nginx --with-http_flv_module --with-http_gzip_static_module --with-http_stub_status_module //开启flv模块

#make && make install

#/usr/local/nginx/sbin/nginx //启Nginx

⑶nginx服务器配置（nginx.conf文件）

server

{

listen 80;

server_name localhost;

charset utf-8;

location / {

root html;

index index.php index.html index.htm;

}

location ~ .flv {

flv;

limit_rate_after 10m;

limit_conn one 1;

limit_rate 85k;

}

}

使用location 将 .flv的文件指向flv模块即可。

以上使用limit_rate 是为了限速，当 flv视频下载超过10M，则限速到85K，只允许用户开1个进程，也就是先快速缓存可以播放，后面的慢慢下载。

⑷安装支持flv拖放进度条的播放器

上面三步都是安装支持nginx服务支持flv功能的，现在需要支持flv拖放进度条的播放器。

你需要有一个能够播放Flv视频的播放器，很显然，它还需要能够嵌入到网页中。目前比较流行的，功能上也还比较完善的一个Flv播放器就是 JW FLV Media Player（也称为 jwplayer）。它的网址是：

http://www.longtailvideo.com/players/jw-flv-player/

这个播放器支持视频加入广告和视频节目单功能，下载包里面有很全的实例和使用方式，将包中的player.swf（如果是带有Viral插件的，就是player-viral.swf）放到你的网站内，这就是用来提供视频播放的播放器。至于包中其它的文件，都可以不要。

接下来，将播放器嵌入到你的视频播放网页中，直接嵌入，使用Object/Embed代码嵌入：

<embed

type=“application/x-shockwave-flash”

id=“player2”

name=“player2”

src=“player.swf”

width=“328”

height=“200”

allowscriptaccess=“always”

allowfullscreen=“true” flashvars=“file=http://192.168.40.135/test.flv&image=http://192.168.40.135/preview.jpg&autostart=false&type=http&streamer=start”

>

file:“video.flv”, // FLV视频地址

type:“http”, // 数据类型，本文是基于http模式的，这个必须写滴

image:“preview.jpg”,// 开始播放之前的预览图

autostart:“false”, // 是否自动播放

streamer:“start”， // 参数为 “start”,这个参数用于传递给服务器从特定的关键帧开始播放，nginx编译了 flv 模块 所以是支持的。

在使用jwplayer播放视频，并进行跳转时，会赂nginx服务器发起请求，类似

“GET /video.flv?start=27503944 HTTP/1.1” 200 1752013"

“GET /video.flv?start=88336188 HTTP/1.1” 200 13564873"

⑸添加关键帧

如果一个Flv视频要能够被拖到特定点播放，该Flv需要在其metadata中有关键帧的信息。

使用mencoder转换成的flv视频默认每250帧加入一个关键帧。

如果你的Flv视频制作的时候没有这些信息，也是不能拖放播放的。可以使用yamdi来为你的视频加上关键帧信息 ：

安装：

1） [root@localhost ~]#wget http://sourceforge.net/projects/yamdi/files/yamdi/1.4/yamdi-1.4.tar.gz/download

2） [root@localhost ~]#tar zxvf yamdi-1.4.tar.gz

3 ）[root@localhost ~]#cd yamdi-1.4/

4） [root@localhost yamdi-1.4]#make && make install

使用方法：

yamdi -i source.flv -o dest.flv //原视频 输出视频

补充

通过使用nginx-rtmp-module https://github.com/arut/nginx-rtmp-module 来增加对HLS的支持；

nginx-rtmp-module 本身也支持RTMP协议，从而也可以基于nginx来搭建在线直播系统。

乔乔~
关注
专栏目录
利用nginx实现文件上传和进度条功能
aican_yu的专栏
07-10 3510
最近做一个产品，需要实现从网页上传文件给服务器。一般情况下都是采用Ajax异步方式，创建一个iframe，在iframe里面把数据以form方式提交给后端的服务器脚本，由服务器脚本（比如PHP）来负责接收上传的数据。这种方式存在性能和效率的问题。所以，决定采用Nginx的上传模块来完成接收数据的功能，接收完数据后，再去转给后端脚本语言进行后续处理（比如：移动文件、插入文件的信息到数据库中）。同时，
基于nginx-rtmp-module、javaCV、video.js的页面视频播放
bleachj88的博客
03-28 748
作者：huang_jue 项目背景：公司使用海康摄像头对生产环节进行监控。 项目要求：从海康获取RTSP视频流，要求能在网页上播放，且能进行拖动进度条。 实现思路：将RTSP转换成RTMP，以便在页面上可以观看。 实现步骤： 1、使用javaCV开源包转换流 maven依赖 <dependency> ...
DragVideo，一种在播放视频时，可以任意拖拽的方案
01-16
效果图1： 效果图2： 实现思路： 1、播放视频的view选择TextureView 2、ListView下方盖上自定义ViewDragHelper，当在播放视频时，通过自定义ViewDragHelper进行拖动TextureView 3、进行渐变处理，让两个view的文字能够交替显示 4、当TextureView到达右下方时，控制在水平方向上拖动，到达左边界时，如果再滑动，就销毁TextureView 代码分析： 关于ViewDragHelper要注意如下几点： ViewDragHelper.Callback是连接ViewDragHelper与view之间的桥梁（这个view一般是指拥子view的容器即parentView）； ViewDragHelper的实例是通过静态工厂方法创建的；你能够指定拖动的方向； ViewDragHelper可以检测到是否触及到边缘； ViewDragHelper并不是直接作用于要被拖动的View，而是使其控制的视图容器中的子View可以被拖动，如果要指定某个子view的行为，需要在Callback中想办法； ViewDragHelper的本质其实是分析onInterceptTouchEvent和onTouchEvent的MotionEvent参数，然后根据分析的结果去改变一个容器中被拖动子View的位置（ 通过offsetTopAndBottom(int offset)和offsetLeftAndRight(int offset)方法 ），他能在触摸的时候判断当前拖动的是哪个子View； 虽然ViewDragHelper的实例方法 ViewDragHelper create(ViewGroup forParent, Callback cb) 可以指定一个被ViewDragHelper处理拖动事件的对象，但ViewDragHelper类的设计决定了其适用于被包含在一个自定义ViewGroup之中，而不是对任意一个布局上的视图容器使用ViewDragHelper。 1.自定义的CustomViewDragHelper的初始化 ViewDragHelper一般用在一个自定义ViewGroup的内部，比如下面自定义了一个直接继承于ViewGroup的类DragvideoView，DragvideoView内部有一个mDragHelper作为成员变量： // DragVideoView.java public DragVideoView(Context context) { this(context, null); } public DragVideoView(Context context, AttributeSet attrs) { this(context, attrs, 0); } public DragVideoView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); init(); } private void init() { mDragHelper = CustomViewDragHelper.create(this, 1f, new MyHelperCallback()); setBackgroundColor(Color.TRANSPARENT); } 创建一个带有回调接口的ViewDragHelper，这里是用MyHelperCallback，这些都是一些基本使用方法 拖动行为的处理已在注释中给出 // DragVideoView.java private class MyHelperCallback extends CustomViewDragHelper.Callback { //继承CustomViewDragHelper的Callback @Override public boolean tryCaptureView(View child, int pointerId) {//当前view是否允许拖动 return child == mPlayer; //如果是显示视频区域的view } @Override public void onViewDragStateChanged(int state) { //当ViewDragHelper状态发生变化时回调（IDLE,DRAGGING,SETTING[自动滚动时]） if (state == CustomViewDragHelper.STATE_IDLE) { if (mIsMinimum && mDragDirect == HORIZONTAL && mDisappearDirect != SLIDE_RESTORE_ORIGINAL) { if (mCallback != null && mCallback.get() != null) mCallback.get().onDisappear(mDisappearDirect);//水平方向上拖拽消失回调 mDisappearDirect = SLIDE_RESTORE_ORIGINAL; restorePosition(); requestLayoutLightly(); } mDragDirect = NONE; } } @Override public int getViewVerticalDragRange(View child) { //垂直方向拖动的最大距离 int range = 0; if (child == mPlayer && mDragDirect == VERTICAL) { range = mVerticalRange; } Log.d(TAG, ">> getViewVerticalDragRange-range:" + range); return range; } @Override public int getViewHorizontalDragRange(View child) { //横向拖动的最大距离 int range = 0; if (child == mPlayer && mIsMinimum && mDragDirect == HORIZONTAL) { range = mHorizontalRange; } Log.d(TAG, ">> getViewHorizontalDragRange-range:"+range); return range; } @Override public int clampViewPositionVertical(View child, int top, int dy) {//该方法中对child移动的边界进行控制，left , top 分别为即将移动到的位置 int newTop = mTop; Log.d(TAG, ">> clampViewPositionVertical:" + top + "," + dy); if (child == mPlayer && mDragDirect == VERTICAL) { int topBound = mMinTop; int bottomBound = topBound + mVerticalRange; newTop = Math.min(Math.max(top, topBound), bottomBound); } Log.d(TAG, ">> clampViewPositionVertical:newTop-"+newTop); return newTop; } @Override public int clampViewPositionHorizontal(View child, int left, int dx) { //返回横向坐标左右边界值 int newLeft = mLeft; Log.d(TAG, ">> clampViewPositionHorizontal:" + left + "," + dx); if (child == mPlayer && mIsMinimum && mDragDirect == HORIZONTAL) { int leftBound = -mPlayer.getWidth(); int rightBound = leftBound + mHorizontalRange; newLeft = Math.min(Math.max(left, leftBound), rightBound); } Log.d(TAG, ">> clampViewPositionHorizontal:newLeft-"+newLeft+",mLeft-"+mLeft); return newLeft; } @Override public void onViewPositionChanged(View changedView, int left, int top, int dx, int dy) { //view在拖动过程坐标发生变化时会调用此方法，包括两个时间段：手动拖动和自动滚动 Log.d(TAG, ">> onViewPositionChanged:" + "mDragDirect-" + mDragDirect + ",left-" + left + ",top-" + top + ",mLeft-" + mLeft); Log.d(TAG, ">> onViewPositionChanged-mPlayer:left-"+mPlayer.getLeft()+",top-"+mPlayer.getTop()); if (mDragDirect == VERTICAL) { //垂直方向 mTop = top; mVerticalOffset = (float) (mTop - mMinTop) / mVerticalRange; } else if (mIsMinimum && mDragDirect == HORIZONTAL) { // 水平方向 mLeft = left; mHorizontalOffset = Math.abs((float) (mLeft + mPlayerMinWidth) / mHorizontalRange); } requestLayoutLightly(); } @Override public void onViewReleased(View releasedChild, float xvel, float yvel) {// if (mDragDirect == VERTICAL) { //如果拖拽的方向是在垂直方向上 if (yvel > 0 || (yvel == 0 && mVerticalOffset >= 0.5f)) minimize(); else if (yvel < 0 || (yvel == 0 && mVerticalOffset < 0.5f)) maximize(); } else if (mIsMinimum && mDragDirect == HORIZONTAL) { //如果已经最小化窗口，并且是在水平方向上 if ((mHorizontalOffset < LEFT_DRAG_DISAPPEAR_OFFSET && xvel < 0)) slideToLeft(); //向左滑动 else if ((mHorizontalOffset > RIGHT_DRAG_DISAPPEAR_OFFSET && xvel > 0)) slideToRight();// 向右滑动 else slideToOriginalPosition();//原地不动 } } } 当在MainActivity调用ViewDragHelper的setCallback方法时，以上回调就能作用了。当点击节目列表页（第一个显示listview的界面）的item时，调用playVideo()方法，方面内部通过DragVideoView.show方法，就开始显示DragVideoView。这时视频开始播放起来，并且，我们也可以对其进行拖拽了。 // MainActivity.java private void playVideo() { mDragVideoView.show(); if (mMediaPlayer.isPlaying()) return; try { mMediaPlayer.prepare(); } catch (Exception e) { e.printStackTrace(); } mMediaPlayer.start(); } 那么在拖动的过程中，我们要在DragVideoView中重写onTouchEvent方法，如下 // DragVideoView.java @Override public boolean onTouchEvent(MotionEvent event) { boolean isHit = mDragHelper.isViewUnder(mPlayer, (int) event.getX(), (int) event.getY()); if (isHit) { switch (MotionEventCompat.getActionMasked(event)) { case MotionEvent.ACTION_DOWN: { mDownX = (int) event.getX(); mDownY = (int) event.getY(); } break; case MotionEvent.ACTION_MOVE: if (mDragDirect == NONE) { int dx = Math.abs(mDownX - (int) event.getX());//上一次getX()时和在MOVE过程中getX()的差值 int dy = Math.abs(mDownY - (int) event.getY());//上一次getY()时和在MOVE过程中getY()的差值 int slop = mDragHelper.getTouchSlop();//用户拖动的最小距离 if (Math.sqrt(dx * dx + dy * dy) >= slop) {//判断是水平方向拖拽，还是垂直方向上拖拽 if (dy >= dx) mDragDirect = VERTICAL; else mDragDirect = HORIZONTAL; } } break; case MotionEvent.ACTION_UP: { if (mDragDirect == NONE) { int dx = Math.abs(mDownX - (int) event.getX()); int dy = Math.abs(mDownY - (int) event.getY()); int slop = mDragHelper.getTouchSlop(); if (Math.sqrt(dx * dx + dy * dy) < slop) { mDragDirect = VERTICAL; if (mIsMinimum) maximize(); else minimize(); } } } break; default: break; } } mDragHelper.processTouchEvent(event); return isHit; } 以上方法最后，我们调用了，mDragHelper.processTouchEvent(event);也就是我们自定义的CustomViewDragHelper类，这个方法没有改动，就是ViewDragHelper的processTouchEvent方法。(篇幅原因，建议可以看下源码) 总结下这个方法 在processTouchEvent中对ACTIONDOWN、ACTIONMOVE和ACTION_UP事件进行了处理： 1.在ACTION_DOWN中调用回调接口中的tryCaptureView方法，看当前touch的view是否允许拖动 2.在ACTION_MOVE中，view的坐标发生改变，调用回调接口中的onViewPositionChanged方法，根据坐标信息对view进行layout，通过ViewHelper这个类中的setScaleX、setScaleY方法，实现在拖动的过程中view在XY坐标上进行相应比例的缩放； 3.在ACTIONUP后调用回调接口中的onViewReleased方法，此方法中一个重要的任务是在ACTIONUP事件后，实现view的自动滑动，这里主要是使用了ViewDragHelper中smoothSlideViewTo方法， // CustomViewDragHelper.java public boolean smoothSlideViewTo(View child, int finalLeft, int finalTop) { mCapturedView = child; mActivePointerId = INVALID_POINTER; boolean continueSliding = forceSettleCapturedViewAt(finalLeft, finalTop, 0, 0); if (!continueSliding && mDragState == STATE_IDLE && mCapturedView != null) { // If we're in an IDLE state to begin with and aren't moving anywhere, we // end up having a non-null capturedView with an IDLE dragState mCapturedView = null; } return continueSliding; } 接着到达forceSettleCapturedViewAt方法 // CustomViewDragHelper.java private boolean forceSettleCapturedViewAt(int finalLeft, int finalTop, int xvel, int yvel) { final int startLeft = mCapturedView.getLeft(); final int startTop = mCapturedView.getTop(); final int dx = finalLeft - startLeft; final int dy = finalTop - startTop; if (dx == 0 && dy == 0) { // Nothing to do. Send callbacks, be done. mScroller.abortAnimation(); setDragState(STATE_IDLE); return false; } final int duration = computeSettleDuration(mCapturedView, dx, dy, xvel, yvel); mScroller.startScroll(startLeft, startTop, dx, dy, duration); setDragState(STATE_SETTLING); return true; } 上面start了ViewDragHelper中的mScroller，在滑动过程中，通过重写computeScroll方法，可用用ViewCompat.postInvalidateOnAnimation(this)方法重绘view // DragVideoView.java @Override public void computeScroll() { if (mDragHelper.continueSettling(true)) { ViewCompat.postInvalidateOnAnimation(this); } } 最后由于拖拽过程中的显示视频的TextureView会不断变化，通过设置TextureView.SurfaceTextureListener，来监听当前TextureView的变化过程。 //MainActivity.java @Override public void onSurfaceTextureAvailable(SurfaceTexture surface, int width, int height) { mMediaPlayer.setSurface(new Surface(surface)); } @Override public void onSurfaceTextureSizeChanged(SurfaceTexture surface, int width, int height) { Log.d(TAG, ">> onSurfaceTextureSizeChanged width=" + width + ", height=" + height); if (width == 540 && height == 303) {//如果视频是最小时， mProgramListView.setAlpha(1.0f);//让节目列表进行展现，变成不透明 } else { //TextureView在拖动过程中 float f = (float) ((1.0 - ((float)width/1080))* 1.0f); Log.d(TAG, ">> onSurfaceTextureSizeChanged f=" + f ); mProgramListView.setAlpha(f);//通过设置比例来让节目列表的listview渐变成不透明。视频区域越小，节目列表变得越不透明（即我们能看到） } mProgramListView.setVisibility(View.VISIBLE); } @Override public boolean onSurfaceTextureDestroyed(SurfaceTexture surface) { finish(); return true; } @Override public void onSurfaceTextureUpdated(SurfaceTexture surface) { }
HTTP协议下可拖动时间轴播放FLV的实现（伪流媒体）
xiunai78的专栏
07-12 1万+
HTTP协议下实现FLV的播放其实并不复杂，当初实现的原理是使用了flowPlayer插件实现的，效果还不错。但仍有两大问题影响着客户的访问情绪： 1.预加载时页面卡死，似乎没有边下边播。 2.偶尔边下边播，却无法拖动时间轴至未下载的部分。相信很多人也遇到该问题。 一度想采用专门的媒体服务器如Adobe的FMS去实现该功能，后多方查找资料，发现采用媒体服务器成本较高，且效率并不是
html5 javascript实现的视频自定义进度条
07-08
用html5 javascript实现的视频自定义进度条。可以直接用到开发视频监控回放的进度条。纯javascript css html 实现。本资源已完成了视频播放的开始，暂停，调节进度等功能。
apache实现视频拖动
11-18
第一步，下载mod_flvx.so和mod_h264_streaming.so并放到apache目录下的modules文件夹下 mod_flvx.so mod_h264_streaming.so 把这两个文件放到，apache的modules目录中，然后查找httpd.conf这个文件，打开编辑，找到类似这样的LoadModule在他们的下面加上以下两段 LoadModule flvx_modu le modules/mod_flvx.so AddHandler flv-stream .flv LoadModule h264_streaming_module modules/mod_h264_streaming.so AddHandler h264-streaming.extensions .mp4 第三步，重启apache服务
vue 中实现音视频播放进度条（可拖拽，满足常见开发需求）
最新发布
jiangjunyuan168的博客
02-24 7477
该款插件可作为音频、视频播放的进度条，用于控制音频、视频的播放（播放进度、暂停开始、播放倍速、自定义刻度 等）。同时，插件提供了多方面的配置选项，使用者可以通过个性化配置来达到自己想要的效果（下面会对配置项进行详解），拓展性极高。在播放的过程中插件会返回当前播放的播放信息（如当前播放到的秒（进度）、进度条被拖拽时的回调、进度条拖拽后的回调等），根据这些返回信息，我们拿到后根据实际的需求来做不同处理就可以实现控制播放的效果。
nginx搭建流媒体服务器(flv,mp4视频播放网站).zip
01-12
在【描述】中，虽然内容重复了标题，但我们可以推断，这个压缩包包含了一套完整的教程，教你如何设置Nginx以实现FLV和MP4视频的在线播放。 【标签】"流媒体 nginx flv"进一步明确了我们将专注于Nginx服务器与流媒体...
Nginx搭建流媒体FLV视频服务器配置示例
09-30
这样用户就可以在播放时拖拽进度条到任意位置而无需等待视频下载。虽然FLV格式本身默认不支持拖拽，但是可以通过添加关键帧来实现。添加关键帧时，可以使用Yamdi或FlvTool2等工具。关键帧的添加通常按照固定时间间隔...
Windows环境下用jwplayer+Nginx搭建视频点播服务器
08-31
该资源文件用于 Windows服务器环境下flv视频播放——对未缓冲进度条实现拖动 该nginx服务器已经做好了相关的配置，支持视频的播放。相关文章说明请参考http://hi.baidu.com/mtb573/item/6a7115558f9b649f8c12ed9e
js实现播放器，有进度条，能控制音量
01-24
很好的一个js播放器哦，有进度条，有歌词等等，给media player 没区别。
Nginx下搭建flv视频服务器且支持视频拖动进度条播放.docx
12-02
目前，由于Flash的流行，网络上绝大多数的微视频网站都采用了Flv格式来播放视频。 在互联网上播放视频，有两种方式，一种是文件方式，即通过HTTP协议访问视频文件，这种方式的缺点是不能从特定的帧开始播放；另外一种就是采用专门的流媒体服务器，这种方式的缺点是要搭建复杂的流媒体服务器。不过，现在有了一种集合了以上两种方式优点的一种解决方案，即通过HTTP来实现伪流媒体。本文描述的就是这样的一种解决方案。 首先配置nginx服务支持flv模块功能
关于MP4视频拖动的原理与分析（一）
热门推荐
吹牛要纳税的专栏
07-22 1万+
本来想说说关于mp4和一些常见视频文件格式方面的历史。现在想想没啥必要，毕竟本文是在讲关于mp4点播拖动方面的技术细节。绪论，前言神马的显得有点多余。说起MP4，不得不提“Digital container format”的概念。维基百科给出解释： A container or wrapper format is a metafile format whose specification des
Nginx配置支持mp4视频流播放,超简单
hua0721的博客
11-28 1万+
Nginx配置支持mp4视频流播放,超简单，配置之后支持边下边播，支持快进快退
video标签播放视频无法拖动进度条（使用nginx解决）
qq_34465338的博客
05-07 9800
video标签播放视频无法拖动进度条（使用nginx解决）
vue3实现video控件的h5端进度条拖拽与跳转
qq_42039912的博客
09-09 2323
vue3 + js + less 实现video进度条拖拽和跳转
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值