Merge pull request #933 from syuilo/sw

ServiceWorker support
This commit is contained in:
syuilo 2017-11-21 07:20:13 +09:00 committed by GitHub
commit 1e52060c5f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 381 additions and 34 deletions

View file

@ -159,6 +159,7 @@
"typescript": "2.6.1", "typescript": "2.6.1",
"uuid": "3.1.0", "uuid": "3.1.0",
"vhost": "3.0.2", "vhost": "3.0.2",
"web-push": "^3.2.4",
"websocket": "1.0.25", "websocket": "1.0.25",
"xev": "2.0.0" "xev": "2.0.0"
} }

48
src/api/common/push-sw.ts Normal file
View file

@ -0,0 +1,48 @@
const push = require('web-push');
import * as mongo from 'mongodb';
import Subscription from '../models/sw-subscription';
import config from '../../conf';
if (config.sw) {
push.setGCMAPIKey(config.sw.gcm_api_key);
}
export default async function(userId: mongo.ObjectID | string, type, body?) {
if (!config.sw) return;
if (typeof userId === 'string') {
userId = new mongo.ObjectID(userId);
}
// Fetch
const subscriptions = await Subscription.find({
user_id: userId
});
subscriptions.forEach(subscription => {
const pushSubscription = {
endpoint: subscription.endpoint,
keys: {
auth: subscription.auth,
p256dh: subscription.publickey
}
};
push.sendNotification(pushSubscription, JSON.stringify({
type, body
})).catch(err => {
//console.log(err.statusCode);
//console.log(err.headers);
//console.log(err.body);
if (err.statusCode == 410) {
Subscription.remove({
user_id: userId,
endpoint: subscription.endpoint,
auth: subscription.auth,
publickey: subscription.publickey
});
}
});
});
}

View file

