关于electron的跨域问题,有本地的图片的地址,访问不了本地的图片

项目中有上传图片功能,自定义input type=file 改变透明度和超出部分隐藏,把按钮和

点击的图标放在上传文件的按钮上面,然后又碰到到获取input里面的图片的本地的路径,

在electron就是不能跨域访问本地,如何解决呢:

百事不得其解,问了我们项目的老大,说是electron的跨域问题,改变如下

1
webSecurity  webPreferences:{nodeIntegration: false,  preload: js文件绝对路径 }

 

1
2
3
4
5
6
7
8
9
10
11
12
//发送图片
      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,
        width: 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
};
复制代码

 

posted @   Lonely,lonelyBurning  阅读(8006)  评论(3编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架
点击右上角即可分享
微信分享提示