目录
1.vue-video-player 插件下载
npm install vue-video-player --save
2.推流/m3u8 的下载
npm install --save videojs-contrib-hls
// 下面引入 位置 全部在node_modules文件依赖里面找到需要对应文件引入即可
import VideoPlayer from 'vue-video-player'
import 'vue-video-player/src/custom-theme.css'
import 'video.js/dist/video-js.css'
Vue.use(VideoPlayer)
window.videojs = VideoPlayer.videojs
// 全局引入中文提示
require('video.js/dist/lang/zh-CN.js')
//引入 hls,视频直播(m3u8)必须引入的
import 'videojs-contrib-hls'
//播放rtmp视频
import 'videojs-flash'
type:"video/webm" // 可以播放，用ogg
type:"video/ogg" // 可以播放，用webm
type:"video/3gp" // 可以播放
type:"video/mp4" // 可以播放
type:"video/avi" // 打不开 无法播放
type:"video/flv" // 打不开 可以使用f
type:"video/mkv" // 打不开 使用video
type:"video/mov" // 打不开 使用video
type:"video/mpg" // 打不开 未测试
type:"video/swf" // 打不开 未测试
type:"video/ts" // 打不开 未测试
type:"video/wmv" // 打不开 未测试
type:"video/vob" // 没转化 未测试
type:"video/mxf" // 转化出错 未测试
type::"video/rm" // 转化出错 未测试
this.$refs.videoPlayer这个代表拿div上面的ref组件,后面是方法
this.$refs.videoPlayer.player.pause() // 暂停视频
this.$refs.videoPlayer.player.play() // 播放视频
this.$refs.videoPlayer.player.playbackRate(2) // 改变播放速度
this.$refs.videoPlayer.player.currentTime(5) // 改变播放进度位置
this.$refs.videoPlayer.player.volume(0.1) // 音量大小值在0-1
this.$refs.videoPlayer.player.muted(true); // true 代表静音 ,f
this.playerOptions['sources'][0]['src'] = "http:url...." // 切换音视频资源路
this.$refs.videoPlayer.player.load(); // 视频加载
this.$refs.videoPlayer.player.requestFullscreen(); // 直接全屏 如果当
this.$refs.videoPlayer.player.exitFullscreen(); // 在全屏模式下，将
this.$refs.videoPlayer.player.enterFullWindow(); // 当环境不支持全屏
this.$refs.videoPlayer.player.reset(); // 重置播放器
this.$refs.videoPlayer.player.currentSources() // 返回当前播放源信
this.$refs.videoPlayer.player.preload(val); // 获取或者设置预加
this.$refs.videoPlayer.player.controls(false); // 播放控件是否显示
//添加切换清晰度 按钮
// 监听播放
onPlayerPlay(){
this.$refs.videoPlayer.player.play() // 播放
// 播放的时候判断一下 有没有 清晰度这个按钮
// !this.$('#vjsControl')
if(!document.getElementById('vjsControl')){
this.addTool()
}
},
addTool(){
let that = this
this.$(".vjs-control-bar").append(
`<button class="vjs-control" id="vjsControl">${text}</button>`)
let vjsControl = document.getElementById('vjsControl')
vjsControl.addEventListener('click',that.resourceClcik)
// document.addEventListener()
},
// 切换资源
resourceClcik(){
let text = this.$('#vjsControl').text()
if(text === '标清') {
this.$('#vjsControl').text('超清')
// this.playerOptions.sources[0].src = ''
} else if(text === '超清') {
this.$('#vjsControl').text('标清')
// this.playerOptions.sources[0].src = ''
}
}
基础案例,可以直接复制到vue页面查看效果
是否禁止拖动进度条可以设置,在样式里面,被注释掉了,可以打开
<template>
<div class="course_node_video">
<video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions"
@ready="playerReadied" @pause="onPlayerPause($event)" @timeupdate="onPlayerTimeupdate($event)">
</video-player>
</div>
</template>
<script>
export default {
data () {
return {
playerOptions: {
// 可选的播放速度
playbackRates: [0.5, 1.0, 1.5, 2.0],
// 如果为true,浏览器准备好时开始回放。
autoplay: false,
// 默认情况下将会消除任何音频。
muted: false,
// 是否视频一结束就重新开始。
loop: false,
// 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
preload: 'auto',
// 语言设置
language: 'zh-CN',
// 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
aspectRatio: '16:9',
// 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
fluid: true,
sources: [{
// 视频类型
type: "video/mp4",
// 视频地址
src: 'https://qkodo.playlistmusic.com.cn/transcode_1080/video/2dd0dd6bb83b71d16c6313d0411d26aa.mp4'
}],
// 视频地址
poster: '',
// 允许覆盖Video.js无法播放媒体源时显示的默认信息。
notSupportedMessage: '此视频暂无法播放，请稍后再试',
//底栏控制器
controlBar: {
// 当前时间和持续时间的分隔符
timeDivider: true,
// 显示持续时间
durationDisplay: true,
// 是否显示剩余时间功能
remainingTimeDisplay: false,
// 是否显示全屏按钮
fullscreenToggle: true
}
},
currentTime: 7, // 秒数设置 单位默认s
}
},
methods: {
/* 获取视频播放进度 */
onPlayerTimeupdate (player) {
this.currentTime = player.cache_.currentTime
},
/* 设置视频开始的进度 */
playerReadied (player) {
player.currentTime(this.currentTime)
},
// 暂停回调 将视频播放的时间保存
onPlayerPause (player) {
console.log('player pause currentTime!', player.cache_.currentTime);
// let that = this;
// 存储player.currentTime 是当前暂停时间 用于下次断续播放
},
},
beforeMount () {
// let id = this.$route.query.id;
// if (id != undefined && id != null) {
// //编辑
// localStorage.setItem("videoId", id);
// // this.loadCourseNodeVideo(id);
// } else {
// id = localStorage.getItem("videoId");
// if (id != undefined && id != null) {
// // this.loadCourseNodeVideo(id);
// } else {
// localStorage.removeItem("videoId");
// }
// }
}
}
</script>
<style scoped>
.course_node_video {
width: 100%;
height: auto;
margin: 0 auto;
text-align: center;
}
/* 是否设置禁止进度条被拖动样式 */
/* .course_node_video >>> .vjs-progress-control {
pointer-events: none;
} */
</style>
完整案例,可以直接复制到vue页面查看效果,有需要的功能自行复制到基础版里面使用
里面有视频观看起点设置
这里面style没有设置scoped注意,设置scoped里面底栏可能不生效
<template>
<div class="box">
<div class="course_node_video">
<video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions"
@ready="playerReadied" @pause="onPlayerPause($event)" @timeupdate="onPlayerTimeupdate($event)"
customEventName="customstatechangedeventname" @play="onPlayerPlay" @ended="onPlayerEnded"
@waiting="onPlayerWaiting" @playing="onPlayerPlaying" @loadeddata="onPlayerLoadeddata"
@canplay="onPlayerCanplay" @canplaythrough="onPlayerCanplaythrough" @statechanged="playerStateChanged">
</video-player>
</div>
</div>
</template>
<script>
export default {
data () {
return {
// 视频播放器配置
playerOptions: {
// 自定义设置播放速度
playbackRates: [0.7, 1.0, 1.5, 2.0],
// 如果为true,浏览器准备好时开始回放。
autoplay: false,
// 默认情况下将会消除任何音频。
muted: false,
// 是否视频一结束就重新开始。
loop: false,
// 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
preload: 'auto',
// zh-CN 需要main.js全局引入才可以生效
language: 'zh-CN',
// 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
aspectRatio: '16:9',
// 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
fluid: true,
sources: [{
// 视频格式
type: "video/mp4",
// 视频地址
src: 'https://qkodo.playlistmusic.com.cn/transcode_1080/video/2dd0dd6bb83b71d16c6313d0411d26aa.mp4'
}],
// 视频封面地址
poster: '',
// 允许覆盖Video.js无法播放媒体源时显示的默认信息。
notSupportedMessage: '此视频暂无法播放，请稍后再试',
controlBar: {
// 分割线/显示隐藏
timeDivider: true,
// 显示总时间
durationDisplay: true,
// 是否显示剩余时间功能
remainingTimeDisplay: false,
// 是否显示全屏按钮
fullscreenToggle: true,
// 播放暂停按钮
playToggle: true,
// 音量控制
volumeMenuButton: false,
// 当前播放时间
currentTimeDisplay: true,
// 进度条显示隐藏
progressControl: true,
// 直播流时，显示LIVE
liveDisplay: true,
// 播放速率，当前只有html5模式下才支持设置播放速率 如果false右下角 1X 播放速率将会隐藏
playbackRateMenuButton: true,
}
},
//视频观看起点
// playtimes:"", 有请求 接口方式设置视频播放起点 步骤:111111111
// 秒数设置 单位默认s 进度条位置设置 视频观看起点设置 没有 请求接口方式设置视频播放起点 步骤:111111111
currentTime: 7,
}
},
// created () { 有请求 接口方式设置视频播放起点 步骤:2222222222
// this.fetchData();//获取的视频从何处播放的时间点
// this.playerOptions.sources[0].src = '视频地址'//视频地址
// },
methods: {
//接口获取的视频观看起点 有请求 接口方式设置视频播放起点 步骤:333333333
// fetchData (id) { //id为传的参数
// this.$http
// .get(`请求地址` + id, {
// })
// .then(res => {
// //console.log(res.data)
// this.playtimes = res.data;
// });
// },
//设置视频开始的进度 准备就绪(预加载前会调用)(初始化调用) 没有 请求接口方式设置视频播放起点 步骤:222222222
playerReadied (player) {
player.currentTime(this.currentTime)
// player.currentTime(playtimes) //有请求 接口方式设置视频播放起点 步骤:555555555
},
//获取视频播放进度 进度更新(当前播放位置发生变化时触发)(视频接收到新内容会一直调用)(高频调用)
onPlayerTimeupdate (player) {
this.currentTime = player.cache_.currentTime
// console.log(player);
},
// 暂停回调 将视频播放的时间保存 暂停回调(暂停时调用)(用户操作调用)
onPlayerPause (player) {
console.log('player pause currentTime!', player.cache_.currentTime);
// let that = this;
// 存储player.currentTime 是当前暂停时间 用于下次断续播放
},
// 播放回调(播放时会调用)(用户操作调用)
onPlayerPlay (player) {
console.log('播放', player)
this.$emit('onPlayerPlay', player)
},
// 播放状态改变回调
playerStateChanged (playerCurrentState) {
console.log('数据变化', playerCurrentState)
this.$emit('playerStateChanged', playerCurrentState)
},
//视频播完回调 (结束)(视频播放完毕调用)
onPlayerEnded (player) {
console.log('结束', player)
this.$emit('onPlayerEnded', player)
},
// 等待(视频中出现loading就会调用,加载时调用)(高频调用)
onPlayerWaiting (player) {
console.log('等待', player)
this.$emit('onPlayerWaiting', player)
},
// 播放中(进入播放状态会调用)(等待onPlayerWaiting和播放onPlayerPlay执行后会调用)(高频调用)
onPlayerPlaying (player) {
console.log('播放中', player)
this.$emit('onPlayerPlaying', player)
},
// 当播放器在当前播放位置下载数据时触发
onPlayerLoadeddata (player) {
console.log('预加载', player)
this.$emit('onPlayerLoadeddata', player)
},
// 媒体的readyState为HAVE_FUTURE_DATA或更高(预加载onPlayerLoadeddata调用后会调用)(初始化调用)
onPlayerCanplay (player) {
console.log('是否播放', player)
this.$emit('onPlayerCanplay', player)
},
// 能够从头到尾播放(是否播放onPlayerCanplay调用后会调用)(初始化调用)这意味着可以在不缓冲的情况下播放整个媒体文件
onPlayerCanplaythrough (player) {
console.log('能够从头到尾播放', player)
this.$emit('onPlayerCanplaythrough', player)
}
},
// watch: { //有 请求接口方式设置视频播放起点 步骤:44444444444
// playtimes (val, oldVal) {//普通的watch监听
// console.log("playtimes: " + val);
// this.playerReadied(this.$refs.videoPlayer.player, val);
// },
// }
// beforeMount () {
// let id = this.$route.query.id;
// if (id != undefined && id != null) {
// //编辑
// localStorage.setItem("videoId", id);
// // this.loadCourseNodeVideo(id);
// } else {
// id = localStorage.getItem("videoId");
// if (id != undefined && id != null) {
// // this.loadCourseNodeVideo(id);
// } else {
// localStorage.removeItem("videoId");
// }
// }
// },
}
</script>
<style>
/* 盒子大小设置,视频在盒子内铺满且自适应 */
/* .box {
width: 50%;
margin: 100px auto;
} */
/* 重置样式也需要全局挂载 */
* {
margin: 0;
padding: 0;
}
.course_node_video {
width: 100%;
height: auto;
margin: 0 auto;
text-align: center;
}
/* 是否禁止拖动进度条 >>> 深度选择器 */
/* .course_node_video >>> .vjs-progress-control {
pointer-events: none;
} */
/* 这里深度选择器这种生效,需要去掉style标签里面的scoped才可以生效使用,才可以铺满屏幕 完整案例,可以直接复制到vue页面查看效果,有需要的功能自行复制到基础版里面使用*/
::v-deep video {
width: 100% !important;
/* 我的容器高度设置的是100vh-95px，你们根据你们容器高度设置视频高度即可 */
height: calc(100vh - 95px) !important;
/* 消除两边留白 */
object-fit: fill;
}
/* 播放器底栏控制 下面自定义按钮样式 如果不需要可以注释掉 就自动变为初始播放样式 */
.video-js .vjs-big-play-button .vjs-icon-placeholder:before {
content: '播放视频';
font-size: 18px;
line-height: 3.5;
letter-spacing: 2px;
text-align: center;
overflow: hidden;
border: 0;
}
.video-js .vjs-fullscreen-control .vjs-icon-placeholder:before,
.vjs-icon-fullscreen-enter:before {
content: '全屏';
font-size: 15px;
line-height: 2.8;
}
.video-js.vjs-fullscreen .vjs-fullscreen-control .vjs-icon-placeholder:before,
.vjs-icon-fullscreen-exit:before {
content: '退出';
font-size: 15px;
line-height: 2.8;
}
.video-js .vjs-play-control .vjs-icon-placeholder:before {
content: '播放';
font-size: 15px;
line-height: 2.8;
}
.video-js .vjs-play-control.vjs-playing .vjs-icon-placeholder:before {
content: '暂停';
font-size: 15px;
line-height: 2.8;
}
.video-js .vjs-play-control.vjs-ended .vjs-icon-placeholder:before {
content: '重播';
font-size: 15px;
line-height: 2.8;
}
</style>
这个案例加了几个按钮,通过自定义按钮,实现这几个功能,源码如下
<template>
<div class="box">
<div class="course_node_video">
<video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions"
@ready="playerReadied" @pause="onPlayerPause($event)" @timeupdate="onPlayerTimeupdate($event)"
customEventName="customstatechangedeventname" @play="onPlayerPlay" @ended="onPlayerEnded"
@waiting="onPlayerWaiting" @playing="onPlayerPlaying" @loadeddata="onPlayerLoadeddata"
@canplay="onPlayerCanplay" @canplaythrough="onPlayerCanplaythrough" @statechanged="playerStateChanged">
</video-player>
<div class="footer">
<div class="list" @click="videoPlay">播放</div>
<div class="list" @click="videoPause">停止</div>
<div class="list" @click="videoPosition">播放位置</div>
<div class="list" @click="videoDoubleSpeed">倍速</div>
<div class="list" @click="videoMute">静音</div>
</div>
</div>
</div>
</template>
<script>
export default {
data () {
return {
playerOptions: {
playbackRates: [0, 0.5, 1.0, 1.5, 2.0], // 可选的播放速度
autoplay: false, // 如果为true,浏览器准备好时开始回放。
muted: false, // 默认情况下将会消除任何音频。
loop: false, // 是否视频一结束就重新开始。
preload: 'auto', // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
language: 'zh-CN', // zh-CN 需要main.js全局引入才可以生效
aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
sources: [{
type: "video/mp4", // 类型
src: 'https://qkodo.playlistmusic.com.cn/transcode_1080/video/2dd0dd6bb83b71d16c6313d0411d26aa.mp4' // url地址https://qkodo.playlistmusic.com.cn/transcode_1080/video/2dd0dd6bb83b71d16c6313d0411d26aa.mp4
}],
poster: '', // 封面地址
notSupportedMessage: '此视频暂无法播放，请稍后再试', // 允许覆盖Video.js无法播放媒体源时显示的默认信息。
controlBar: {
// 当前时间和持续时间的分隔符
timeDivider: true,
// 显示持续时间
durationDisplay: true,
// 是否显示剩余时间功能
remainingTimeDisplay: false,
// 是否显示全屏按钮
fullscreenToggle: true,
//播放暂停按钮
playToggle: true,
//音量控制
volumeMenuButton: false,
//当前播放时间
currentTimeDisplay: true,
//点播流时，播放进度条，seek控制
progressControl: true,
//直播流时，显示LIVE
liveDisplay: true,
//播放速率，当前只有html5模式下才支持设置播放速率
playbackRateMenuButton: true,
}
},
// currentTime: 7, // 秒数设置 单位默认s 进度条位置设置 , 进入页面直接开始位置一一一一一一
playtimes: 7, // 通过点击videoPosition事件改变视频位置二二二二二
}
},
methods: {
// 视频播放
videoPlay () {
// this.player.play();
// this.playerOptions.controlBar.playToggle = false;
this.$refs.videoPlayer.player.play();
},
// 视频暂停
videoPause () {
this.$refs.videoPlayer.player.pause();
},
// 视频位置
videoPosition () { // 通过点击videoPosition事件改变视频位置二二二二二
this.$refs.videoPlayer.player.currentTime(this.playtimes)
},
// 视频倍速
videoDoubleSpeed () {
//https://www.zhangxinxu.com/study/201807/video-playbackrate.html
// https://blog.csdn.net/qq_35153373/article/details/112183508
this.$refs.videoPlayer.player.playbackRate(2) // 这个能设置固定倍速
// var button = document.getElementsByTagName('vjs-playback-rate')
// button.addEventListener('change', function () {
// this.$refs.videoPlayer.player.playbackRate = this.playerOptions.playbackRates;
// });
// this.$refs.videoPlayer.player.ready(function () {
// const num = Math.round(Math.random()*5+5);
// // 定义一个随机常数倍数
// var _this = this
// //速率
// setTimeout(function () {
// // _this.playbackRate(parseFloat(10));// 能设定固定值
// _this.playbackRate(parseFloat(num)); // 随机的
// }, 20);
// });
},
// 视频静音
videoMute () {
this.$refs.videoPlayer.player.muted(true);
},
//获取视频播放进度 进度更新(当前播放位置发生变化时触发)(视频接收到新内容会一直调用)(高频调用)
onPlayerTimeupdate (player) {
// this.currentTime = player.cache_.currentTime 进度条位置设置 , 进入页面直接开始位置一一一一一一
console.log(player);
},
/* 设置视频开始的进度 准备就绪(预加载前会调用)(初始化调用) */
playerReadied (player) {
player.currentTime(this.currentTime)
},
// 暂停回调 将视频播放的时间保存 暂停回调(暂停时调用)(用户操作调用)
onPlayerPause (player) {
console.log('player pause currentTime!', player.cache_.currentTime);
// let that = this;
// 存储player.currentTime 是当前暂停时间 用于下次断续播放
},
// 播放回调(播放时会调用)(用户操作调用)
onPlayerPlay (player) {
console.log('播放', player)
this.$emit('onPlayerPlay', player)
},
// 播放状态改变回调
playerStateChanged (playerCurrentState) {
console.log('数据变化', playerCurrentState)
this.$emit('playerStateChanged', playerCurrentState)
},
//视频播完回调 (结束)(视频播放完毕调用)
onPlayerEnded (player) {
console.log('结束', player)
this.$emit('onPlayerEnded', player)
},
// 等待(视频中出现loading就会调用,加载时调用)(高频调用)
onPlayerWaiting (player) {
console.log('等待', player)
this.$emit('onPlayerWaiting', player)
},
// 播放中(进入播放状态会调用)(等待onPlayerWaiting和播放onPlayerPlay执行后会调用)(高频调用)
onPlayerPlaying (player) {
console.log('播放中', player)
this.$emit('onPlayerPlaying', player)
},
// 当播放器在当前播放位置下载数据时触发
onPlayerLoadeddata (player) {
console.log('预加载', player)
this.$emit('onPlayerLoadeddata', player)
},
// 媒体的readyState为HAVE_FUTURE_DATA或更高(预加载onPlayerLoadeddata调用后会调用)(初始化调用)
onPlayerCanplay (player) {
console.log('是否播放', player)
this.$emit('onPlayerCanplay', player)
},
// 能够从头到尾播放(是否播放onPlayerCanplay调用后会调用)(初始化调用)这意味着可以在不缓冲的情况下播放整个媒体文件
onPlayerCanplaythrough (player) {
console.log('能够从头到尾播放', player)
this.$emit('onPlayerCanplaythrough', player)
}
},
beforeMount () {
// let id = this.$route.query.id;
// if (id != undefined && id != null) {
// //编辑
// localStorage.setItem("videoId", id);
// // this.loadCourseNodeVideo(id);
// } else {
// id = localStorage.getItem("videoId");
// if (id != undefined && id != null) {
// // this.loadCourseNodeVideo(id);
// } else {
// localStorage.removeItem("videoId");
// }
// }
}
}
</script>
<style>
.box {
width: 50%;
margin: 100px auto;
}
/* 重置样式也需要全局挂载 */
* {
margin: 0;
padding: 0;
}
.course_node_video {
width: 100%;
height: auto;
margin: 0 auto;
text-align: center;
/* object-fit:fill; */
}
/* 是否禁止拖动进度条 */
/* .course_node_video >>> .vjs-progress-control {
pointer-events: none;
} */
/* 这里深度选择器这种生效,需要去掉style标签里面的scoped才可以生效使用,才可以铺满屏幕 */
::v-deep video {
width: 100% !important;
/* 我的容器高度设置的是100vh-95px，你们根据你们容器高度设置视频高度即可 */
height: calc(100vh - 95px) !important;
/* 消除两边留白 */
object-fit: fill;
}
.footer {
width: 100%;
height: 50px;
/* border: 1px solid red; */
/* background-color: rgb(67,77,71); */
flex-direction: row;
display: flex;
justify-content: space-between;
}
.footer .list {
width: 15%;
height: 100%;
/* background-color: rgba(255, 255, 255, 0.1); */
background-color: rgb(67, 77, 71);
border: 1px solid rgb(224, 208, 208);
color: #fff;
line-height: 2.8;
}
</style>
感觉文章好的话记得点个心心和关注和收藏，有错的地方麻烦指正一下，如果需要转载,请标明出处，多谢！！！
在选择我想要运行操作的频率时，唯一的选项是“每天”、“每小时”和“每10分钟”。谢谢!我想为我的Rails3.1应用程序运行调度程序。 最佳答案 这不是一个优雅的解决方案，但您可以安排它每天运行，并在实际开始工作之前检查日期是否为当月的第一天。 关于ruby-如何每月在Heroku运行一次Scheduler插件？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/8692687/
我对最新版本的Rails有疑问。我创建了一个新应用程序(railsnewMyProject)，但我没有脚本/生成，只有脚本/rails，当我输入ruby./script/railsgeneratepluginmy_plugin"Couldnotfindgeneratorplugin.".你知道如何生成插件模板吗？没有这个命令可以创建插件吗？PS:我正在使用Rails3.2.1和ruby1.8.7[universal-darwin11.0] 最佳答案 随着Rails3.2.0的发布，插件生成器已经被移除。查看变更日志here.现在
SPI接收数据左移一位问题目录SPI接收数据左移一位问题一、问题描述二、问题分析三、探究原理四、经验总结最近在工作在学习调试SPI的过程中遇到一个问题——接收数据整体向左移了一位（1bit）。SPI数据收发是数据交换，因此接收数据时从第二个字节开始才是有效数据，也就是数据整体向右移一个字节（1byte）。请教前辈之后也没有得到解决，通过在网上查阅前人经验终于解决问题，所以写一个避坑经验总结。实际背景：MCU与一款芯片使用spi通信，MCU作为主机，芯片作为从机。这款芯片采用的是它规定的六线SPI，多了两根线：RDY和INT，这样从机就可以主动请求主机给主机发送数据了。一、问题描述根据从机芯片手
项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明：前端使用微信微信小程序开发工具：后端使用ssm：VU
动漫制作技巧是很多新人想了解的问题，今天小编就来解答与大家分享一下动漫制作流程，为了帮助有兴趣的同学理解，大多数人会选择动漫培训机构，那么今天小编就带大家来看看动漫制作要掌握哪些技巧？一、动漫作品首先完成草图设计和原型制作。设计草图要有目的、有对象、有步骤、要形象、要简单、符合实际。设计图要一致性，以保证制作的顺利进行。二、原型制作是根据设计图纸和制作材料，可以是手绘也可以是3d软件创建。在此步骤中，要注意的问题是色彩和平面布局。三、动漫制作制作完成后，加工成型。完成不同的表现形式后，就要对设计稿进行加工处理，使加工的难易度降低，并得到一些基本准确的概念，以便于后续的大样、准确的尺寸制定。四、
2022/8/4更新支持加入水印水印必须包含透明图像，并且水印图像大小要等于原图像的大小pythonconvert_image_to_video.py-f30-mwatermark.pngim_dirout.mkv2022/6/21更新让命令行参数更加易用新的命令行使用方法pythonconvert_image_to_video.py-f30im_dirout.mkvFFMPEG命令行转换一组JPG图像到视频时，是将这组图像视为MJPG流。我需要转换一组PNG图像到视频，FFMPEG就不认了。pyav内置了ffmpeg库，不需要系统带有ffmpeg工具因此我使用ffmpeg的python包装p
Transformers开始在视频识别领域的“猪突猛进”，各种改进和魔改层出不穷。由此作者将开启VideoTransformer系列的讲解，本篇主要介绍了FBAI团队的TimeSformer，这也是第一篇使用纯Transformer结构在视频识别上的文章。如果觉得有用，就请点赞、收藏、关注！paper:https://arxiv.org/abs/2102.05095code(offical):https://github.com/facebookresearch/TimeSformeraccept:ICML2021author:FacebookAI一、前言Transformers(VIT)在图
您认为可以作为插件很好地存在于您的Rails应用程序中必须实现的哪些行为？您过去曾搜索过哪些插件功能但找不到？哪些现有的Rails插件可以改进或扩展，如何改进或扩展？ 最佳答案 我希望在管理界面中看到一个引擎插件，它提供了应用程序中所有模型的仪表板摘要，以及可配置的事件图表。 关于ruby-on-rails-您希望看到哪些Rails插件？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questio
我们正在使用Vagrant进行部署，我们最终希望将此集群部署在Rackspace上。vagrant-rackspace插件是一个自然的选择，但它有一些错误，这些错误未包含在最新的0.1.1版本中(notablythatvagrantprovisiondoesn'twork)。我已经在我的personalfork中解决了这个问题通过合并其他人的工作来对存储库进行改造。是否可以从github安装vagrant插件？显而易见的事情没有奏效:[unix]$vagrantplugininstallvagrant-rackspace--plugin-sourcehttps://github.com
目前我正在使用这个正则表达式从YoutubeURL中提取视频ID:url.match(/v=([^&]*)/)[1]我怎样才能改变它，以便它也可以从这个没有v参数的YoutubeURL获取视频ID:http://www.youtube.com/user/SHAYTARDS#p/u/9/Xc81AajGUMU感谢阅读。编辑:我正在使用ruby1.8.7 最佳答案 对于Ruby1.8.7，这就可以了。url_1='http://www.youtube.com/watch?v=8WVTOUh53QY&feature=feedf'url