@ -146,6 +146,11 @@ const endpoints: Endpoint[] = [
name: 'aggregation/posts/reactions' name: 'aggregation/posts/reactions'
}, },
{
name: 'sw/register',
withCredential: true
},
{ {
name: 'i', name: 'i',
withCredential: true withCredential: true

View file

@ -9,8 +9,7 @@ import User from '../../../models/user';
import DriveFile from '../../../models/drive-file'; import DriveFile from '../../../models/drive-file';
import serialize from '../../../serializers/messaging-message'; import serialize from '../../../serializers/messaging-message';
import publishUserStream from '../../../event'; import publishUserStream from '../../../event';
import { publishMessagingStream } from '../../../event'; import { publishMessagingStream, publishMessagingIndexStream, pushSw } from '../../../event';
import { publishMessagingIndexStream } from '../../../event';
import config from '../../../../conf'; import config from '../../../../conf';
/** /**
@ -99,6 +98,7 @@ module.exports = (params, user) => new Promise(async (res, rej) => {
const freshMessage = await Message.findOne({ _id: message._id }, { is_read: true }); const freshMessage = await Message.findOne({ _id: message._id }, { is_read: true });
if (!freshMessage.is_read) { if (!freshMessage.is_read) {
publishUserStream(message.recipient_id, 'unread_messaging_message', messageObj); publishUserStream(message.recipient_id, 'unread_messaging_message', messageObj);
pushSw(message.recipient_id, 'unread_messaging_message', messageObj);
} }
}, 3000); }, 3000);

View file

@ -14,7 +14,7 @@ import ChannelWatching from '../../models/channel-watching';
import serialize from '../../serializers/post'; import serialize from '../../serializers/post';
import notify from '../../common/notify'; import notify from '../../common/notify';
import watch from '../../common/watch-post'; import watch from '../../common/watch-post';
import { default as event, publishChannelStream } from '../../event'; import event, { pushSw, publishChannelStream } from '../../event';
import config from '../../../conf'; import config from '../../../conf';
/** /**
@ -234,7 +234,7 @@ module.exports = (params, user: IUser, app) => new Promise(async (res, rej) => {
const mentions = []; const mentions = [];
function addMention(mentionee, type) { function addMention(mentionee, reason) {
// Reject if already added // Reject if already added
if (mentions.some(x => x.equals(mentionee))) return; if (mentions.some(x => x.equals(mentionee))) return;
@ -243,7 +243,8 @@ module.exports = (params, user: IUser, app) => new Promise(async (res, rej) => {
// Publish event // Publish event
if (!user._id.equals(mentionee)) { if (!user._id.equals(mentionee)) {
event(mentionee, type, postObj); event(mentionee, reason, postObj);
pushSw(mentionee, reason, postObj);
} }
} }

View file

@ -0,0 +1,50 @@
/**
* Module dependencies
*/
import $ from 'cafy';
import Subscription from '../../models/sw-subscription';
/**
* subscribe service worker
*
* @param {any} params
* @param {any} user
* @param {any} _
* @param {boolean} isSecure
* @return {Promise<any>}
*/
module.exports = async (params, user, _, isSecure) => new Promise(async (res, rej) => {
// Get 'endpoint' parameter
const [endpoint, endpointErr] = $(params.endpoint).string().$;
if (endpointErr) return rej('invalid endpoint param');
// Get 'auth' parameter
const [auth, authErr] = $(params.auth).string().$;
if (authErr) return rej('invalid auth param');
// Get 'publickey' parameter
const [publickey, publickeyErr] = $(params.publickey).string().$;
if (publickeyErr) return rej('invalid publickey param');
// if already subscribed
const exist = await Subscription.findOne({
user_id: user._id,
endpoint: endpoint,
auth: auth,
publickey: publickey,
deleted_at: { $exists: false }
});
if (exist !== null) {
return res();
}
await Subscription.insert({
user_id: user._id,
endpoint: endpoint,
auth: auth,
publickey: publickey
});
res();
});

View file

@ -1,5 +1,6 @@
import * as mongo from 'mongodb'; import * as mongo from 'mongodb';
import * as redis from 'redis'; import * as redis from 'redis';
import swPush from './common/push-sw';
import config from '../conf'; import config from '../conf';
type ID = string | mongo.ObjectID; type ID = string | mongo.ObjectID;
@ -17,6 +18,10 @@ class MisskeyEvent {
this.publish(`user-stream:${userId}`, type, typeof value === 'undefined' ? null : value); this.publish(`user-stream:${userId}`, type, typeof value === 'undefined' ? null : value);
} }
public publishSw(userId: ID, type: string, value?: any): void {
swPush(userId, type, value);
}
public publishDriveStream(userId: ID, type: string, value?: any): void { public publishDriveStream(userId: ID, type: string, value?: any): void {
this.publish(`drive-stream:${userId}`, type, typeof value === 'undefined' ? null : value); this.publish(`drive-stream:${userId}`, type, typeof value === 'undefined' ? null : value);
} }
@ -50,6 +55,8 @@ const ev = new MisskeyEvent();
export default ev.publishUserStream.bind(ev); export default ev.publishUserStream.bind(ev);
export const pushSw = ev.publishSw.bind(ev);
export const publishDriveStream = ev.publishDriveStream.bind(ev); export const publishDriveStream = ev.publishDriveStream.bind(ev);
export const publishPostStream = ev.publishPostStream.bind(ev); export const publishPostStream = ev.publishPostStream.bind(ev);

View file

@ -0,0 +1,3 @@
import db from '../../db/mongodb';
export default db.get('sw_subscriptions') as any; // fuck type definition

View file

@ -75,6 +75,14 @@ type Source = {
analysis?: { analysis?: {
mecab_command?: string; mecab_command?: string;
}; };
/**
* Service Worker
*/
sw?: {
gcm_sender_id: string;
gcm_api_key: string;
};
}; };
/** /**
@ -109,7 +117,7 @@ export default function load() {
const url = URL.parse(config.url); const url = URL.parse(config.url);
const head = url.host.split('.')[0]; const head = url.host.split('.')[0];
if (head != 'misskey') { if (head != 'misskey' && head != 'localhost') {
console.error(`プライマリドメインは、必ず「misskey」ドメインで始まっていなければなりません(現在の設定では「${head}」で始まっています)。例えば「https://misskey.xyz」「http://misskey.my.app.example.com」などが正しいプライマリURLです。`); console.error(`プライマリドメインは、必ず「misskey」ドメインで始まっていなければなりません(現在の設定では「${head}」で始まっています)。例えば「https://misskey.xyz」「http://misskey.my.app.example.com」などが正しいプライマリURLです。`);
process.exit(); process.exit();
} }

View file

@ -27,7 +27,9 @@
// misskey.alice => misskey // misskey.alice => misskey
// misskey.strawberry.pasta => misskey // misskey.strawberry.pasta => misskey
// dev.misskey.arisu.tachibana => dev // dev.misskey.arisu.tachibana => dev
let app = url.host.split('.')[0]; let app = url.host == 'localhost'
? 'misskey'
: url.host.split('.')[0];
// Detect the user language // Detect the user language
// Note: The default language is English // Note: The default language is English

View file

@ -6,6 +6,9 @@ import HomeStreamManager from './scripts/streaming/home-stream-manager';
import CONFIG from './scripts/config'; import CONFIG from './scripts/config';
import api from './scripts/api'; import api from './scripts/api';
declare var VERSION: string;
declare var LANG: string;
/** /**
* Misskey Operating System * Misskey Operating System
*/ */
@ -32,21 +35,58 @@ export default class MiOS extends EventEmitter {
return this.i != null; return this.i != null;
} }
/**
* Whether is debug mode
*/
public get debug() {
return localStorage.getItem('debug') == 'true';
}
/** /**
* A connection manager of home stream * A connection manager of home stream
*/ */
public stream: HomeStreamManager; public stream: HomeStreamManager;
/**
* A registration of service worker
*/
private swRegistration: ServiceWorkerRegistration = null;
constructor() { constructor() {
super(); super();
//#region BIND //#region BIND
this.log = this.log.bind(this);
this.logInfo = this.logInfo.bind(this);
this.logWarn = this.logWarn.bind(this);
this.logError = this.logError.bind(this);
this.init = this.init.bind(this); this.init = this.init.bind(this);
this.api = this.api.bind(this); this.api = this.api.bind(this);
this.getMeta = this.getMeta.bind(this); this.getMeta = this.getMeta.bind(this);
this.registerSw = this.registerSw.bind(this);
//#endregion //#endregion
} }
public log(...args) {
if (!this.debug) return;
console.log.apply(null, args);
}
public logInfo(...args) {
if (!this.debug) return;
console.info.apply(null, args);
}
public logWarn(...args) {
if (!this.debug) return;
console.warn.apply(null, args);
}
public logError(...args) {
if (!this.debug) return;
console.error.apply(null, args);
}
/** /**
* Initialize MiOS (boot) * Initialize MiOS (boot)
* @param callback A function that call when initialized * @param callback A function that call when initialized
@ -126,12 +166,21 @@ export default class MiOS extends EventEmitter {
// Finish init // Finish init
callback(); callback();
//#region Post
// Init service worker
this.registerSw();
//#endregion
}; };
// Get cached account data // Get cached account data
const cachedMe = JSON.parse(localStorage.getItem('me')); const cachedMe = JSON.parse(localStorage.getItem('me'));
// キャッシュがあったとき
if (cachedMe) { if (cachedMe) {
// とりあえずキャッシュされたデータでお茶を濁して(?)おいて、
fetched(cachedMe); fetched(cachedMe);
// 後から新鮮なデータをフェッチ // 後から新鮮なデータをフェッチ
@ -147,6 +196,67 @@ export default class MiOS extends EventEmitter {
} }
} }
/**
* Register service worker
*/
private registerSw() {
// Check whether service worker and push manager supported
const isSwSupported =
('serviceWorker' in navigator) && ('PushManager' in window);
// Reject when browser not service worker supported
if (!isSwSupported) return;
// Reject when not signed in to Misskey
if (!this.isSignedin) return;
// When service worker activated
navigator.serviceWorker.ready.then(registration => {
this.log('[sw] ready: ', registration);
this.swRegistration = registration;
// Options of pushManager.subscribe
const opts = {
// A boolean indicating that the returned push subscription
// will only be used for messages whose effect is made visible to the user.
userVisibleOnly: true
};
// Subscribe push notification
this.swRegistration.pushManager.subscribe(opts).then(subscription => {
this.log('[sw] Subscribe OK:', subscription);
function encode(buffer: ArrayBuffer) {
return btoa(String.fromCharCode.apply(null, new Uint8Array(buffer)));
}
// Register
this.api('sw/register', {
endpoint: subscription.endpoint,
auth: encode(subscription.getKey('auth')),
publickey: encode(subscription.getKey('p256dh'))
});
}).then(() => {
this.logInfo('[sw] Server Stored Subscription.');
}).catch(err => {
this.logError('[sw] Subscribe Error:', err);
});
});
// The path of service worker script
const sw = `/sw.${VERSION}.${LANG}.js`;
// Register service worker
navigator.serviceWorker.register(sw).then(registration => {
// 登録成功
this.logInfo('[sw] Registration successful with scope: ', registration.scope);
}).catch(err => {
// 登録失敗 :(
this.logError('[sw] Registration failed: ', err);
});
}
/** /**
* Misskey APIにリクエストします * Misskey APIにリクエストします
* @param endpoint * @param endpoint

View file

@ -0,0 +1,52 @@
import getPostSummary from '../../../../common/get-post-summary';
type Notification = {
title: string;
body: string;
icon: string;
onclick?: any;
};
// TODO: i18n
export default function(type, data): Notification {
switch (type) {
case 'drive_file_created':
return {
title: 'ファイルがアップロードされました',
body: data.name,
icon: data.url + '?thumbnail&size=64'
};
case 'mention':
return {
title: `${data.user.name}さんから:`,
body: getPostSummary(data),
icon: data.user.avatar_url + '?thumbnail&size=64'
};
case 'reply':
return {
title: `${data.user.name}さんから返信:`,
body: getPostSummary(data),
icon: data.user.avatar_url + '?thumbnail&size=64'
};
case 'quote':
return {
title: `${data.user.name}さんが引用:`,
body: getPostSummary(data),
icon: data.user.avatar_url + '?thumbnail&size=64'
};
case 'unread_messaging_message':
return {
title: `${data.user.name}さんからメッセージ:`,
body: data.text, // TODO: getMessagingMessageSummary(data),
icon: data.user.avatar_url + '?thumbnail&size=64'
};
default:
return null;
}
}

View file

@ -1,9 +1,11 @@
const Url = new URL(location.href); const _url = new URL(location.href);
const isRoot = Url.host.split('.')[0] == 'misskey'; const isRoot = _url.host == 'localhost'
? true
: _url.host.split('.')[0] == 'misskey';
const host = isRoot ? Url.host : Url.host.substring(Url.host.indexOf('.') + 1, Url.host.length); const host = isRoot ? _url.host : _url.host.substring(_url.host.indexOf('.') + 1, _url.host.length);
const scheme = Url.protocol; const scheme = _url.protocol;
const url = `${scheme}//${host}`; const url = `${scheme}//${host}`;
const apiUrl = `${scheme}//api.${host}`; const apiUrl = `${scheme}//api.${host}`;
const chUrl = `${scheme}//ch.${host}`; const chUrl = `${scheme}//ch.${host}`;

View file

@ -11,9 +11,9 @@ import * as riot from 'riot';
import init from '../init'; import init from '../init';
import route from './router'; import route from './router';
import fuckAdBlock from './scripts/fuck-ad-block'; import fuckAdBlock from './scripts/fuck-ad-block';
import getPostSummary from '../../../common/get-post-summary';
import MiOS from '../common/mios'; import MiOS from '../common/mios';
import HomeStreamManager from '../common/scripts/streaming/home-stream-manager'; import HomeStreamManager from '../common/scripts/streaming/home-stream-manager';
import composeNotification from '../common/scripts/compose-notification';
/** /**
* init * init
@ -55,41 +55,46 @@ function registerNotifications(stream: HomeStreamManager) {
function attach(connection) { function attach(connection) {
connection.on('drive_file_created', file => { connection.on('drive_file_created', file => {
const n = new Notification('ファイルがアップロードされました', { const _n = composeNotification('drive_file_created', file);
body: file.name, const n = new Notification(_n.title, {
icon: file.url + '?thumbnail&size=64' body: _n.body,
icon: _n.icon
}); });
setTimeout(n.close.bind(n), 5000); setTimeout(n.close.bind(n), 5000);
}); });
connection.on('mention', post => { connection.on('mention', post => {
const n = new Notification(`${post.user.name}さんから:`, { const _n = composeNotification('mention', post);
body: getPostSummary(post), const n = new Notification(_n.title, {
icon: post.user.avatar_url + '?thumbnail&size=64' body: _n.body,
icon: _n.icon
}); });
setTimeout(n.close.bind(n), 6000); setTimeout(n.close.bind(n), 6000);
}); });
connection.on('reply', post => { connection.on('reply', post => {
const n = new Notification(`${post.user.name}さんから返信:`, { const _n = composeNotification('reply', post);
body: getPostSummary(post), const n = new Notification(_n.title, {
icon: post.user.avatar_url + '?thumbnail&size=64' body: _n.body,
icon: _n.icon
}); });
setTimeout(n.close.bind(n), 6000); setTimeout(n.close.bind(n), 6000);
}); });
connection.on('quote', post => { connection.on('quote', post => {
const n = new Notification(`${post.user.name}さんが引用:`, { const _n = composeNotification('quote', post);
body: getPostSummary(post), const n = new Notification(_n.title, {
icon: post.user.avatar_url + '?thumbnail&size=64' body: _n.body,
icon: _n.icon
}); });
setTimeout(n.close.bind(n), 6000); setTimeout(n.close.bind(n), 6000);
}); });
connection.on('unread_messaging_message', message => { connection.on('unread_messaging_message', message => {
const n = new Notification(`${message.user.name}さんからメッセージ:`, { const _n = composeNotification('unread_messaging_message', message);
body: message.text, // TODO: getMessagingMessageSummary(message), const n = new Notification(_n.title, {
icon: message.user.avatar_url + '?thumbnail&size=64' body: _n.body,
icon: _n.icon
}); });
n.onclick = () => { n.onclick = () => {
n.close(); n.close();

View file

@ -18,7 +18,9 @@ require('./common/tags');
console.info(`Misskey v${VERSION} (葵 aoi)`); console.info(`Misskey v${VERSION} (葵 aoi)`);
document.domain = CONFIG.host; if (CONFIG.host != 'localhost') {
document.domain = CONFIG.host;
}
{ // Set lang attr { // Set lang attr
const html = document.documentElement; const html = document.documentElement;

33
src/web/app/sw.js Normal file
View file

@ -0,0 +1,33 @@
/**
* Service Worker
*/
import composeNotification from './common/scripts/compose-notification';
// インストールされたとき
self.addEventListener('install', () => {
console.info('installed');
});
// プッシュ通知を受け取ったとき
self.addEventListener('push', ev => {
console.log('pushed');
// クライアント取得
ev.waitUntil(self.clients.matchAll({
includeUncontrolled: true
}).then(clients => {
// クライアントがあったらストリームに接続しているということなので通知しない
if (clients.length != 0) return;
const { type, body } = ev.data.json();
console.log(type, body);
const n = composeNotification(type, body);
return self.registration.showNotification(n.title, {
body: n.body,
icon: n.icon,
});
}));
});

