various options
Optional
worker?: Worker | SharedWorkerThe instantiated worker object. If not provided, the client will use the service worker.
Example: new Worker("./worker.js")
See Worker (used by both dedicated workers and service workers), SharedWorker, and
the different worker types that exist
Optional
hooks?: Hooks<Procedures>Hooks to run on messages received from the server. See Hooks
Optional
loglevel?: "debug" | "info" | "warn" | "error"Maximum log level to use, defaults to "debug" (shows everything). "info" will not show debug messages, "warn" will only show warnings and errors, "error" will only show errors.
Optional
restartListener?: booleanIf true, will force the listener to restart even if it has already been started. You should probably leave this to false, unless you are testing and want to reset the client state.
a sw&rpc client instance. Each property of the procedures map will be a method, that accepts an input and an optional onProgress callback, see ClientMethod
An example of defining and using a client:
<script lang="ts">
import { procedures } from "$lib/procedures"
import { Client, type CancelablePromise } from "swarpc"
// 1. Give yourself a client instance
const swarpc = Client(procedures)
// 2. Declare some state to hold info
let results: typeof procedures.getClassmapping.success.inferOut = $state([])
let progress = $state(0)
let loading = $state(false)
let cancel: undefined | CancelablePromise["cancel"] = $state()
</script>
<search>
<button
onclick={async () => {
// 3. Call a method on the client instance
const cancelable = swarpc.getClassmapping.cancelable(
{ ref: "main", delay: 2 },
(p) => {
loading = true
progress = p.transferred / p.total
}
)
// 4. Bind the cancel function to a variable, so you can cancel the request later
cancel = cancelable.cancel
// 5. Await the request to get the results
results = await cancelable.request
loading = false
}}
>
Get classmapping
</button>
</search>
<!-- 6. Give users a way to cancel the request -->
{#if cancel}
<button
onclick={async () => {
await cancel("User cancelled")
loading = false
}}
>
Cancel
</button>
{/if}
<!-- 7. Display your progress indicators -->
{#if progress > 0 && progress < 1}
<progress value={progress} max="1">Loading…</progress>
{:else if loading}
<p>Loading...</p>
{/if}
<!-- 8. Display your results! -->
<ul>
{#each results as mapping (mapping)}
<li>{mapping}</li>
{/each}
</ul>
procedures the client will be able to call, see ProceduresMap