I’m participating in nuggets Creators Camp # 4, click here to learn more and learn together!

The company I work for has a geek-only SVIP entitlement that recently expired. Courses subscribed after the expiry date will not be available for study. So saving the video locally is the only option.

However, geek Time’s video courses use Aliyun’s video encryption scheme, so it’s impossible to cache them offline locally.

As a last resort, I chose to use Selenium, an automation platform, to control OBS to record geek time videos, and finally saved them locally.

The overall plan and implementation will be shared with you below.

Overall scheme Framework

The whole scheme is divided into three parts: main control terminal, screen recording module and browser control module.

The main control terminal is based on Node.js and mainly arranges the automatic recording process.

The screen recording module is based on the WHOLE OBS scheme, wherein:

  • OBS Studio is responsible for grabbing the window where the video is playing and recording it into a video.
  • The OBS-WebSocket plug-in opens the WebSocket service and provides the obS control capability.
  • The master terminal sends control instructions to websocket service through obS-websocket-js to realize the function of starting and stopping screen recording.

The browser control module is based on Selenium platform.

  • The main control terminal invokes Selenium – Driver to send automatic control instructions, such as web page jump, simulated click, and JavaScript script execution.
  • Selenium-driver calls the Geckodriver driver to control the Firefox browser.

Preparing the operating environment

Screen recording, depending on the OBS environment

  1. OBS Studio, install version 27 or later
  2. obs-websocket

Automated operations, depending on Selenium-driver

  1. Select browser driver download here

Refer to the configuration documents to associate drivers. You are advised to use environment variables for easy configuration

The browser

Firefox Browser

Configuration before program start

  1. Configure the port and password of the OBS-webSocket server to facilitate the program to call the connection.

Open the Tools-WebSockets Server Setup menu to the server Setup dialog box on the right, check the enable WebSockets Server option, configure the port and password, and click OK.

  1. Configure obS scenes and capture Windows

If you are familiar with obS operations, you can skip this step

Click the cross key in the lower left corner of the scene area to pop up the dialog box of “Add scene”. Enter a name and click OK

Click on the lower left corner of the source area to pop up the source menu and select “Window Capture”.

Then click New, enter a name, check the “Make Source visible” box in the lower left corner, and click OK. A properties window pops up.

Because the program has not started, you want to grab the window is not open, just choose a window.

Window matching Priority Remember to select “Window title must match”, otherwise you may catch window offset.

Click ok to save.

Automated process

The whole process can be divided into two parts: authorized login and course recording, but a little preparation is needed before this.

The preparatory work

When the program is started, the OBS connect operation is performed, configured to the address and password set in the OBS-WebSocket plug-in. The password can be left blank.

Authorized to log in

  1. Visit the Geek Time Corporate Training page.

Thankfully, corporate training stations can run in an external browser.

At this point, Geek Time checks whether the user is logged in. If the user is not logged in, the user is redirected to the scan login page.

In automated scripts, a clean browser process is started by default, so redirects are bound to occur.

If the user does not scan the code for login, the page stays on forever.

  1. Users specify the collection window and scan for login at the same time.

When the automatic browser opens the “Enterprise wechat Login” page, click the window option of OBS and select the currently open “Enterprise wechat Login” window, so that the subsequent video recording will always capture this process.

If the login succeeds, the home page is displayed

  1. Wait a little while, then jump to the course link you want to record

    1. If you switch to the page immediately, a second login may occur.

Course recording page operation

Open the course page and record. This operation will loop indefinitely until the loop is broken when the video has finished playing.

  1. Get the list of course videos using the selector

  2. Get the player element using a selector

  3. Manipulating player elements

    1. Select the player title section and get the title text.

    2. Compare the title text with the course video list to get the actual title.

    3. Set the title obtained in the previous step to the recording file name

    4. Select the text of player playing time and parse out the video duration

    5. Set the video playback progress to 0. If you have studied this part of the course before, the next time you visit it, the progress may not be at the beginning, so you need to reset it manually

    6. Select the full screen button and perform the mock click. Firefox displays a prompt box when the page opens in full screen

    7. Wait for a period of time, the prompt box disappears, and then call start of OBS to start recording

    8. Create a listener to compare the current playing progress with the total progress. When the difference is less than a fixed threshold, the video is considered to have been played

    9. When the video is finished, call obS ‘stop to stop recording

    10. Determine if the current video is the last, and if so, break the loop. If not, wait some time and execute the subsequent loop.

      1. Determine whether it is the last video by comparing the title of the current video and the last item in the video list

Finishing touches

When the program ends, execute obS disconnect, and then call the Quit method to exit the Selenium process.

  • If the end is abnormal, remember to stop the video recording before disconnecting

conclusion

That concludes the complete solution and considerations for recording geek time videos using Selenium and OBS. I think it’s pretty clear what’s going on here.

Students who are interested are welcome to implement automatic scripts that meet their own usage habits.

I wish you success.

Developing reference materials

selenium javascript api

subsequent

After talking with my colleague, he gave me a link to a web disk, and the course I wanted was also in it.