云计算 Firefox Windows 编程 shell Python google apache 程序员 php 开源 mysql centos java Ubuntu 微软 wordpress nginx linux Android

nodejs(1):mac 安裝nodejs & electron 環境開發桌面應用

1,下載node安裝包

https://github.com/electron/electron

Electron 是 Github 發布跨平臺桌面應用開發工具,支持 Web 技術開發桌面應用開發,其本身是基於 C++ 開發的,GUI 核心來自於 Chrome,而 JavaScript 引擎使用 v8。

mac 安裝node 6.10.3.pkg https://nodejs.org/

直接下一步,下一步安裝即可。 This package will install Node.js v6.10.3 and npm v3.10.10 into /usr/local/. 
然後 node 和 npm 命令就可以使用了。 
創建第一個helloworld vi hello.js

var http = require('http');
http.createServer(function(req, res){
    res.writeHead(200, {'Content-type': 'text/plain'});
    res.end('Hello World\n');
}).listen(8808, '127.0.0.1');
console.log('Server running at http://127.0.0.1:8808');
node hello.js 
然後訪問 http://127.0.0.1:8808/ 就可以看到效果了。

2,使用taobao 代理

nodejs的網站被屏蔽,可以使用淘寶的鏡像。 
修改 配置文件 ~/.bash_profile

#alias for cnpm
alias cnpm="npm --registry=https://registry.npm.taobao.org \
  --cache=$HOME/.npm/.cache/cnpm \
  --disturl=https://npm.taobao.org/dist \
  --userconfig=$HOME/.cnpmrc
然後就可以使用 cnpm 命令了,(是china npm的意思吧) 
以後都使用 cnpm 命令替換掉npm 命令。

3,下載helloworld 啟動

官方已經提供了一個很簡單的demo了。

# Clone this repository
git clone https://github.com/electron/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies 註意是cnpm 命令!!
cnpm install
# Run the app
npm start


同時可以通過https://electron.atom.io/ 地址下載demo。也是集成了很多例子的。 


4,獲得視頻

已經開啟視頻支持。不需要確認直接調用。 
在瀏覽器上面還要用戶確認下,這個直接調用了。 
對於用戶來說就是一個app應用。 


https://github.com/electron/electron/blob/master/docs/api/desktop-capturer.md

// In the renderer process.
const {desktopCapturer} = require('electron')

desktopCapturer.getSources({types: ['window', 'screen']}, (error, sources) => {
  if (error) throw error
  for (let i = 0; i < sources.length; ++i) {
    if (i == 0) {//獲得第一個。api變了。名字叫別的了。
      navigator.webkitGetUserMedia({
        audio: false,
        video: {
          mandatory: {
            chromeMediaSource: 'desktop',
            chromeMediaSourceId: sources[i].id,
            minWidth: 1280,
            maxWidth: 1280,
            minHeight: 720,
            maxHeight: 720
          }
        }
      }, handleStream, handleError)
      return
    }
  }
})

function handleStream (stream) {
  document.querySelector('video').src = URL.createObjectURL(stream)
}

function handleError (e) {
  console.log(e)
}
5,總結

本文的原文連接是: http://blog.csdn.net/freewebsys/article/details/71261179 未經博主允許不得轉載。 
博主地址是:http://blog.csdn.net/freewebsys

nodejs 類庫,能做的事情還是很多的。功能非常強大。 
之前認為這個只是一個前端同學學習的工具。 
但後來認為,這個是一個新的框架體系。可以做的事情很多。 
全棧工程師必須要學習的技術。使用好了,可以提高效率。 
其實大多數的開發就是做應用開發的。 
快速的將產品交付給用戶使用就好了,然後回家睡覺。 
真的不用糾結用啥技術。你應該不在乎,用戶也不在乎。

延伸阅读

    评论