Home WeChat Applet Mini Program Development How to implement video playback in a small program

How to implement video playback in a small program

Mar 21, 2020 am 11:38 AM
Applets video playback

How to implement video playback in a small program

How to implement video playback in a mini program

You can use the video component provided by WeChat to implement video playback in a mini program.

Recommended learning: Small program development

How to implement video playback in a small program

The specific implementation methods and steps are as follows:

1 , first write the video.wxml file

<view>
    <video src="{{src}}" binderror="videoErrorCallback" style="width:100%;"></video>
    <button bindtap="bindButtonTap">获取视频</button>
</view>
Copy after login

Note: You can select the album video to play through the button.

2. Then write the video.js file

Page({
  /**
   * 页面的初始数据
   */
  data: {
    src: &#39;http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400&#39;,
  },
  bindButtonTap:function(){
    var that=this
    wx.chooseVideo({
      sourceType:[&#39;album&#39;,&#39;camera&#39;],
      maxDuration:60,
      camera:[&#39;front&#39;,&#39;back&#39;],
      succes:function(res){
        that.setData({
          src:res.tempFilePath
        })
      }
    })
  }
})
Copy after login

Rendering:

How to implement video playback in a small program

PHP Chinese website, a lot Free thinkphp tutorial, welcome to learn online!

The above is the detailed content of How to implement video playback in a small program. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Develop WeChat applet using Python Develop WeChat applet using Python Jun 17, 2023 pm 06:34 PM

With the popularity of mobile Internet technology and smartphones, WeChat has become an indispensable application in people's lives. WeChat mini programs allow people to directly use mini programs to solve some simple needs without downloading and installing applications. This article will introduce how to use Python to develop WeChat applet. 1. Preparation Before using Python to develop WeChat applet, you need to install the relevant Python library. It is recommended to use the two libraries wxpy and itchat here. wxpy is a WeChat machine

Can small programs use react? Can small programs use react? Dec 29, 2022 am 11:06 AM

Mini programs can use react. How to use it: 1. Implement a renderer based on "react-reconciler" and generate a DSL; 2. Create a mini program component to parse and render DSL; 3. Install npm and execute the developer Build npm in the tool; 4. Introduce the package into your own page, and then use the API to complete the development.

Implement card flipping effects in WeChat mini programs Implement card flipping effects in WeChat mini programs Nov 21, 2023 am 10:55 AM

Implementing card flipping effects in WeChat mini programs In WeChat mini programs, implementing card flipping effects is a common animation effect that can improve user experience and the attractiveness of interface interactions. The following will introduce in detail how to implement the special effect of card flipping in the WeChat applet and provide relevant code examples. First, you need to define two card elements in the page layout file of the mini program, one for displaying the front content and one for displaying the back content. The specific sample code is as follows: &lt;!--index.wxml--&gt;&l

How to use WordPress plug-in to implement video playback function How to use WordPress plug-in to implement video playback function Sep 05, 2023 pm 12:55 PM

How to use WordPress plug-in to implement video playback function 1. Introduction The application of video on websites and blogs is becoming more and more common. In order to provide a high-quality user experience, we can use WordPress plug-ins to implement video playback functions. This article will introduce how to use WordPress plugins to implement video playback functions and provide code examples. 2. Choose plug-ins WordPress has many video playback plug-ins to choose from. When choosing a plug-in, we need to consider the following aspects: Compatibility: Make sure the plug-in

Tips and best practices for implementing online video playback in Vue Tips and best practices for implementing online video playback in Vue Jun 25, 2023 pm 02:30 PM

With the development of the Internet, people are becoming more and more interested in watching videos online. In order to provide a better video experience, many websites have begun to use Vue-based online video players. This article will introduce some tips and best practices for implementing online video playback in Vue. Tip 1: Choose the right player The first step to achieve online video playback in Vue is to choose the right player. There are many popular video players on the market, such as JWPlayer, Video.js, ShakaPlayer, etc. these players

Alipay launched the 'Chinese Character Picking-Rare Characters' mini program to collect and supplement the rare character library Alipay launched the 'Chinese Character Picking-Rare Characters' mini program to collect and supplement the rare character library Oct 31, 2023 pm 09:25 PM

According to news from this site on October 31, on May 27 this year, Ant Group announced the launch of the "Chinese Character Picking Project", and recently ushered in new progress: Alipay launched the "Chinese Character Picking-Uncommon Characters" mini program to collect collections from the society Rare characters supplement the rare character library and provide different input experiences for rare characters to help improve the rare character input method in Alipay. Currently, users can enter the "Uncommon Characters" applet by searching for keywords such as "Chinese character pick-up" and "rare characters". In the mini program, users can submit pictures of rare characters that have not been recognized and entered by the system. After confirmation, Alipay engineers will make additional entries into the font library. This website noticed that users can also experience the latest word-splitting input method in the mini program. This input method is designed for rare words with unclear pronunciation. User dismantling

How uniapp achieves rapid conversion between mini programs and H5 How uniapp achieves rapid conversion between mini programs and H5 Oct 20, 2023 pm 02:12 PM

How uniapp can achieve rapid conversion between mini programs and H5 requires specific code examples. In recent years, with the development of the mobile Internet and the popularity of smartphones, mini programs and H5 have become indispensable application forms. As a cross-platform development framework, uniapp can quickly realize the conversion between small programs and H5 based on a set of codes, greatly improving development efficiency. This article will introduce how uniapp can achieve rapid conversion between mini programs and H5, and give specific code examples. 1. Introduction to uniapp unia

How to implement video playback and upload functions through the PHP Kuaishou API interface How to implement video playback and upload functions through the PHP Kuaishou API interface Jul 21, 2023 pm 04:37 PM

How to implement video playback and upload functions through the PHP Kuaishou API interface. Introduction: With the rise of social media, the public’s demand for video content has gradually increased. Kuaishou, as a short video-themed social application, is loved by many users. This article will introduce how to use PHP to write code to implement video playback and upload functions through the Kuaishou API interface. 1. Obtain the access token. Before using the Kuaishou API interface, you first need to obtain the access token. Token is the identity for accessing the API interface

See all articles