博客 (115)

spacedesk 是一款非常强大的虚拟投影软件，可以将其它电脑、苹果设备（iPhone、iPad）、安卓手机甚至 HTML5 浏览器作为第二屏幕。本文以一台笔记本的屏幕作为另一台笔记本的扩展记录安装配置过程。

主笔记本安装 spacedesk DRIVER

扩展笔记本安装 spacedesk VIEWER

从官方网站下载软件

为了保证屏幕最佳的显示效果，我们希望两台笔记本最终的显示分辨率与物理分辨率一致。

我的主笔记本分辨率 1920x1080，扩展笔记本分辨率 1366x768

主笔记本

首先在扩展笔记本中打开 spacedesk VIEWER，连接主笔记本。

在主笔记本，桌面右键“显示设置”，分别针对 1 和 2 显示器设置分辨率： 

当然还可以在上上图中的“重新排列显示器”中拖动来实现屏幕内容的显示位置。

扩展笔记本

打开 spacedesk VIEWER，在菜单的 Settings 中选择 Resolutions 可设置显示分辨率：

选择 Compression Quality 可设置显示质量： 

压缩（Compression）如果选择 Off，那得看你的电脑能否吃得消，否则显示效果会更卡。我的配置是压缩选择 On，颜色深度选择低，快速，质量 100，帧率选择 60 FPS：

这样比默认设置的显示效果要好很多。

如果有条件用有线连接的话，尽量不要用无线连接，能减少不少延时。

一般地，我们会设置网站中的图片文件仅允许本网站页面调用，或者开放地址栏直接打开，但不允许其它网站调用。

这就需要在 Web 服务器上判断图片的来源（Referer）。

但是，当网站页面是 https，而图片地址是 http 时，考虑到安全性，浏览器将不带 Referer，这时如果图片允许在地址栏直接打开（即 Referer 为空），就起不到防盗链的作用了。

所以图片服务器在处理防盗链时，尽量不要允许 Referer 为空时调用。这时如果要单独允许另一个网站来调用图片，应该使用一致的 protocol。

当我们用 ASP.NET Web API 作服务端接口时，如果客户端以 GET 方式请求的 URL 中，由于拼接错误导致“？”和“&”并列出现，会发生 400 Bad Request，那么需要在 IIS 中使用 URL 重写模块来纠正。

请求 URL 如：

http://www.abc.com/api/obj?&foo=bar

需要重写为：

http://www.abc.com/api/obj?foo=bar

打开 IIS 管理器中对应网站的 URL 重写，

添加空白规则。

匹配的 URL 不包含域名，如上述 URL 则匹配的范围是：

api/obj

不包含我们要查找的字符串 ?&，所以此处模式只能匹配所有：

.*

又因为重定向路径中需要包含这部分，所以用括号包裹，即：

(.*)

继续添加条件匹配：

条件输入：{QUERY_STRING}，表示匹配查询字符串，

匹配的部分是“?”后面的字符串：

&foo=bar

那么可以填写模式：

^\&.*

因为 & 后面的部分仍然需要使用，所以用括号包裹：

^\&(.*)

“操作”中选择类型“重定向”，URL 填写：

{R:1}?{C:1}

其中 {R:1} 指代 api/obj，{C:1} 指代 foo=bar

取消“附加查询字符串”前面的勾

重定向类型在测试时可以选择 302 或 307，没问题后选择 301。

完成。

最终我们可以在网站的配置文件 web.config 中看到：

<rewrite>
    <rules>
        <rule name="uni-app-h5-replace-q" stopProcessing="true">
            <match url="(.*)" />
            <conditions>
                <add input="{QUERY_STRING}" pattern="^\&amp;(.*)" />
            </conditions>
            <action type="Redirect" url="{R:1}?{C:1}" appendQueryString="false" redirectType="Temporary" />
        </rule>
    </rules>
</rewrite>

我们要把这段代码复制到开发环境源代码的 web.config 中，以免发布网站时将我们设置好的配置覆盖掉。

在学习和使用 ASP.NET Web API 之前，最好先对 RESTful 有所了解。它是一种软件架构风格、设计风格，而不是标准。

