refs #901 Set preload script to import electron, process in webview

This commit is contained in:
AkiraFukushima 2019-05-09 23:54:53 +09:00
parent a6b0369fae
commit fd1c31bf31
7 changed files with 86 additions and 51 deletions

View File

@ -255,7 +255,9 @@ async function createWindow() {
webPreferences: {
// It is required to use ipcRenderer in renderer process.
// But it is not secure, so if you want to disable this option, please use preload script.
nodeIntegration: true
nodeIntegration: true,
contextIsolation: false,
preload: path.resolve(__dirname, './preload.js')
}
}
const config: Config = {

3
src/main/preload.js Normal file
View File

@ -0,0 +1,3 @@
const electron = require('electron')
global.ipcRenderer = electron.ipcRenderer
global.process = process

View File

@ -16,15 +16,6 @@ import router from '@/router'
import store from './store'
import i18next from '~/src/config/i18n'
declare function require(x: string): any
declare var process: {
env: {
NODE_ENV: string,
IS_WEB: boolean
}
}
Vue.use(ElementUI, { locale })
Vue.use(shortkey)
Vue.use(VueI18Next)
@ -33,7 +24,6 @@ Vue.component('popper', Popper)
sync(store, router)
if (!process.env.IS_WEB) Vue.use(require('vue-electron'))
Vue.config.productionTip = false
const i18n: VueI18Next = new VueI18Next(i18next)

View File

@ -1,6 +1,34 @@
import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login.vue'
import Authorize from '@/components/Authorize.vue'
import Preferences from '@/components/Preferences.vue'
import PreferencesGeneral from '@/components/Preferences/General.vue'
import PreferencesAppearance from '@/components/Preferences/Appearance.vue'
import PreferencesNotification from '@/components/Preferences/Notification.vue'
import PreferencesAccount from '@/components/Preferences/Account.vue'
import PreferencesLanguage from '@/components/Preferences/Language.vue'
import GlobalHeader from '@/components/GlobalHeader.vue'
import Settings from '@/components/Settings.vue'
import SettingsGeneral from '@/components/Settings/General.vue'
import SettingsTimeline from '@/components/Settings/Timeline.vue'
import TimelineSpace from '@/components/TimelineSpace.vue'
import TimelineSpaceContentsHome from '@/components/TimelineSpace/Contents/Home.vue'
import TimelineSpaceContentsNotifications from '@/components/TimelineSpace/Contents/Notifications.vue'
import TimelineSpaceContentsMentions from '@/components/TimelineSpace/Contents/Mentions.vue'
import TimelineSpaceContentsFavourites from '@/components/TimelineSpace/Contents/Favourites.vue'
import TimelineSpaceContentsLocal from '@/components/TimelineSpace/Contents/Local.vue'
import TimelineSpaceContentsPublic from '@/components/TimelineSpace/Contents/Public.vue'
import TimelineSpaceContentsHashtag from '@/components/TimelineSpace/Contents/Hashtag.vue'
import TimelineSpaceContentsHashtagList from '@/components/TimelineSpace/Contents/Hashtag/List.vue'
import TimelineSpaceContentsHashtagTag from '@/components/TimelineSpace/Contents/Hashtag/Tag.vue'
import TimelineSpaceContentsSearch from '@/components/TimelineSpace/Contents/Search.vue'
import TimelineSpaceContentsDirectMessages from '@/components/TimelineSpace/Contents/DirectMessages.vue'
import TimelineSpaceContentsListsIndex from '@/components/TimelineSpace/Contents/Lists/Index.vue'
import TimelineSpaceContentsListsEdit from '@/components/TimelineSpace/Contents/Lists/Edit.vue'
import TimelineSpaceContentsListsShow from '@/components/TimelineSpace/Contents/Lists/Show.vue'
Vue.use(Router)
const router = new Router({
@ -8,38 +36,38 @@ const router = new Router({
{
path: '/login',
name: 'login',
component: require('@/components/Login').default
component: Login
},
{
path: '/authorize',
name: 'authorize',
component: require('@/components/Authorize').default,
component: Authorize,
props: route => ({ url: route.query.url })
},
{
path: '/preferences/',
name: 'preferences',
component: require('@/components/Preferences').default,
component: Preferences,
children: [
{
path: 'general',
name: 'general',
component: require('@/components/Preferences/General').default
component: PreferencesGeneral
},
{
path: 'appearance',
name: 'appearance',
component: require('@/components/Preferences/Appearance').default
component: PreferencesAppearance
},
{
path: 'notification',
name: 'notification',
component: require('@/components/Preferences/Notification').default
component: PreferencesNotification
},
{
path: 'account',
name: 'account',
component: require('@/components/Preferences/Account').default
component: PreferencesAccount
},
{
path: 'network',
@ -49,48 +77,48 @@ const router = new Router({
{
path: 'language',
name: 'language',
component: require('@/components/Preferences/Language').default
component: PreferencesLanguage
}
]
},
{
path: '/',
name: 'global-header',
component: require('@/components/GlobalHeader').default,
component: GlobalHeader,
children: [
{
path: ':id/settings/',
component: require('@/components/Settings').default,
component: Settings,
children: [
{
path: 'general',
component: require('@/components/Settings/General').default
component: SettingsGeneral
},
{
path: 'timeline',
component: require('@/components/Settings/Timeline').default
component: SettingsTimeline
}
]
},
{
path: ':id/',
name: 'timeline-space',
component: require('@/components/TimelineSpace').default,
component: TimelineSpace,
children: [
{
path: 'home',
name: 'home',
component: require('@/components/TimelineSpace/Contents/Home').default
component: TimelineSpaceContentsHome
},
{
path: 'notifications',
name: 'notifications',
component: require('@/components/TimelineSpace/Contents/Notifications').default
component: TimelineSpaceContentsNotifications
},
{
path: 'mentions',
name: 'mentions',
component: require('@/components/TimelineSpace/Contents/Mentions').default
component: TimelineSpaceContentsMentions
},
{
path: 'follow-requests',
@ -100,31 +128,31 @@ const router = new Router({
{
path: 'favourites',
name: 'favourites',
component: require('@/components/TimelineSpace/Contents/Favourites').default
component: TimelineSpaceContentsFavourites
},
{
path: 'local',
name: 'local',
component: require('@/components/TimelineSpace/Contents/Local').default
component: TimelineSpaceContentsLocal
},
{
path: 'public',
name: 'public',
component: require('@/components/TimelineSpace/Contents/Public').default
component: TimelineSpaceContentsPublic
},
{
path: 'hashtag/',
component: require('@/components/TimelineSpace/Contents/Hashtag').default,
component: TimelineSpaceContentsHashtag,
children: [
{
path: '',
name: 'hashtag-list',
component: require('@/components/TimelineSpace/Contents/Hashtag/List').default
component: TimelineSpaceContentsHashtagList
},
{
path: ':tag',
name: 'tag',
component: require('@/components/TimelineSpace/Contents/Hashtag/Tag').default,
component: TimelineSpaceContentsHashtagTag,
props: true
}
]
@ -132,28 +160,28 @@ const router = new Router({
{
path: 'search',
name: 'search',
component: require('@/components/TimelineSpace/Contents/Search').default
component: TimelineSpaceContentsSearch
},
{
path: 'direct-messages',
name: 'direct-messages',
component: require('@/components/TimelineSpace/Contents/DirectMessages').default
component: TimelineSpaceContentsDirectMessages
},
{
path: 'lists',
name: 'lists',
component: require('@/components/TimelineSpace/Contents/Lists/Index').default
component: TimelineSpaceContentsListsIndex
},
{
path: 'lists/:list_id/edit',
name: 'edit-list',
component: require('@/components/TimelineSpace/Contents/Lists/Edit').default,
component: TimelineSpaceContentsListsEdit,
props: true
},
{
path: 'lists/:list_id',
name: 'list',
component: require('@/components/TimelineSpace/Contents/Lists/Show').default,
component: TimelineSpaceContentsListsShow,
props: true
}
]

View File

@ -1,4 +1,3 @@
import { ipcRenderer } from 'electron'
import { MutationTree, ActionTree, Module } from 'vuex'
import router from '@/router'
import { LightTheme, DarkTheme, SolarizedLightTheme, SolarizedDarkTheme, KimbieDarkTheme, ThemeColorType } from '~/src/constants/themeColor'
@ -12,6 +11,9 @@ import { Notify } from '~/src/types/notify'
import { BaseConfig } from '~/src/types/preference'
import { Appearance } from '~/src/types/appearance'
import { ProxyConfig } from 'megalodon'
import { MyWindow } from '~/src/types/global'
const win = window as MyWindow
export type AppState = {
theme: ThemeColorType
@ -107,22 +109,22 @@ const mutations: MutationTree<AppState> = {
const actions: ActionTree<AppState, RootState> = {
watchShortcutsEvents: () => {
ipcRenderer.on('open-preferences', () => {
win.ipcRenderer.on('open-preferences', () => {
router.push('/preferences/general')
})
},
removeShortcutsEvents: () => {
ipcRenderer.removeAllListeners('open-preferences')
win.ipcRenderer.removeAllListeners('open-preferences')
},
loadPreferences: ({ commit, dispatch }) => {
return new Promise((resolve, reject) => {
ipcRenderer.send('get-preferences')
ipcRenderer.once('error-get-preferences', (_, err: Error) => {
ipcRenderer.removeAllListeners('response-get-preferences')
win.ipcRenderer.send('get-preferences')
win.ipcRenderer.once('error-get-preferences', (_, err: Error) => {
win.ipcRenderer.removeAllListeners('response-get-preferences')
reject(err)
})
ipcRenderer.once('response-get-preferences', (_, conf: BaseConfig) => {
ipcRenderer.removeAllListeners('error-get-preferences')
win.ipcRenderer.once('response-get-preferences', (_, conf: BaseConfig) => {
win.ipcRenderer.removeAllListeners('error-get-preferences')
dispatch('updateTheme', conf.appearance)
commit(MUTATION_TYPES.UPDATE_DISPLAY_NAME_STYLE, conf.appearance.displayNameStyle)
commit(MUTATION_TYPES.UPDATE_FONT_SIZE, conf.appearance.fontSize)
@ -166,11 +168,11 @@ const actions: ActionTree<AppState, RootState> = {
},
loadProxy: ({ commit }) => {
return new Promise(resolve => {
ipcRenderer.once('response-get-proxy-configuration', (_, proxy: ProxyConfig | false) => {
win.ipcRenderer.once('response-get-proxy-configuration', (_, proxy: ProxyConfig | false) => {
commit(MUTATION_TYPES.UPDATE_PROXY_CONFIGURATION, proxy)
resolve(proxy)
})
ipcRenderer.send('get-proxy-configuration')
win.ipcRenderer.send('get-proxy-configuration')
})
}
}

View File

@ -11,10 +11,13 @@ import TimelineSpace, { TimelineSpaceModuleState } from './TimelineSpace'
import Preferences, { PreferencesModuleState } from './Preferences'
import Settings, { SettingsModuleState } from './Settings'
import organisms, { OrganismsModuleState } from './organisms'
import { MyWindow } from '~/src/types/global'
Vue.use(Vuex)
export type RootState = {
const win = window as MyWindow
export interface RootState {
App: AppState
GlobalHeader: GlobalHeaderState
Login: LoginState
@ -27,8 +30,8 @@ export type RootState = {
}
export default new Vuex.Store({
strict: process.env.NODE_ENV !== 'production',
plugins: process.env.NODE_ENV !== 'production' ? [createLogger({})] : [],
strict: win.process.env.NODE_ENV !== 'production',
plugins: win.process.env.NODE_ENV !== 'production' ? [createLogger({})] : [],
modules: {
App,
GlobalHeader,

7
src/types/global.ts Normal file
View File

@ -0,0 +1,7 @@
import { Shell, IpcRenderer } from 'electron'
export interface MyWindow extends Window {
shell: Shell
ipcRenderer: IpcRenderer
process: NodeJS.Process
}