Table of Contents

Quick start for web development with image cloud recognition

EasyAR WebAR implements AR functionality based on web technology. Compared to native AR applications, it features lightweight deployment, fast implementation, and broad compatibility. It runs directly in mainstream browsers on Android, iOS, Windows, and Mac systems without requiring app installation, achieving true cross-platform capability.

Before you begin

Ensure you have completed the following preparations before starting:

  1. An API Key supporting cloud recognition
  2. A running cloud recognition library

Upload cloud recognition images

Prepare a recognition image and upload it to the cloud recognition library. Refer to Image library management for upload methods.

Download sample

To facilitate rapid development, we provide sample code. Developers can download these examples to quickly experience WebAR functionality.

Click to download

Configure sample

The sample code includes predefined configuration items. Configure according to your actual environment:

  • Edit the config/application.txt file
  • Replace API Key, API Secret, and CRS AppId in the configuration file

Cloud recognition configuration

  • Edit the asset/js/app.js file in the sample directory
  • Replace the Client-end (Target Recognition) URL for cloud recognition in app.js

Cloud recognition configuration

Run sample

The EasyAR-WebAR_* files provide HTTP and token generation services. If started successfully, they will display the listening port number. Start methods:

  • Linux system: 
    ./EasyAR-WebAR_linux
  • macOS system: 
    ./EasyAR-WebAR_darwin
  • Windows system: 
    // Double-click or run in cmd
EasyAR-WebAR_windows.exe

Experience sample

Access http://127.0.0.1:3000/ in a PC browser (camera required). Firefox is recommended. Aim at the recognition target and observe the sample's operation.

Tip

For mobile experience, HTTPS domain configuration is required.