推荐视频教程：https://www.imooc.com/learn/811

讲师：会飞的鱼Xia

需时：2小时25分

REST API 测试工具：

在 Chrome 网上应用店中搜索：Restlet Client

或网站 https://client.restlet.com

>>> 资源路径

SCHEME :// HOST [ ":" PORT ] [ PATH [ "?" QUERY ]]

其中 PATH 中的资源名称应该使用复数名词，举例：

GET https://xoyozo.net/api/Articles/{id}

POST https://xoyozo.net/api/Articles

>>> HTTP verb（对应 CURD 操作）：

>>> 过滤信息：

如分页、搜索等

>>> 常用状态码：

>> 错误处理：

C# 例：throw new HttpResponseException(HttpStatusCode.NotFound);

PHP 例：throw new Exception('文章不存在', 404);

>>> 返回结果：

JSON/XML

不要返回密码等机密字段

>>> 其它：

身份验证窗口（浏览器弹窗，类似 alert，非页面表单），明文传输，安全性不高，不建议使用。实现：

在 Headers 中添加 Authorization:Basic “用户名:密码”的 Base64 编码

新项目上线，在 Windows XP 中使用 IE 访问网站，http 正常， https 提示“无法显示网页”，这是因为当前电脑不支持网站提供的 SSL 协议。遂简单整理了各 IE 版本在不同操作系统下 SSL/TLS 的支持情况，表格仅供参考，可能会因特殊情况而有所不同：

几个注意点：

• 宝塔面板（5.9.0）不支持 SSL 3.0 和 TLS 1.0，官方说已经恢复了 TLS 1.0 的支持，但我在 ssl_protocols 中添加 TLSv1 仍然不生效。后参考此文配置成功（同时更改 ssl_protocols 和 ssl_ciphers 项）

• 详细的支持请前往 MySSL.com 检测，“客户端握手模拟”小节中查看各操作系统和浏览器版本的测试结果

请求被中止: 未能创建 SSL/TLS 安全通道。

The request was aborted: Could not create SSL/TLS secure channel.

或

基础连接已经关闭: 发送时发生错误。

出现这个异常原因是请求的 SSL/TLS 版本与对方支持的不一致。

加上这段代码可解决：

ServicePointManager.SecurityProtocol = SecurityProtocolType.Tls12;

Tls12 表示请求的安全协议是 TLS 1.2，您可以断点查看原来的 ServicePointManager.SecurityProtocol 值，只要设置为对方网站支持的版本即可。

使用下面这个工具可以查看对方网站提供的 SSL/TLS 版本：

https://myssl.com/

〓 系统

〓 文件

〓 tar

〓 磁盘

〓 网络

〓 防火墙

〓 用户/权限

〓 vi 编辑器

〓 计划任务

〓 网站

〓 goaccess

〓 lnmp

〓 nginx

〓 vsftpd

〓 MySQL

〓 scp 远程文件/目录传输命令 (yum install openssh-clients) 用法

scp 会把文件权限（读取/写入/执行）带过来，但所有者为当前执行 scp 命令的用户。

scp 低版本有许多漏洞，用完最好 yum remove openssh-clients

scp 采用直接覆盖的机制，如需判断文件无差异则跳过，应改用 rsync 命令。查看 rsync 详细使用方式及与 scp 对比

〓 rsync 远程文件/目录传输命令 (yum install rsync) 用法查看 rsync 详细使用方式及与 scp 对比

rsync 会把文件权限（读取/写入/执行）带过来，所有者也会带过来。

相比于 scp 最大的优势就是可以增量同步

〓 ftp 客户端 (yum install ftp)

〓 iftop

流量监控工具 教程 

〓 GoAccess

实时网站日志分析工具 官网 

〓 Cacti

网络流量监测图形分析工具 官网  百科 

常见问题笔记

加硬盘

• 插入新硬盘

• 若有 RAID，则先设置，使操作系统能认到硬盘

• 使用 fdisk 命令对新设备进行分区

• 使用 mkfs 命令对新分区进行格式化

• 使用 mount 命令进行挂载

• 设置开机自动挂载（vi /etc/fstab）

更改 MySQL 数据库目录位置

