在electron中实现跨域请求,无需更改服务器端设置

转载 https://segmentfault.com/a/1190000012030202

很简单,在Electron的BrowserWindow模块中配置这样一个参数:

mainWindow = new BrowserWindow({
    webPreferences: {webSecurity: false},
  })

webSecurity是什么意思呢?顾名思义,他是设置web安全性,如果参数设置为 false,它将禁用相同地方的规则 (通常测试服), 并且如果有2个非用户设置的参数,就设置 allowDisplayingInsecureContent 和 allowRunningInsecureContent的值为true。 (webSecurity的默认值为true

allowDisplayingInsecureContent表示是否允许一个使用 https的界面来展示由 http URLs 传过来的资源。默认false
allowRunningInsecureContent表示是否允许一个使用 https的界面来渲染由 http URLs 提交的html,css,javascript。默认为 false

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,以下是一个使用 Vue.js 和 Electron 进行服务器接口请求的 Demo: 首先,你需要按照上面的步骤安装 Electron 和 Vue CLI,并创建一个 Vue.js 项目。 然后,安装 axios 和 electron-store: ``` npm install axios electron-store --save ``` axios 是一个用于发送 HTTP 请求的库,electron-store 是一个 Electron 应用的本地存储库。 接着,在 `src` 目录下创建一个 `api.js` 文件,用于发送服务器接口请求: ```javascript import axios from 'axios' import store from 'electron-store' const instance = axios.create({ baseURL: 'http://localhost:3000', // 服务器接口地址 timeout: 5000 // 请求超时时间 }) instance.interceptors.request.use(config => { const token = store.get('token') // 从本地存储获取 token if (token) { config.headers.Authorization = `Bearer ${token}` // 设置请求头的 Authorization } return config }, error => { return Promise.reject(error) }) instance.interceptors.response.use(response => { return response.data }, error => { return Promise.reject(error) }) export default instance ``` 其,`baseURL` 是服务器接口地址,`timeout` 设置了请求超时时间,`interceptors` 用于设置请求拦截器和响应拦截器。拦截器可以添加一些公共的请求参数,例如 token。 然后在 Vue.js 组件使用 `api.js` 发送请求: ```vue <template> <div> <h1>发送服务器接口请求</h1> <div v-if="loading">正在加载...</div> <div v-else> <div>{{ data }}</div> <button @click="fetchData">发送请求</button> </div> </div> </template> <script> import api from './api.js' export default { data() { return { loading: false, data: '' } }, methods: { fetchData() { this.loading = true api.get('/data').then(data => { this.loading = false this.data = data }).catch(error => { this.loading = false console.error(error) }) } } } </script> ``` 这样,就可以在 Electron 发送服务器接口请求了。当然,服务器接口需要根据实际情况进行编写。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值