# Weixin Mini Program Camera plug-in

This plug-in is mainly used to provide "Weixin Mini Program Photographic" part of the basic capabilities and unified interface.

Plug-in access can refer to: Weixin Mini Program sample code

Access to the device side SDK is exactly the same as Weixin Mini Program Voip's pure cloud access. Please refer to the documentation.

# 1. Weixin Mini Program Introduction of plug-ins

About Weixin Mini Program Plug-in Please refer to the Plug-in documentation

After adding a plug-in to the "Weixin Mini Program" admin background, the user also needs to declare the plug-in in the apagejson`of the Mini Program.It can be introduced in a master package or in a sub-package.

// The main package was introduced
{
  "plugins": {
    "wmpf-voip": {
      "version": "latest", // latest 表示自动使用最新版本。也可使用具体版本，如 2.3.8
      "provider": "wxf830863afde621eb"
    }
  }
}

// Subcontracting introduced
{
  "subpackages": [
    {
      "root": "xxxx",
      "pages": [],
      "plugins": {
        "wmpf-voip": {
          "version": "latest", // latest 表示自动使用最新版本。也可使用具体版本，如 2.3.8
          "provider": "wxf830863afde621eb"
        }
      }
    }
  ]
}

After the declaration is complete, you can confirm whether the introduction was successful in Weixin Mini Program

const wmpfVoip = requirePlugin('wmpf-voip').default
console.log(wmpfVoip) // 有结果即表示引入插件成功

# 2. Introduce camera components

Once the plug-in is introduced, the camera component needs to be introduced.

The JSON file for a page or component states:

"usingComponents": {
    "camera-device": "plugin-private://wxf830863afde621eb/publicComponents/camera-device/camera-device"
  },

Components used in wxml: incoming sn, model-id, device-name

// page.wxml
<camera-device sn="{{sn}}" device-name="{{deviceName}}" model-id="{{modelId}}" class="camera-deivce" bind:changeQuality="changeQuality"></camera-device>

Custom camera-deivce in wxss.

// page.wxss
.camera-deivce {
  width: 100vw;
  height: 300px;
}

Expected:

# 3. Component properties

Event: toggle clarity changeQuality

Examples:

<camera-device 
    sn="{{sn}}" 
    device-name="{{deviceName}}" 
    model-id="{{modelId}}" 
    class="camera-deivce" 
    bind:changeQuality="changeQuality"
>
</camera-device>

Page({
    changeQuality(res) {
        console.log(res)
    }
})

# 4. Update the log

Please refer to < Weixin Mini Program AV Call Plug-in Changelog >