• 停止 MySQL 服务

• 将原数据目录转移或复制到新位置（若是复制，则修改所有者使原来一致）

• 找到 my.cnf 配置文件（一般在 /etc/），修改 datadir 值为新路径

• 启动 MySQL 服务

502 Bad Gateway 问题排查

• 查看 PHP 日志，路径：/usr/local/php/var/log

• 一般为“server reached pm.max_children setting (10), consider raising it”连接数问题，在“/usr/local/php/etc”下的所有配置文件中查找并修改相关设置即可（如改成 1000）。

计划任务（实例：定时备份数据库并通过 FTP 同步至其它服务器）

• 创建可执行文件：vi dotask.sh

• dotask.sh 的内容示例：
  

  DATE_TIME=`date +%Y_%m_%d_%H%M%S`;
  FILE_NAME=数据库名_backup_$DATE_TIME.sql;
  cd /home/mysqlbackup/;
  mysqldump -u数据库用户名 -p数据库密码 数据库名>$FILE_NAME;
  tar -zcf $FILE_NAME.tar.gz $FILE_NAME;
  rm $FILE_NAME;
  
  ftp -v -n FTP地址 << END
  user FTP用户名 FTP密码
  bin
  put 本地目录文件 目标路径文件
  bye
  END
  

  
  文件名乱码问题可以在行末加“;”来解决

• 赋予执行权限：chmod 777 dotask.sh （ls 命令时呈绿色）

• 编辑计划任务：crontab -e

• crontab 书写规则：
  

  # 分 时 日 月 周 文件路径
  0 3 * * * /home/dotask.sh
  30 4 * * * /home/dotask2.sh
  

  
  更多帮助 

• 重启 crond：/etc/init.d/crond restart

netstat

• netstat -an | grep xxx.xxx.xxx.xxx 可查看此 IP 的 TCP 请求及端口

代码一：

#if DEBUG
    // Debug 模式
#else
    // Release 模式
#endif

作用：判断 调试模式 / 发布模式

条件：须在项目属性的生成页中勾选“定义 DEBUG 常量”

适用：记录 EF 生成的 SQL 语句、控制定时器只在生产环境执行等

注意：调试和发布时应选择正确的模式

代码二：

if(Request.IsLocal) { }

作用：判断 本地 / 远程

条件：在会话中

适用：显示错误详情、记录 EF 生成的 SQL 语句

注意：不能用于定时器、Application_Start、异步操作等非会话中

代码三：

if (System.Net.IPAddress.IsLoopback(HttpContext.Connection.RemoteIpAddress)) { }

说明：ASP.NET Core 中的写法，用于检测 IP 地址是否为本地回环地址（IPv4 为 127.0.0.1，IPv6 为 ::1）

若在视图中使用，HttpContext 改为 ViewContext.HttpContext 或 Context

作用/条件/适用/注意：参“代码二”

代码四：

if(HttpRuntime.AppDomainAppPath == "X:\xxx\") { }

作用：判断当前网站根目录路径

条件：开发环境和生产环境的根目录路径不同

适用：判断根目录路径作相应的处理，适用于以上各种情况

注意：路径有变须要修改相应程序代码

最近，空心图标和实心图标的讨论变得激烈起来，有言论指出空心图标在视觉上比实心图标看起来更复杂，更容易让用户差生疲劳感和倦怠感。对此，设计师们都各抒己见，一部分人表示赞同这种说法，而另一部分人则表示这样的言论将问题过分了放大化了，并且在证据方面有所欠缺。

图标也可以理解为是网站中的一种指引，是每个新用户都会涉及到的元素，所以无论空心或实心，一个能够令人一目了然，并且记忆深刻的图标才是用户真正喜欢的图标。

以下是小编搜寻的一些空心或实心的图标案例，看看你更倾心于哪一款呢？

1.模糊背景上覆盖着由简单线条、字体和单一的颜色组成的空心图标，这会让整个界面看起来很优雅。不仅如此，这种简易的设计手法也让设计师轻松不少，在效果和操作上都令大家很满意。

2.纯色的背景似乎搭配任何元素都能达到令人意想不到的效果，下面这个案例也不例外。正红色与白色之间的经典配搭，加以可爱的造型，成就了一个俏皮的实心图标设计。界面底部的实心按钮与幽灵按钮也与图标区域前后呼应。

3.APP底部的图标随着用户的任意切换，在空心和实心之间自由转变。实心的图标相比较空心的而言，给人一种更突出和明显的视觉效果，让用户更容易的抓到重点。而主内容左边的卡通小图案同时采用了空心的设置，尽显极简主义。

4.Line的界面似乎代表了大多数APP的图标设计方式。头部和底部的图标选用两种颜色的实心设计，下拉菜单部分使用空心图标。这样的设计虽然比较大众化，但不可否认的是，这样的做法的确让整个界面看起来格外整洁。

5.幽灵按钮虽然简洁大方，但是过多的使用会另界面很单调无味，但如果使用全部实心的图标设计又会觉得很突兀。下面这个案例就想出了一个好方法。既然空心实心都不合适，那不如尝试一下让两者结合在一起吧。

6.两种色差明显的颜色搭配在一起会体现出一种自然而然的时尚感，黑色背景和亮黄色的图标元素就是很典型的例子。强烈的对比色会让空心图标看起来也像实心图标一样，具有突出重点的效果。

7.Metro风格的界面设计也能运用在APP的图标模块中，案例中将各种第三方分享平台的实心图标都用方块元素连接在一起，让原本单调的图标瞬间活跃了起来，给用户一种焕然一新的感觉。

8.传统的导航图标大多会集中在一个区域内，而SevenEleven的APP在此做了很大的突破，将4个部分分别分布在界面的上下左右，简单的界面突然有了运动场的氛围，让APP充满了生命力。

9.天气类应用的看点中总会有气候图标的一席之地，正如这个案例中所表现的，这又是一个空心与实心相结合的图标设计。

10.这也是一个纯色块与实心图标搭配的案例，这个APP的界面设计其实很普通，但正因为图标的设计让网站变得可爱起来。

图标在网页设计中算是一个小单元，但它的重要性大家都有目共睹。空心图标和实心图标在不同的环境中发挥着不同的作用，美化着网页中的小细节。

UEditor 的 ASP 版本在虚拟空间上传文件失败，提示“上传错误”或“上传失败，请重试”等，是因为其文件上传组件在创建目录时，没有网站目录外的访问权限。

例如上传文件的磁盘保存路径为：

D:\web\sitename\wwwroot\upload\20180523\123.jpg

百度编辑器的上传组件会依次判断以下目录是否存在，不存在则创建：

D:\

D:\web\

D:\web\sitename\

D:\web\sitename\wwwroot\

D:\web\sitename\wwwroot\upload\

D:\web\sitename\wwwroot\upload\20180523\

虚拟空间自动配置的网站根目录可能是：

D:\web\sitename\wwwroot\

所以，判断存在或创建以下目录没有问题：

D:\web\sitename\wwwroot\upload\

D:\web\sitename\wwwroot\upload\20180523\

但判断存在以下目录时会因为权限不足而失败：

D:\

D:\web\

D:\web\sitename\

解决方法是找到文件 asp/Uploader.Class.asp

找到 CheckOrCreatePath 这个 Function，替换为：

Private Function CheckOrCreatePath( ByVal path )    
   Set fs = Server.CreateObject("Scripting.FileSystemObject")    
   Dim parts    
   Dim root : root = Server.mappath("/") & "\"    
   parts = Split( Replace(path, root, ""), "\" )    
   path = root    
   For Each part in parts    
       path = path + part + "\"    
       If fs.FolderExists( path ) = False Then    
           fs.CreateFolder( path )    
       End If    
   Next    
End Function

另外，如果服务端无法通过 Request.Form 来接收该值，把 <form /> 放到 <table /> 外面试试。

或者绑定 contentChange 事件来赋值（不推荐）：

ue.addListener("contentChange", function() {
    document.getElementsByName('xxxxxx')[0].value = ue.getContent();
});

此方法的缺点是，不是所有操作都能触发 contentChange 事件，比如剪切、上传图片等。

改进方法（推荐）：在 form 提交之前赋值。