ElectronJS開發系列：net子產品請求

ElectronJS桌面開發過程中，我們少不了要和雲端伺服器進行接口互動，寫習慣了web的同學，可能習慣性的用axios或者XHR向後端發起請求，但是我們會遇到跨域的問題，我們可能會按照平時的開發習慣去webpack中配置proxy，但是會發現，打包成安裝包後，跨域問題又出現了，根本原因是ElectronJS打包後，這時請求的頁面變成了file://協定，并且proxy隻對開發生效，是以跨域還存在，這個時間解決方案有三個：

1、找運維或者後端設定允許跨域請求

2、electronjs官方提供解決方案，使用net子產品發送請求

3、使用nodejs的http, https發起請求

官方推薦使用方式二，因為方法二可以相容系統代理配置，滿足抓包等調試需求。本文主要介紹net子產品發起請求。

建立一個請求：

const clientRequest = net.request({
  url: 'https://www.baidu.com/user/login',
  method: 'post'
})           

配置項目說明：

options (Object | string) - 如果 options 是字元串，則為請求的 URL。 如果是對象，它應該通過以下屬性完全指定HTTP請求：

method string (可選) - HTTP 請求方法。 預設為GET方法。

url string (可選) - 請求URL。 必須以絕對路徑形式提供，并将協定指定為http或https。

session Object (可選) - 與請求相關聯的Session執行個體.

partition string (可選) - 與請求相關聯的partition名稱. 預設為空字元串. session 選項取代了 partition。 是以, 如果session是顯式指定的, 則partition将被忽略.

credentials string (可選) - 可以是 include 或 omit。 是否随此請求發送 憑據。 如果設定為 include，将使用與請求相關的會話憑據。 如果設定為 omit，則不會随請求發送憑據(并且不會在 401響應的事件中觸發 'login' 事件)。 這與同名的 fetch 選項的行為相同。 如果未指定此選項，則會發送來自會話的身份驗證資料，同時不發送cookie(除非 設定了useSessionCookies)。

useSessionCookies boolean (可選) - 是否從提供的會話與請求一起發送cookie。 如果指定了 credentials ，則此選項沒有效果。 預設值為 false.

protocol string (可選) - 可以是 http: 或 https:。 協定方案的形式為“scheme:”。 預設為 'http:'。

host string (可選) - 作為連接配接提供的伺服器主機,主機名和端口号'hostname:port'.

hostname string (可選) - 伺服器主機名.

port Integer (可選) - 伺服器偵聽的端口号.

path string (可選) - 請求URL的路徑部分.

redirect string (可選) - 可以是 follow， error 或 manual。 目前請求的重定向模式。 當模式為 error 時，任何重定向都會被中止。 當模式為 manual 時，重定向會被取消，除非 request.followRedirect 在redirect 事件期間同步調用。 預設值為 follow.

origin string (可選) - 請求的源 URL。

設定請求頭：

clientRequest.setHeader('Content-Type', 'application/json')           

注冊response響應事件：

clientRequest.on('response', (response) => {
      // 響應異常
      response.on('error', (err) => {
        console.log(err)
      })
      // 儲存所有接收到的Buffer資料
      let allChunk = []
      let size = 0
      // 注冊接收完畢事件
      response.on('end', () => {
        try {
          let buf = Buffer.concat(allChunk, size)
          console.log(buf.toString())
        } catch (e) {
          console.log(e)
          reject(e)
        }
      })
      // 注冊分段資料接收事件
      response.on('data', data => {
        // @ts-ignore
        allChunk.push(data)
        size += data.length
      })
    })           

ClientRequest和Response支援的所有事件可以參考官方文檔。

類: ClientRequest | Electron (electronjs.org)

類：IncomingMessage | Electron (electronjs.org)

發送請求資料：

clientRequest.write(JSON.stringify(data))
clientRequest.end()           

這樣就可以實作使用net子產品請求後端接口啦。

注意net子產品隻能在主程序中使用，不能在渲染程序中使用，是以需要通過ipc通訊機制，讓渲染程序調用主程序中的方法請求，并傳回資料。下一節将介紹主程序和渲染程序之間的通訊。