I am looking to add the ability for communication between my Main App (ios App) and my Vue/JS code. I want to pass a token from my iOS app to the Vue code. I believe a Custom Plugin would enable me to do this (in reading the documentation here: https://capacitorjs.com/docs/plugins/creating-plugins). I followed the documentation and created a separate repo for the custom plugin.
The Plugin’s logic is to contain a simple get and set method and expose that between the App (Swift codespace) and the Vue App.
Unfortunately every time I attempt to fetch the plugin to grab the token/information stored I get the error in my IOS App (Xcode Debug): Error getting VoIP token: {“code”:”UNIMPLEMENTED”}
Here’s my code:
ios/sources/QuillCapacitorPluginPlugin/QuillCapacitorPlugin.swift:
import Foundation
@objc public class QuillCapacitorPlugin: NSObject {
// Singleton instance
@objc public static let shared = QuillCapacitorPlugin()
// Stored variable
var storedValue: String?
// Method to set the stored value
@objc public func setStoredValue(_ value: String) {
self.storedValue = value
}
// Method to get the stored value
@objc public func getStoredValue() -> String? {
return self.storedValue
}
// Existing echo method
@objc public func echo(_ value: String) -> String {
print(value)
return value
}
}
ios/sources/QuillCapacitorPluginPlugin/QuillCapacitorPluginPlugin.swift:
import Foundation
import Capacitor
@objc(QuillCapacitorPluginPlugin)
public class QuillCapacitorPluginPlugin: CAPPlugin {
// Use the shared instance
private let implementation = QuillCapacitorPlugin.shared
// MARK: - Plugin Methods
@objc func echo(_ call: CAPPluginCall) {
let value = call.getString("value") ?? ""
call.resolve([
"value": implementation.echo(value)
])
}
@objc func setStoredValue(_ call: CAPPluginCall) {
let value = call.getString("value") ?? ""
implementation.setStoredValue(value)
call.resolve()
}
@objc func getStoredValue(_ call: CAPPluginCall) {
if let value = implementation.getStoredValue() {
call.resolve([
"value": value
])
} else {
call.reject("No value stored")
}
}
}
My index.ts:
import { registerPlugin } from '@capacitor/core';
import type { QuillCapacitorPluginPlugin } from './definitions';
const QuillCapacitorPlugin = registerPlugin<QuillCapacitorPluginPlugin>('QuillCapacitorPlugin', {
web: () => import('./web').then((m) => new m.QuillCapacitorPluginWeb()),
});
export * from './definitions';
export { QuillCapacitorPlugin };
My definition.ts:
export interface QuillCapacitorPluginPlugin {
echo(options: { value: string }): Promise<{ value: string }>;
setStoredValue(options: { value: string }): Promise<void>;
getStoredValue(): Promise<{ value: string }>;
}
My Appdelegate.swift:
func pushRegistry(_ registry: PKPushRegistry, didUpdate pushCredentials: PKPushCredentials, for type: PKPushType) {
let voipToken = pushCredentials.token.map { String(format: "%02x", $0) }.joined()
print("PushKit Token: (voipToken)")
// Store the token
QuillCapacitorPlugin.shared.setStoredValue(voipToken)
}
My vue/js:
// voipPlugin.js
import { QuillCapacitorPlugin } from 'quill-capacitor-plugin';
export const getStoredVoIPToken = async () => {
try {
const result = await QuillCapacitorPlugin.getStoredValue();
console.log('token is', result);
return result.token;
} catch (error) {
console.error('Error getting VoIP token:', error);
return null;
}
};
// Vue Plugin
export const VoIPPlugin = {
install() {
console.log('Setting up VoIP Plugin');
// Add method to get token to globalProperties
getStoredVoIPToken().then((token) => {
console.log('token is 2', token)
});
}
};
The debug log statements print the Set up of the VOIP Plugin after the Swift code grabs the token (so any async behavior shouldn’t occur). It ends up throwing the error in the try catch when it tries to fetch the stored value.
I have tried switching around and adding a timer to the delay in case it was an async issue, but I still ran into the same error above. I double checked that the plugin is included in the Podfile and compiled with the project.
