概要
2026年4月30日をもって旧SkyWayがサービス終了する*。
今後も惨劇RoopeRのユドナリウムで遊べるように、Udonarium v1.17に更新し、新skyway対応を行う。
ココフォリア版の発売おめでとうございます。
この時点のソース:バックエンド
この時点のソース:フロントエンド
SkyWayのアプリケーションキーとシークレットキーの取得
前回の記事の手順の通り取得する。
バックエンドの設定
readmeにCDKはHonoを参考にとあったのでやってみる。
cdkフォルダを作り、cdk initで準備する。
import * as core from 'aws-cdk-lib';
import * as iam from 'aws-cdk-lib/aws-iam';
import { NodejsFunction, NodejsFunctionProps } from 'aws-cdk-lib/aws-lambda-nodejs';
import { Construct } from 'constructs';
import { RUNTIME_VERSION } from '../constants/lambda';
import { FunctionUrlAuthType } from 'aws-cdk-lib/aws-lambda';
interface Props extends core.StackProps {
projectId: string;
environment: Record<string, string>;
}
const HANDLER_DIR = '../dist/aws-lambda';
export class UdonariumBackendStack extends core.Stack {
constructor(scope: Construct, id: string, props: Props) {
super(scope, id, props);
const defaultLambdaProps = this.createLambdaProps({
environment: props.environment
});
const fn = this.createLambda(
{
...defaultLambdaProps,
description: 'udonarium key',
entry: `${HANDLER_DIR}/index.js`,
},
'udonarium-backend'
);
const fnUrl = fn.addFunctionUrl({
authType: FunctionUrlAuthType.NONE,
})
new core.CfnOutput(this, 'lambdaUrl', {
value: fnUrl.url!
})
}
private createLambdaProps(props: {
environment?: Record<string, string>;
initialPolicy?: iam.PolicyStatement[];
timeoutSec?: number;
}) {
return {
runtime: RUNTIME_VERSION,
environment: props.environment,
initialPolicy: props.initialPolicy,
timeout: props.timeoutSec ? core.Duration.seconds(props.timeoutSec) : undefined,
};
}
private createLambda(props: NodejsFunctionProps, key: string) {
const func = new NodejsFunction(this, key, props);
return func;
}
}
#!/usr/bin/env node
import 'source-map-support/register';
import * as cdk from 'aws-cdk-lib';
import * as dotenv from 'dotenv';
import { UdonariumBackendStack } from '../lib/lambda-stack';
dotenv.config({ path: './.env' });
const envList = [
'PROJECT_ID',
'SKYWAY_APP_ID',
'SKYWAY_SECRET',
'SKYWAY_UDONARIUM_LOBBY_SIZE',
'ACCESS_CONTROL_ALLOW_ORIGIN',
] as const;
for (const key of envList) {
if (!process.env[key]) throw new Error(`please add ${key} to .env`);
}
const processEnv = process.env as Record<(typeof envList)[number], string>;
const app = new cdk.App();
const env = {
account: process.env.CDK_DEFAULT_ACCOUNT,
region: process.env.CDK_DEFAULT_REGION,
};
new UdonariumBackendStack(app, `${processEnv.PROJECT_ID}-UdonariumBackendStack`, {
env,
projectId: processEnv.PROJECT_ID,
environment: {
SKYWAY_APP_ID: processEnv.SKYWAY_APP_ID,
SKYWAY_SECRET: processEnv.SKYWAY_SECRET,
SKYWAY_UDONARIUM_LOBBY_SIZE: processEnv.SKYWAY_UDONARIUM_LOBBY_SIZE,
ACCESS_CONTROL_ALLOW_ORIGIN: processEnv.ACCESS_CONTROL_ALLOW_ORIGIN,
},
});
PROJECT_ID=udonarium_backend
SKYWAY_APP_ID=SkyWay2023_Application_ID
SKYWAY_SECRET=SkyWay2023_Secret_key
SKYWAY_UDONARIUM_LOBBY_SIZE=3
ACCESS_CONTROL_ALLOW_ORIGIN=https://hogehoge.cloudfront.net/
フロントエンド作成してURLが分かるまではACCESS_CONTROL_ALLOW_ORIGIN
は*
にしておく。
今回は更新ということで、既知のフロントエンドURLを設定した。
{
"name": "cdk",
// 割愛
"scripts": {
"build": "tsc",
"watch": "tsc -w",
"test": "jest",
"cdk": "cdk",
+ "predeploy-lambda": "cd .. && npm run aws-lambda:build",
+ "deploy-lambda": "cdk -a \"npx ts-node --prefer-ts-exts bin/lambda.ts\" deploy --all --profile produser"
},
// 割愛
}
デプロイ用のスクリプトを追加する。
今回はビルドしたものをそのまま lambdaとして公開する。
cd cdk && npm run deploy-lambda
デプロイするとURLが表示されるので控えておくこと。
この後、フロントエンドの設定で使用する。
udonarium_backend-UdonariumBackendStack.lambdaUrl = https://piyopiyo.lambda-url.ap-northeast-1.on.aws/
フロントエンドの設定
cdkは特別なことをやっていないので割愛。
新SkyWayを使うために下記を書き換えてでp。
backend:
mode: skyway2023 #'skyway2023' or 'skyway'
- url: https://{your-backend-hostname} #Your Backend API URL
+ url: https://piyopiyo.lambda-url.ap-northeast-1.on.aws/
webrtc: #非推奨(旧SkyWay)
key: aaaaaaaa-bbbb-ccccc-dddd-eeeeeeeeeeee #[deprecated] Your (old) SkyWay API key
app: #未使用
dice: #未使用
参考
旧 SkyWay の Community Edition はいつまで利用できますか?
github/hibohiboo udonarium-backend
github/hibohiboo udonarium
ユドナリウムを CLOUDFLARE の Workers & Pages に設置したメモ
ユドナリウム1.17.2をローカルで動かしてみたメモ