is there any code example of how use ShazamKit in react native?

Question

i already created the bridge but its hard to understand the documention of ShazamKit . i wonder if there was any idea/help/source code to help me detect music by microphone on a react native application with latest Shazamkit version. thank you.

i tried this but i got the error: Cannot find 'SHMatcher' in scope

// my swift file
import Foundation
import ShazamKit
import AVFoundation
import React

@objc(ShazamBridge)
class ShazamBridge: NSObject {
    private let audioEngine = AVAudioEngine()
    private let session = SHSession()
    private var signatureGenerator = SHSignatureGenerator()

    @objc func startListening(_ resolve: @escaping RCTPromiseResolveBlock, rejecter reject: @escaping RCTPromiseRejectBlock) {
        let inputNode = audioEngine.inputNode
        let recordingFormat = inputNode.outputFormat(forBus: 0)
        inputNode.installTap(onBus: 0, bufferSize: 1024, format: recordingFormat) { (buffer: AVAudioPCMBuffer, when: AVAudioTime) in
            self.signatureGenerator.append(buffer, at: nil)
        }

        audioEngine.prepare()
        do {
            try audioEngine.start()
        } catch {
            reject("Error", "Audio engine could not start", error)
        }

        resolve("Listening started")
    }

    @objc func stopListeningAndIdentify(_ resolve: @escaping RCTPromiseResolveBlock, rejecter reject: @escaping RCTPromiseRejectBlock) {
        audioEngine.stop()
        audioEngine.inputNode.removeTap(onBus: 0)

        let matcher = SHMatcher()
        let signature = signatureGenerator.signature()
        matcher.addSignature(signature)

        session.match(matcher, completion: { (matches, error) in
            if let error = error {
                reject("Error", "Failed to match audio", error)
            } else if let match = matches?.first {
                resolve(match.mediaItem.title)
            } else {
                resolve(nil)
            }
        })
    }
}

Answer 1

Create a new Native Module in iOS:

You need to create a new native module that interacts with ShazamKit in Swift. This involves writing a new Swift class that imports ShazamKit and implements the required methods to perform audio recognition.

Bridge the Native Module to React Native:

You can expose the native module to your React Native JavaScript code by using the @objc attribute and protocol in Swift. This will make the native module and methods available in your JavaScript code.

Use the Native Module in your React Native code:

Once the native module is exposed to JavaScript, you can import it into your React Native code using the NativeModules object from the react-native package. You can then call the methods that you've defined in your native module. Swift:

import ShazamKit
import React

@objc(ShazamKitBridge)
class ShazamKitBridge: NSObject, RCTBridgeModule {
  
  static func moduleName() -> String! {
    return "ShazamKitBridge"
  }
 
  @objc func recognizeAudio(_ resolve: RCTPromiseResolveBlock, rejecter reject: RCTPromiseRejectBlock) {
    // Add your ShazamKit code here
  }
}

JavaScript:

import { NativeModules } from 'react-native';

// Get the ShazamKit bridge
const { ShazamKitBridge } = NativeModules;

ShazamKitBridge.recognizeAudio().then(result => {
  console.log(result);
}).catch(error => {
  console.error(error);
});

Note that you also need to make sure that ShazamKit is included in your iOS project. You might need to add it to your project manually or include it as a dependency in your Podfile.