Text streaming with async generators.
1import { get, prefix } from 'vovk';
2
3type Token = { message: string };
4
5@prefix('stream')
6export default class StreamController {
7 @get('tokens', { cors: true })
8 static async *streamTokens() {
9 const tokens: Token[] = [
10 { message: 'Hello,' },
11 { message: ' World' },
12 { message: ' from' },
13 { message: ' Stream' },
14 { message: '!' },
15 ];
16
17 for (const token of tokens) {
18 yield token;
19 await new Promise((resolve) => setTimeout(resolve, 300));
20 }
21 }
22}
1import { get, prefix } from 'vovk';
2
3type Token = { message: string };
4
5@prefix('stream')
6export default class StreamController {
7 @get('tokens', { cors: true })
8 static async *streamTokens() {
9 const tokens: Token[] = [
10 { message: 'Hello,' },
11 { message: ' World' },
12 { message: ' from' },
13 { message: ' Stream' },
14 { message: '!' },
15 ];
16
17 for (const token of tokens) {
18 yield token;
19 await new Promise((resolve) => setTimeout(resolve, 300));
20 }
21 }
22}
1import { get, prefix } from 'vovk';
2
3type Token = { message: string };
4
5@prefix('stream')
6export default class StreamController {
7 @get('tokens', { cors: true })
8 static async *streamTokens() {
9 const tokens: Token[] = [
10 { message: 'Hello,' },
11 { message: ' World' },
12 { message: ' from' },
13 { message: ' Stream' },
14 { message: '!' },
15 ];
16
17 for (const token of tokens) {
18 yield token;
19 await new Promise((resolve) => setTimeout(resolve, 300));
20 }
21 }
22}
1import { get, prefix } from 'vovk';
2
3type Token = { message: string };
4
5@prefix('stream')
6export default class StreamController {
7 @get('tokens', { cors: true })
8 static async *streamTokens() {
9 const tokens: Token[] = [
10 { message: 'Hello,' },
11 { message: ' World' },
12 { message: ' from' },
13 { message: ' Stream' },
14 { message: '!' },
15 ];
16
17 for (const token of tokens) {
18 yield token;
19 await new Promise((resolve) => setTimeout(resolve, 300));
20 }
21 }
22}
1'use client';
2import { useState } from 'react';
3import { StreamController } from 'vovk-client';
4import type { VovkYieldType } from 'vovk';
5
6export default function StreamExample() {
7 const [tokens, setTokens] = useState<VovkYieldType<typeof StreamController.streamTokens>[]>([]);
8
9 return (
10 <>
11 <button
12 onClick={async () => {
13 setTokens([]);
14 using stream = await StreamController.streamTokens();
15 for await (const token of stream) {
16 setTokens((tokens) => [...tokens, token]);
17 }
18 }}
19 >
20 Get Streamed Greeting from Server
21 </button>
22 <div>
23 {tokens.map(({ message }, i) => (
24 <span key={i}>{message}</span>
25 ))}
26 </div>
27 </>
28 );
29}
1'use client';
2import { useState } from 'react';
3import { StreamController } from 'vovk-client';
4import type { VovkYieldType } from 'vovk';
5
6export default function StreamExample() {
7 const [tokens, setTokens] = useState<VovkYieldType<typeof StreamController.streamTokens>[]>([]);
8
9 return (
10 <>
11 <button
12 onClick={async () => {
13 setTokens([]);
14 using stream = await StreamController.streamTokens();
15 for await (const token of stream) {
16 setTokens((tokens) => [...tokens, token]);
17 }
18 }}
19 >
20 Get Streamed Greeting from Server
21 </button>
22 <div>
23 {tokens.map(({ message }, i) => (
24 <span key={i}>{message}</span>
25 ))}
26 </div>
27 </>
28 );
29}
1'use client';
2import { useState } from 'react';
3import { StreamController } from 'vovk-client';
4import type { VovkYieldType } from 'vovk';
5
6export default function StreamExample() {
7 const [tokens, setTokens] = useState<VovkYieldType<typeof StreamController.streamTokens>[]>([]);
8
9 return (
10 <>
11 <button
12 onClick={async () => {
13 setTokens([]);
14 using stream = await StreamController.streamTokens();
15 for await (const token of stream) {
16 setTokens((tokens) => [...tokens, token]);
17 }
18 }}
19 >
20 Get Streamed Greeting from Server
21 </button>
22 <div>
23 {tokens.map(({ message }, i) => (
24 <span key={i}>{message}</span>
25 ))}
26 </div>
27 </>
28 );
29}
1'use client';
2import { useState } from 'react';
3import { StreamController } from 'vovk-client';
4import type { VovkYieldType } from 'vovk';
5
6export default function StreamExample() {
7 const [tokens, setTokens] = useState<VovkYieldType<typeof StreamController.streamTokens>[]>([]);
8
9 return (
10 <>
11 <button
12 onClick={async () => {
13 setTokens([]);
14 using stream = await StreamController.streamTokens();
15 for await (const token of stream) {
16 setTokens((tokens) => [...tokens, token]);
17 }
18 }}
19 >
20 Get Streamed Greeting from Server
21 </button>
22 <div>
23 {tokens.map(({ message }, i) => (
24 <span key={i}>{message}</span>
25 ))}
26 </div>
27 </>
28 );
29}