CN108616709A - A method of realizing video record and the storage of webpage version - Google Patents
A method of realizing video record and the storage of webpage version Download PDFInfo
- Publication number
- CN108616709A CN108616709A CN201810417300.8A CN201810417300A CN108616709A CN 108616709 A CN108616709 A CN 108616709A CN 201810417300 A CN201810417300 A CN 201810417300A CN 108616709 A CN108616709 A CN 108616709A
- Authority
- CN
- China
- Prior art keywords
- video
- storage
- record
- video record
- recordrtc
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
- H04N5/00—Details of television systems
- H04N5/76—Television signal recording
- H04N5/765—Interface circuits between an apparatus for recording and another apparatus
- H04N5/77—Interface circuits between an apparatus for recording and another apparatus between a recording apparatus and a television camera
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/455—Emulation; Interpretation; Software simulation, e.g. virtualisation or emulation of application or operating system execution engines
- G06F9/45504—Abstract machines for programme code execution, e.g. Java virtual machine [JVM], interpreters, emulators
- G06F9/45529—Embedded in an application, e.g. JavaScript in a Web browser
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
- H04N21/00—Selective content distribution, e.g. interactive television or video on demand [VOD]
- H04N21/40—Client devices specifically adapted for the reception of or interaction with content, e.g. set-top-box [STB]; Operations thereof
- H04N21/43—Processing of content or additional data, e.g. demultiplexing additional data from a digital video stream; Elementary client operations, e.g. monitoring of home network or synchronising decoder's clock; Client middleware
- H04N21/433—Content storage operation, e.g. storage operation in response to a pause request, caching operations
- H04N21/4334—Recording operations
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04N—PICTORIAL COMMUNICATION, e.g. TELEVISION
- H04N5/00—Details of television systems
- H04N5/76—Television signal recording
- H04N5/91—Television signal processing therefor
Abstract
The present invention relates to the technical field of video web page video recording and storage, more particularly to a kind of methods of video record and storage that realizing webpage version.The method of the present invention step is：1, the label that the video record page needs is defined；2, RecordRTC.js is quoted；3, computer camera is called；4, video record is carried out using RecordRTC；5, setting preserves the format of video, title；6, video storage will be recorded to local；The present invention realizes a kind of method of convenient and efficient, at low cost video record and preservation, solves traditional function of needing to install the realization video record and preservation such as software, plug-in unit in computer progress video record.
Description
Technical field
The present invention relates to video web page video recording and technical field of memory, more particularly to a kind of video records for realizing webpage version
With the method for storage.
Background technology
Video record and the function of preservation are ubiquitous in people's lives, with the raising of people’s lives level,
More and more people select recorded video and preserve, and record the dribs and drabs of life.
The camera of computer is also known as camera computer, computer eye, electronic eyes etc., is a kind of video input apparatus, extensive
Apply to video conference, tele-medicine and real time monitoring etc..
But the main problem faced at present has：
It is existing many to provide video record in computer and carry out video be all based on certain plug-in unit or the software for preserving function
Record and preserve, the cumbersome installation steps of this plug-in unit and software can undoubtedly allow people to feel irritated, especially in installation error or
When failure, reason is can't find so that it cannot the problems such as carrying out video record.
Invention content
The present invention realizes a kind of method of convenient and efficient, at low cost video record and preservation, solve it is traditional
Computer carries out video record and needs to install the problem of software, plug-in unit etc. are realized video record and preserved.
The present invention solve above-mentioned technical problem technical solution be：
The method includes following steps：
Step 1: defining the label that the video record page needs；
Step 2: reference RecordRTC.js；
Step 3: calling computer camera；
Step 4: carrying out video record using RecordRTC；
Step 5: setting preserves the format of video, title；
Step 6: video storage will be recorded to local.
Beneficial effects of the present invention：Provide a kind of method of video record and storage that realizing webpage version, this method
A kind of method of convenient and efficient, at low cost video record and preservation is realized, is solved traditional in computer progress video record
System needs to install the problem of software, plug-in unit etc. are realized video record and preserved.
Description of the drawings
The following further describes the present invention with reference to the drawings：
Fig. 1 is flow chart of the method for the present invention.
Specific implementation mode
As shown in Figure 1, the present invention may be implemented a kind of video record that realizing webpage version and stored using following steps
Method.
Step 1: defining the label that the video record page needs.Video is called defined in the html pages of video record
Video labels, play video button label button（startVideo）, the label button that stops and preserve video
(saveVideo), if browser version is too low when the page loads, update is prompted.
<video width="800" height="" id="video">Your browser version is too low, please update!</
video>
<button id="startVideo">Start</button>
<button id="saveVideo">Stop and preserves</button>
Step 2: reference RecordRTC.js；RecordRTC.js is quoted in the html video record pages, because it is us
Realize the main force for calling camera to record a video in webpage.
<script src="RecordRTC.js"></script>
Step 3: calling computer camera.Navigator.mediaDevices.getUserMedia prompt users, which give, to be made
The license inputted with media, media input generate a MediaStream, and the inside contains the track of the medium type of request,
Will be friendly when normally media device can not be obtained send out miscue.
navigator.mediaDevices.getUserMedia({
audio: true,
video: true
}).then(function(camera) {
callback(camera);
}).catch(function(error) {
Alert (' can not catch and grab your camera, it please check console daily record！');
console.log(error);
});
Step 4: carrying out video record using RecordRTC.The camera of calling passes in the page in the form of streaming
Video elements, and the startRecording methods of RecordRTC is called to carry out video record, and in real time show video
In the video elements for recording the page.
var video = document.getElementById(“video”);
captureCamera(function(camera) {
setSrcObject(camera, video);
video.play();
recordRTC = RecordRTC(camera, {
type: 'video'
});
recordRTC.startRecording();
});
recordRTC.stopRecording(function(audioVideoWebMURL) {
video.src = audioVideoWebMURL;
});
Step 5: setting preserves the format of video, title.
var timestamp = Date.parse(new Date());
var num = parseInt(Math.random() * 10000);
Var fileName = timestamp + num + ‘.webm’;
Step 6: video storage will be recorded to local.Call the invokeSaveAsDialog methods of recordRTC that will remember
The video of record is saved in disk.
var file = new File([recordRTC.getBlob()], fileName, {
type: 'video/webm'
});
invokeSaveAsDialog(file, file.name)。
Claims (6)
1. a kind of method of video record and storage that realizing webpage version, it is characterised in that：The method includes following
Step：
Step 1: defining the label that the video record page needs；
Step 2: reference RecordRTC.js；
Step 3: calling computer camera；
Step 4: carrying out video record using RecordRTC；
Step 5: setting preserves the format of video, title；
Step 6: video storage will be recorded to local.
2. a kind of method of video record and storage for realizing webpage version according to claim 1, it is characterised in that：It is described
The step of one in, need defined in the html pages of video record call video video labels, play video button mark
Sign button（startVideo）, the label button (saveVideo) that stops and preserve video.
3. a kind of method of video record and storage for realizing webpage version according to claim 1, it is characterised in that：It is described
The step of two in, need quote RecordRTC.js, RecordRTC is a media dictation library based on JavaScript, use
In modern network browser（Support WebRTC getUserMedia API）；It is carried out for different equipment and browser
Optimization, by all clients（Without plug-in unit）It records solution and concentrates on a place.
4. a kind of method of video record and storage for realizing webpage version according to claim 1, it is characterised in that：It is described
The step of three in, using navigator.mediaDevices.getUserMedia () method call computer camera, work as nothing
When method calls camera, prompt user that camera is called to fail in time.
5. a kind of method of video record and storage for realizing webpage version according to claim 1, it is characterised in that：It is described
The step of four in, the camera of calling is passed into the video elements in the page in the form of streaming, and call RecordRTC's
StartRecording methods carry out video record.
6. a kind of method of video record and storage for realizing webpage version according to claim 1, it is characterised in that：It is described
The step of five neutralization procedures six in, when stop with preserve video button be clicked when stop record a video, selection to preserve video
Format fills in title, and the video recorded is saved in local.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810417300.8A CN108616709A (en) | 2018-05-05 | 2018-05-05 | A method of realizing video record and the storage of webpage version |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810417300.8A CN108616709A (en) | 2018-05-05 | 2018-05-05 | A method of realizing video record and the storage of webpage version |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN108616709A true CN108616709A (en) | 2018-10-02 |
Family
ID=63662156
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810417300.8A Pending CN108616709A (en) | 2018-05-05 | 2018-05-05 | A method of realizing video record and the storage of webpage version |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN108616709A (en) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2020042060A1 (en) * | 2018-08-30 | 2020-03-05 | 珠海横琴盛达兆业科技投资有限公司 | Method for realizing webpage video recording and storage |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102307289A (en) * | 2010-09-17 | 2012-01-04 | 苏州阔地网络科技有限公司 | Method for recording video |
| CN102316298A (en) * | 2010-09-17 | 2012-01-11 | 苏州阔地网络科技有限公司 | Method for realizing audio and video recording |
| US20130018955A1 (en) * | 2011-07-14 | 2013-01-17 | Salesforce.Com, Inc. | Computer implemented methods and apparatus for implementing a social network information feed as a platform |
| CN104982002A (en) * | 2013-01-30 | 2015-10-14 | 柯布朗·德杰 | Video signature system and method |
-
2018
- 2018-05-05 CN CN201810417300.8A patent/CN108616709A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102307289A (en) * | 2010-09-17 | 2012-01-04 | 苏州阔地网络科技有限公司 | Method for recording video |
| CN102316298A (en) * | 2010-09-17 | 2012-01-11 | 苏州阔地网络科技有限公司 | Method for realizing audio and video recording |
| US20130018955A1 (en) * | 2011-07-14 | 2013-01-17 | Salesforce.Com, Inc. | Computer implemented methods and apparatus for implementing a social network information feed as a platform |
| CN104982002A (en) * | 2013-01-30 | 2015-10-14 | 柯布朗·德杰 | Video signature system and method |
Non-Patent Citations (1)
| Title |
|---|
| 闷葫芦: "RecordRTC 打开设备录像并压缩文件", 《HTTPS://BLOG.CSDN.NET/QQ_34527715/ARTICLE/DETAILS/78181305》 * |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2020042060A1 (en) * | 2018-08-30 | 2020-03-05 | 珠海横琴盛达兆业科技投资有限公司 | Method for realizing webpage video recording and storage |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US20200366726A1 (en) | Method of downloading digital content to be rendered | |
| US9418172B2 (en) | Systems and methods for remote tracking and replay of user interaction with a webpage | |
| JP5254960B2 (en) | System and method for creating, executing and retrieving forms of web-based active content | |
| CN103634199A (en) | Notification message display method and notification message display device | |
| CN105975470B (en) | Historical record processing method and device | |
| US20160217109A1 (en) | Navigable web page audio content | |
| WO2020147522A1 (en) | Method and device for processing audio | |
| US20160050255A1 (en) | Controlling content on a display device | |
| CN108616709A (en) | A method of realizing video record and the storage of webpage version | |
| GB2488790A (en) | A method of controlling web page behaviour on a web enabled device | |
| US9705836B2 (en) | Method, server and SNS system for message interaction | |
| EP2510458A1 (en) | System and method for synchronizing static images with dynamic multimedia contents | |
| US20030084062A1 (en) | Method and system for automated web reports | |
| US8301683B2 (en) | Method of enhancing multimedia | |
| US20150381684A1 (en) | Interactively updating multimedia data | |
| US11622164B2 (en) | System and method for streaming video/s | |
| JP2013546072A (en) | Autonomous intelligent content items | |
| CN112601129A (en) | Video interaction system, method and receiving end | |
| CN112640441A (en) | Method for realizing video recording and storage of webpage version | |
| US7716197B2 (en) | XCAP and SIP filter chain state transforms via dynamic helper functions for internet multimedia subsystems | |
| US20180032365A1 (en) | System and method for creating virtual disk images for use with remote computer | |
| KR20010064234A (en) | Caption management method for offering a play script in Internet | |
| CN115954075A (en) | Electronic medical record editor adopting pure HTML5 technology | |
| CN104703038A (en) | Multimedia processing method and device | |
| CN113220188A (en) | Method and device for generating guide prompt information |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination |