2018-6-21-跨平台Electron在Mac上的使用方法

开发环境

此开发环境文档2018-6-20复制于
https://github.com/electron/i18n/blob/master/content/zh-CN/docs/tutorial/development-environment.md#setting-up-macos

你可以使用原生的Node.js开发环境来开发Electron应用。 为了打造一个Electron桌面程序的开发环境,你只需要安装好的Node.js、npm、一个顺手的代码编辑器以及对你的操作系统命令行客户端的基本了解。

配置 macOS

Electron 支持 Mac OS X 10.9及其以上版本和macOS所有版本。 目前Apple不允许在非Apple电脑上运行macOS虚拟机,所以,如果你需要一台Mac的话,可以考虑租用Mac云服务(比如MacInCloud或者 xcloud)。

首先,安装最新版本的Node.js 。 我们推荐您安装最新的 长期支持版本 或者 当前发行版本 。 访问Node.js下载页面选择 macOS Installer 。 当然,你也可以使用Homebrew安装Node.js,但我们不推荐你这么做,因为许多工具并不兼容Homebrew安装Node.js的方式。

下载完成后, 执行安装程序,根据引导完成安装即可。

安装完成后,我们需要来确认Node.js是不是可以正常工作。 Find the macOS Terminal application in your /Applications/Utilities folder (or by searching for the word Terminal in Spotlight). 打开Terminal或其他你喜欢的命令行客户端后,通过以下命令来确认 nodenpm已经安装成功:

1
2
3
4
5
# 下面这行的命令会打印出Node.js的版本信息
node -v

# 下面这行的命令会打印出npm的版本信息
npm -v

如果上述命令均打印出一个版本号,就说明Node.js已经安装好了! 然后,你只需要安装一个适合JavaScript开发的代码编辑器就可以开始开发工作了。

配置 Windows

Electron 支持Windows 7 及以上版本-–任何在低版本Windows上开发Electron的尝试都将是徒劳无功的。 您可以使用微软向开发者免费提供的Windows 10虚拟机镜像

首先,安装最新版本的Node.js 。 我们推荐您安装最新的 长期支持版本 或者 当前发行版本 。 访问Node.js下载页面,选择Windows Installer。 下载完成后, 执行安装程序,根据引导完成安装即可。

在安装过程中的配置界面, 请勾选Node.js runtimenpm package managerAdd to PATH这三个选项。

安装完成后,我们需要来确认Node.js是不是可以正常工作。 Find the Windows PowerShell by opening the Start Menu and typing PowerShell. 打开PowerShell或其他你喜欢的命令行客户端后,通过以下命令来确认 nodenpm已经安装成功:

1
2
3
4
5
# 下面这行的命令会打印出Node.js的版本信息
node -v

# 下面这行的命令会打印出npm的版本信息
npm -v

如果上述命令均打印出一个版本号,就说明Node.js已经安装好了! 然后,你只需要安装一个适合JavaScript开发的代码编辑器就可以开始开发工作了。

配置 Linux

一般来说,Electron支持Ubuntu 12.04、Fedora 21、Debian 8 及其以上版本。

首先,安装最新版本的Node.js 。 对于不同linux分支,安装步骤会有所差异。 假如你使用系统自带的包管理器,比如: apt 或者 pacman,请使用Node.js 官方Linux安装指引

作为一个Linux用户,关于命令行的使用就无需我赘述了。 打开你喜欢的命令行工具,通过以下命令来确认nodenpm 在全局可用:

1
2
3
4
5
# 下面这行的命令会打印出Node.js的版本信息
node -v

# 下面这行的命令会打印出npm的版本信息
npm -v

Howto

此段来自于 https://github.com/foolsparadise/ElectronDemo
do:

(创建一个空目录,然后在此目录下执行)npm init  
(会有一些提示,跟着做)  

then modify package.json file as like this:

{
  "name": "electrondemo",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "electron .",
    "packager": "electron-packager . electrondemo --arm64 --out ./Release --arch=x64 ---app-version=1.0.0 --electron-version=2.0.2"  
  },
  "author": "",
  "license": "MIT"
}

add new file main.js, index.html
do:

npm install  
npm install --save-dev electron (我不知道npm install electron是不是和这条命令同样功能,另,执行可能会自动生成package-lock.json文件和node_modules目录?)  
npm install -g electron-packager (安装打包的,package.json文件会添加一项devDependencies)  

add electron-packager scripts in package.json file like this

{  
  "name": "electrondemo",  
  "version": "1.0.0",  
  "description": "",  
  "main": "main.js",  
  "scripts": {  
    "test": "echo \"Error: no test specified\" && exit 1",  
    "start": "electron .",  
    "packager": "electron-packager . electrondemo --arm64 --out ./Release --arch=x64 ---app-version=1.0.0 --electron-version=2.0.2",  
    "packageDarwin": "electron-packager . 'electrondemo' --platform=darwin --arch=x64 --icon=electrondemo.icns --out=./Release --asar --app-version=1.0.0 --ignore=\"(dist|Release|src|docs|.gitignore|LICENSE|README.md|webpack.config*|node_modules)\"",  
    "packageDarwin": "electron-packager . 'electrondemo' --platform=darwin --arch=x64 --icon=electrondemo.icns --out=./Release --asar --app-version=1.0.0",  
    "packageWin": "electron-packager . 'electrondemo' --platform=win32 --arch=x64 --icon=electrondemo.ico --out=./Release --asar --app-version=1.0.0 --ignore=\"(dist|Release|src|docs|.gitignore|LICENSE|README.md|webpack.config.js|node_modules)\"",  
    "packageWin": "electron-packager . 'electrondemo' --platform=win32 --arch=x64 --icon=electrondemo.ico --out=./Release --asar --app-version=1.0.0",  
    "packageLinux": "electron-packager . 'electrondemo' --platform=linux --arch=x64 --out=./Release --asar --app-version=1.0.0 --ignore=\"(dist|Release|src|docs|.gitignore|LICENSE|README.md|webpack.config.js|node_modules)\"",  
    "packageLinux": "electron-packager . 'electrondemo' --platform=linux --arch=x64 --out=./Release --asar --app-version=1.0.0"  
  },  
  "author": "",  
  "license": "MIT",  
  "devDependencies": {  
    "electron": "^2.0.2"  
  }  
}  

Run

npm start  

Release

(Mac system)npm run-script packager  
(Mac system)npm run-script packageDarwin  
(Windows system,如果是Mac系统编译则需要先安装wine)npm run-script packageWin  
(Linux system)npm run-script packageLinux  

2018-6-20-Fiddler在Mac上抓包的使用方法

Fiddler不但能截获各种浏览器发出的HTTP请求, 也可以截获各种智能手机发出的HTTP/HTTPS请求。Fiddler能捕获IOS设备发出的请求,比如IPhone, IPad, MacBook. 等等苹果的设备。 同理,也可以截获Andriod,Windows Phone的等设备发出的HTTP/HTTPS。

最关键的是,对IOS应用抓包时直接在Windows PC上进行,不需要非得在MAC上。下面介绍使用步骤

一、Mac安装Fiddler

一、Mono安装
安装程序可以从http://www.mono-project.com/download/#download-mac
二、从Mozilla LXR上下载所有受信任的root证书,存于Mono的证书库里
/Library/Frameworks/Mono.framework/Versions/Current/bin/mozroots –import –sync
三、配置环境变量
如果报错 -bash: mono: command not found ,则输入以下命令解决
export PATH=/Library/Frameworks/Mono.framework/Versions/Current/bin/:${PATH}
四、使用Mono打开Fiddler.exe
打开terminal :
cd /Users/zxmoon/Downloads/fiddler-mac
mono Fiddler.exe 注意是否32位,然后加参数–arch=32
(另一个其它的文档
Mono安装
首先,Mac下需要使用.Net编译后的程序,需要用到跨平台的方案Mono(现阶段微软已推出跨平台的方案.Net Core,不过暂时只支持控制台程序)。安装程序可以从http://www.mono-project.com/download/#download-mac地址下载。
安装完后,在Terminal里执行以下命令:
/Library/Frameworks/Mono.framework/Versions//bin/mozroots –import –sync
此步是为了从Mozilla LXR上下载所有受信任的root证书,存于Mono的证书库里。root证书能用于请求https地址。
接下来如果想要运行Fiddler,还需要把Mono加入到环境变量中。编辑.bash_profile文件:
sudo vi ~/.bash_profile
加入文本:
export MONO_HOME=/Library/Frameworks/Mono.framework/Versions/5.0.1
export PATH=$PATH:$MONO_HOME/bin
保存后重新打开Terminal,Mono环境已装好。
Fiddler的安装
从Fiddler官网https://www.telerik.com/download/fiddler下载fiddler-mac.zip的压缩包。解压到非中文字符的路径下。
Fiddler运行
打开Terminal,进入到刚才解压的Fiddler路径,执行命令运行:
sudo mono Fiddler.exe
)
(或以下方法做一个类外参考:
从Fiddler官网https://www.telerik.com/download/fiddler下载fiddler-mac.zip的压缩包。
unzip fiddler-mac.zip -d /usr/local/lib/fiddler-mac
sudo sh -c ‘echo “nohup sudo mono –arch=32 /usr/local/lib/fiddler-mac/Fiddler.exe > /dev/null 2>&1 &” > /usr/local/bin/fiddler’
sudo chmod +x /usr/local/bin/fiddler

二、Fiddler配置 (配置完后记得要重启Fiddler)

打开Fiddler, Tools-> Fiddler Options 。

选中”Decrpt HTTPS traffic”, Fiddler就可以截获HTTPS请求

选中”Allow remote computers to connect”. 是允许别的机器把HTTP/HTTPS请求发送到Fiddler上来

点击Actions,点击第二项:Export Root Certificate to Desktop,这时候桌面上会出现证书FiddlerRoot.cer文件,点击OK设置成功,
导证书到电脑上,并重启fiddler

三、手机配置

(1) 网络代理设置

安装Fiddler的机器,跟iPhone 必须在同一个网络里, 否则iPhone不能把HTTP发送到Fiddler的机器上来。一般情况,我们手头上是台式机和手机,台式机只有网线,没有无线wifi,所以和手机不在同一个网络,这时,我们就需要设置代理了

打开iPhone, 找到你的网络连接, 打开HTTP代理, 输入Fiddler所在机器的IP地址(比如:192.168.1.104) 以及Fiddler的端口号8888

(2) Fiddler证书安装

这一步是为了让Fiddler能捕获HTTPS请求。 如果你只需要截获HTTP请求, 可以忽略这一步

  1. 首先要知道Fiddler所在的机器的IP地址: 假如我安装了Fiddler的机器的IP地址是:192.168.1.104

  2. 打开IPhone 的Safari, 访问 http://192.168.1.104:8888, 点”FiddlerRoot certificate” 然后安装证书

现在大功告成,可以抓包了。iPhone上的应用(比如Safari, Firefox, Itunes, App Store)发出的HTTP/HTTPS都可以被Fiddler获取。

实例: 打开Safari,  

  1. 输入http://www.cnblogs.com/tankxiao. 看看Fiddler能否捕获。

  2. 输入https://dynamic.12306.cn/otsweb/ 看看Fiddler能否捕获。

是不是HTTP和HTTPS都截获到了?, 你不但能截获, 还可以下断点,修改Request, 修改Response, Do what you want.

四、注意事项

(1) 用完了, 记得把IPhone上的Fiddler代理关闭, 以免IPhone上不了网。

(2) 只能捕获HTTP,而不能捕获HTTPS的解决办法
有时候会发现, Fiddler 只能捕获IPhone发出得HTTP请求, 而不能捕获HTTPS请求, 原因可能是证书没有安装好。 解决办法是:

  1. 先把IPhone上所有的Fiddler证书删除 (拿出IPhone, 点”设置“->“通用”->”描述文件”)

  2. 安装上面的方法,重新安装Fiddler证书

2011-06-01-Demo

1
2
3
4
5
6
7
8
9
10
11
---
title: 2011-06-01-Demo
date: 2011-06-01 11:16:44
updated: 2011-06-01 11:16:44
tags:
- 2011
- domain
- 域名
categories:
- 2011
---

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
$ hexo new "My New Post"

More info: Writing

Run server

1
$ hexo server

More info: Server

Generate static files

1
$ hexo generate

More info: Generating

Deploy to remote sites

1
$ hexo deploy

More info: Deployment