This project uses parcel to serve a static frontend only sample that demonstrates how to use Camera Mode with the Zoom Apps SDK.
For more information about the Layers API and Camera Mode check out our docs at https://marketplace.zoom.us/docs/zoom-apps/guides/layers-api/
Open your terminal:
# Clone down this repository
git clone git@github.com:zoom/zoomapps-cameramode-vuejs.git
# navigate into the cloned project directory
cd zoomapps-cameramode-vuejs
# install dependencies
npm install
# start the development server
npm run dev
# use Ngrok to expose the port
ngrok http 1234As this is a static application without a backend usage is simple.
- Create your Zoom App from the Zoom Marketplace
- Install your Zoom App from the Zoom Marketplace
- Start the application (steps above)
- Open the application in your Zoom Client under the Apps tab
This sample does not include functionality for installing your app. Install your app using the Add button from the Zoom Marketplace and ignore the error on redirect
In your web browser, navigate to Zoom Developer Portal and register/log into your developer account.
Click the "Build App" button at the top and choose to "Zoom Apps" application.
- Name your app
- Choose whether to list your app on the marketplace or not
- Click "Create"
For more information, you can follow this guide check out this video series on how to create and configure these sample Zoom Apps.
In your terminal where you launched ngrok, find the Forwarding value and copy/paste that into the "Home URL" and "
Redirect URL for OAuth" fields.
Home URL: https://xxxxx.ngrok.io
Redirect URL for OAuth: https://xxxxx.ngrok.io
NOTE: ngrok URLs under ngrok's Free plan are ephemeral, meaning they will only live for up to a couple hours at most, and will change every time you reinitialize the application. This will require you to update these fields every time you restart your ngrok service.
https://example.ngrok.io
ngrok.io
The following information is required to activate your application:
- Basic Information
- App name
- Short description
- Long description (entering a short message here is fine for now)
- Developer Contact Information
- Name
- Email address
NOTE: if you intend to publish your application on the Zoom Apps Marketplace, more information will be required in this section before submitting.
Under the Zoom App SDK section, click the + Add APIs button and enable the following options from their respective
sections:
Ensure that the following scope is selected on the Scopes tab:
zoomapp:inmeeting
At this time there are no e2e or unit tests.
If you're looking for help, try Developer Support or our Developer Forum. Priority support is also available with Premier Developer Support plans.
Make sure to review our documentation as a reference when building your Zoom Apps.