View file

@ -37,28 +37,45 @@ app.use((req, res, next) => {
* Static assets * Static assets
*/ */
app.use(favicon(`${__dirname}/assets/favicon.ico`)); app.use(favicon(`${__dirname}/assets/favicon.ico`));
app.get('/manifest.json', (req, res) => res.sendFile(`${__dirname}/assets/manifest.json`));
app.get('/apple-touch-icon.png', (req, res) => res.sendFile(`${__dirname}/assets/apple-touch-icon.png`)); app.get('/apple-touch-icon.png', (req, res) => res.sendFile(`${__dirname}/assets/apple-touch-icon.png`));
app.use('/assets', express.static(`${__dirname}/assets`, { app.use('/assets', express.static(`${__dirname}/assets`, {
maxAge: ms('7 days') maxAge: ms('7 days')
})); }));
app.get(/^\/sw\.(.+?)\.js$/, (req, res) => res.sendFile(`${__dirname}/assets/sw.${req.params[0]}.js`));
/** /**
* Common API * Manifest
*/ */
app.get(/\/api:url/, require('./service/url-preview')); app.get('/manifest.json', (req, res) => {
const manifest = require((`${__dirname}/assets/manifest.json`));
// Service Worker
if (config.sw) {
manifest['gcm_sender_id'] = config.sw.gcm_sender_id;
}
res.send(manifest);
});
/** /**
* Serve config * Serve config
*/ */
app.get('/config.json', (req, res) => { app.get('/config.json', (req, res) => {
res.send({ const conf = {
recaptcha: { recaptcha: {
siteKey: config.recaptcha.siteKey siteKey: config.recaptcha.siteKey
} }
}); };
res.send(conf);
}); });
/**
* Common API
*/
app.get(/\/api:url/, require('./service/url-preview'));
/** /**
* Routing * Routing
*/ */

View file

@ -20,7 +20,8 @@ module.exports = langs.map(([lang, locale]) => {
stats: './src/web/app/stats/script.ts', stats: './src/web/app/stats/script.ts',
status: './src/web/app/status/script.ts', status: './src/web/app/status/script.ts',
dev: './src/web/app/dev/script.ts', dev: './src/web/app/dev/script.ts',
auth: './src/web/app/auth/script.ts' auth: './src/web/app/auth/script.ts',
sw: './src/web/app/sw.js'
}; };
const output = { const output = {