Question

我是Electron的新手，我即将开始使用Electron / AngularJS开发桌面应用程序。桌面应用程序将成为通过RESTful Web服务和Web套接字与后端服务器交互的GUI。

现在我的问题是：Electron向Web服务发出HTTP请求并更新UI的最佳方式是什么？在普通的网络应用程序中，我只是使用Angular的$ http服务直接与Web服务进行交互。但是，我无法在Electron中执行此操作，因为同源策略将阻止请求（据我所知，渲染器在文件中运行：// origin，因此我无法与mysite.com通信）。

我已经提出了几个可能的解决方案，但它们似乎并不理想：

通过将BrowserWindow首选项'web-security'设置为false来禁用同源策略问题。这似乎不是一个好主意，因为如果我的UI代码中有任何类型的跨站点脚本，那么攻击者可以访问我的盒子上的任何文件。
通过IPC接口代理我的所有HTTP请求。然后，主进程可以在不受同源策略限制的情况下发出HTTP请求。但这似乎有点矫枉过正。

我错过了一个更简单的解决方案吗？

Answer 1

作为替代选项，请考虑在服务器上启用CORS并从client生成CORS请求。

Answer 2

根据我的理解，渲染器在文件中运行：// origin我无法与mysite.com通信

我很确定不是这种情况，file://可以与任何来源进行通信

Answer 3

视图html文件通过文件协议加载到电子中，而ajax在文件协议中不起作用。在我的例子中，我在html中设置了一个IPC事件发射器，在主进程中设置了一个IPC事件处理程序。一旦我需要进行任何http调用，我使用事件发射器，然后从主进程发出http请求。请求完成后，我从主进程发出另一个IPC事件，并在html中处理它。我不知道它是否是最优雅的方式，但它在我的情况下起作用。

// sample code in the html

<script>
    const ipc = require("electron").ipcRenderer;

    function sendAjaxCall(params){
        // handle the params 
        // and make a ipc event to the main process
        ipc.send("call-AJAX", params)
    }

    // call the sendAjaxCall function somewhere with proper params

    ipc.on("complete-AJAX", function(evt, arg){
        // process your args and handle the return data
    })
</script>


// sample code in the main js file

const ipc = require("electron").ipcMain;
const request = require("request"); // request is not required, but I found it quite fascinating...


ipc.on("call-AJAX", function(evt, arg){
    // process the args and make the ajax call
    request("http://some-url.com/some/endpoint/", function(e, resp, body){
        // handle the response
        // send ipc event to renderer process
        ipc.send("complete-AJAX", resp)
    })
})

警告上面的代码只是一些样板代码，可以帮助您了解基本知识。我在中Electron’s IPC Modules and How to Use Them找到了一篇很棒的文章，你可以对IPC有一些基本的了解。

进一步资源 -

与Electron中的Web服务集成

3 个答案: