2023/07/05

ElectronアプリでCORSを回避する方法

Electron + Vueにaxiosを使用してAPIを叩きに行こうとしたら以下のエラーが出ました。

No 'Access-Control-Allow-Origin' header is present on the requested resource.

CORSのエラーです。
axios CORSで調べるといろいろな対応方法がありましたがどれも解決せず。
もしかしたらElectron側の対応でなにかあるかもしれないと思い調べるとありました!

ElectronのMainProcess側で送信すればCORSに引っかからないようです。
MainProcess側

ipcMain.handle( 'axiosPost', async(event, data, config) => {
    axios({
      url: 'https://xxxxxxxxx.com',
      method: 'post',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8',
        'Access-Control-Allow-Origin': '*',
      },
      data: {
        'account': 'test'
      }
    }).then((res) => {
      return { status: true }
    }).catch(function (error) {
      return { status: false}
    });;
})


RenderProcess側

const result = ipcRenderer.invoke('axiosPost', {
	data: "123456789"
});
console.log(result);

カテゴリー一覧

当ブログについて