项目中有上传图片功能,自定义input type=file 改变透明度和超出部分隐藏,把按钮和
点击的图标放在上传文件的按钮上面,然后又碰到到获取input里面的图片的本地的路径,
在electron就是不能跨域访问本地,如何解决呢:
百事不得其解,问了我们项目的老大,说是electron的跨域问题,改变如下
webSecurity webPreferences:{nodeIntegration: false, preload: js文件绝对路径 }
//发送图片 sendImgFile(){ console.log("this is sendImgFile click") var files = this.$refs.inputImg.files; //获取input里面的图片的地址后者文件的本地路径; var size = files[0].size;//大小 var file_path = files[0].path;//文件的本地路径 this.file_paths = file_path console.log("获取图片的files:",files,"获取图片的大小:",size,"获取图片本地的地址:",file_path); var content = '<img src= "' + file_path + '" class="file-img">'; 拼接img标签 // var content = '<img :src="'+this.file_paths+'">' this.$refs.chatSendContainer.innerHTML = content; },
import { BrowserWindow, globalShortcut, Menu } from 'electron' import Common from '../common/common.js' const winURL = process.env.NODE_ENV === 'development' ? `http://localhost:${require('../../../../config').port}` : `file://${__dirname}/index.html` function createWindow() { var mainWindow = new BrowserWindow({ height: Common.WINDOW_SIZE_LOGIN.height, Common.WINDOW_SIZE_LOGIN.width, resizable: false, frame: false, webPreferences:{webSecurity: false}//加上这个就可以获取到了本地的图片 }); mainWindow.loadURL(winURL); mainWindow.on('closed', () => { mainWindow = null }); //前期为了调试方面,默认打开控制台 mainWindow.webContents.openDevTools({ detach: true }); //注册打开控制台的快捷键 globalShortcut.register('ctrl+shift+alt+e', function () { let win = BrowserWindow.getFocusedWindow(); if (win) { win.webContents.openDevTools({ detach: true }); } }); //去掉默认菜单栏 Menu.setApplicationMenu(null); // eslint-disable-next-line no-console console.log('mainWindow opened'); BrowserWindow.mainWindow = mainWindow; return mainWindow; } module.exports = { createWindow };