最近要做个简单的类似 CNZZ 和百度统计的统计器，不可避免地遇到 JS 文件异步加载 和 给 JS 文件传参 的问题。

参考了 CNZZ 的代码以后，在 Chrome 的控制台发现以下警告：

A Parser-blocking, cross-origin script, http://s4.cnzz.com/stat.php?***, is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity. See https://www.chromestatus.com/feature/5718547946799104 for more details.

Paul Kinlan 给出了解释，是因为使用了 document.write() 的方式输出了 <script src="***" /> HTML DOM，建议改成 document.appendChild() 或 parentNode.insertBefore()，最好的例子就是 Google Analytics。

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

上述 JavaScript 跟踪代码段可以确保该脚本在所有浏览器中加载和异步执行。

加了一些注释，便于理解，官方英文版。

(function (i, s, o, g, r, a, m) {
  i['GoogleAnalyticsObject'] = r;

  // console.log(window['GoogleAnalyticsObject']) // 'ga'
  // console.log(i[r]) // undefined

  i[r] = i[r] || function () { // i[r] 就是 window['ga']，定义了一个函数
    (i[r].q = i[r].q || []).push(arguments) // 往 ga.q 这个数组中增加一项
  },

  i[r].l = 1 * new Date(); // 时间戳，写法等同于 new Date().getTime()

  // console.log(i[r]) // window['ga'] 就是上面那个 function

  a = s.createElement(o), // 创建一个 script 元素
  m = s.getElementsByTagName(o)[0]; // 文档中的第一个脚本（文档中肯定至少已有一个脚本了）

  a.async = 1; // 异步加载
  a.defer = 1; // 兼容旧浏览器（我自己加的）
  a.src = g;

  m.parentNode.insertBefore(a, m) // 将 a 脚本插入到 m 脚本之前

})(window, document, 'script', 'http://***/***.js', 'ga');
//   i        s         o                  g          r

ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');

过程是：

创建了一个 <script> 元素，并异步加载 http://***/***.js；初始化了一个全局函数 ga；在 ga() 命令队列中添加了两条命令。

现在我们可以在这个外部 js 中使用 ga.q 这个对象中的数据了，示例：

;(function () {
  console.log(ga.q);
})(window);

简单补充下，async 是 HTML5 属性，使支持异步加载 JS 文件；defer 只支持 IE，作用类似。

测试异步只需要将 js 文件换成服务端页面，并人为设置 sleep 时间即可，阻塞式调用的话会在加载 js 时暂停后续页面的渲染。

Dictionary<TKey, TValue> dic = q.ToDictionary(k => k.field1, v => v.field2);

在使用 VS 2015 修改 C# 5 项目时，如果使用了 C# 6 的新特性，会提示：

功能“空传播运算符”在 C# 5 中不可用。请使用语言版本 6 或更高版本。

升级到 C# 6 很简单，在 VS 菜单中依次点击：

项目 - 启用 C# 6 / VB 14(#)

选择需要升级的项目，确定即可。

收录了一些个人觉得不错的网页开发插件。

由于插件更新频繁，本页如有错误请指正，也欢迎告知更多功能强大、使用方便的插件。

若在谷歌浏览器中记住密码，再次打开时，表单中自动填充的文本框和下拉框都变成了黄色背景，影响界面美观，可以使用以下样式修正：

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid green;
  -webkit-text-fill-color: green;
  -webkit-box-shadow: 0 0 0px 1000px #000 inset;
  transition: background-color 5000s ease-in-out 0s;
}

具体样式请自行修改。

参考资料：https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/

程序设计规范：

• 【推荐】上传的文件直接保存到文件存储服务（如阿里云 OSS），这样即使被上传了后门 shell，对网站服务器也不会有影响。

• 否则必须通过文件头来确定文件类型，检查文件十六进制的文件头和文件尾是否合法，并检查文件流中是否包含 php、evel 等字符。

• 不可直接使用客户端文件名来保存文件，特别是后缀名/扩展名。应生成随机文件名，并通过检验文件头来确定文件类型。必须由程序指定保存目录。

• 使用 OSS 的应直接上传，不要在 ECS 上临时存放或备份。如必须存放的，应按上述规范操作。

服务器安全设置

CentOS + nginx + PHP：

• 全站文件取消属性中的“执行”权限（chmod），因为这个“执行”与运行 PHP 无关。而需要上传文件的“目录”需要“执行”权限，原因是需要往该目录创建文件。
  

• 仅需要写入的目录或文件设置“写入”权限。如上传图片目录、ThinkPHP 的 Runtime 目录。

• 凡可写目录或文件均不允许运行 PHP / PY 等 除需要被直接访问的 PHP / PY 文件，其它动态文件均不允许被访问到，在 nginx 的配置文件中添加项，参：https://xoyozo.net/Blog/Details/nginx-location-if，若全站使用统一的入口文件访问，那么设置仅该文件允许运行 PHP 即可。通过 IO 方式被其它文件包含的文件，无需运行 PHP 权限。（“deny all”对 include 起作用，但对 IO 不起作用，因此 Runtime 目录可以继续为 ThinkPHP 提供缓存服务。）这一步非常有用。

• 使用与 nginx 网站用户不同的用户来部署网站文件，如宝塔面板 PHP 使用 www 用户，那么就使用 root 或其它新用户来上传文件，否则将导致全站目录和文件可写。有条件的建议不同网站使用不同的用户，可防止一个网站被入侵后导致其它网站文件或磁盘上的其它文件被泄露的风险（2022年10月2日从宝塔官方社区获悉，宝塔面板暂不支持使用非 www 用户创建并运行网站）。

Windows Server + IIS + ASP.NET：

• 配置每个磁盘的安全属性，拒绝“IIS_IUSRS”这个用户组的所有权限。只要设置驱动器即可，子文件夹和文件会自动继承。若运行 .NET Framework 项目，需要设置 C:\Windows\Microsoft.NET\Framework\v*.*.*****\Temporary ASP.NET Files\ 目录可修改写入权限，.NET Core 项目不需要此设置。

• 为每个网站创建一个新用户，仅隶属于“IIS_IUSRS”。网站根目录安全属性添加该用户，权限选择“读取”。（已测取消“读取与执行”不影响 PHP，“列出文件夹内容”视业务需求开启，建议关闭）。仅需要上传文件的目录或文件设置“修改”、“写入”权限。（修改对应修改文件，写入对应上传文件）

• IIS 网站中设置“物理路径凭据”以及应用程序池的“标识”。

• IIS 中设置写入目录的“处理程序映射”无脚本。

了解使用 Visual Studio 创建的模板项目

启动 VS，从菜单项打开：文件 - 新建 - 项目，在已安装的模板中选择 .NET Core，选择 ASP.NET Core Web Application(.NET Core)，给项目取个名称，确定。选择 Web 应用程序，确定。

· global.json: 你可以在这里放置解决方案的配置信息和工程之间的引用。作用类似于 *.sln 文件。

· Program.cs: 这个文件包含了 ASP.NET Core 应用的 Main 方法，负责配置和启动应用程序。

· src 文件夹: 包含组成你应用程序的全部项目代码。

· wwwroot: 你的静态文件将被放置在这个文件夹，它们都将作为资源直接提供给客户端，包含 HTML，CSS 和 JavaScript 文件。可以在 project.json 内重置。

· project.json: 包含项目设置。在 ASP.NET Core 中，你可以通过使用 NuGet 程序包管理工具（NPM）添加 NuGet 包或者编辑这个文件来管理从属。

· project.lock.json: 由 project.json 生成。

· Startup.cs 这个主要放置你 ASP.NET Core 的 stratup 和 configuration 代码。ConfigureServices 方法定义了你应用程序使用的服务，Configure 方法用来定义组成请求管道的中间件。

一些备注：

ASP.NET Core 项目中不能创建 Web 窗体页面（.aspx）

发布后的网站根目录是项目中的 /wwwroot 目录

路由在 Startup 的 Configure 方法中配置

当用户向 <input> 或 <textarea> 输入时执行事件。

可用于统计输入字数，判断输入内容是否规范等。

但是通过 JS 来更改内容时不触发上述任何事件，不完美的解决方案是使用定时器。

IE8 及更早版本不支持 oninput，可以用 onpropertychange 代替。

BUG：在 IE9 的右键菜单剪切或删除中无效。

jQuery 例子：

$('#mytextarea').on('input propertychange', function () {
  console.log($(this).val().length);
});

<input name="aaa" id="theinput" type="checkbox" />

// 选中它

$('input[name="aaa"]').prop("checked", true);

// 取消它

$('input[name="aaa"]').prop("checked", false);

// 顺便提一下将 select 选中首项

$("#ddl_types option:first").prop('selected', true);

// 获取选中的项

$('input[name="aaa"]:checked').each(function(){ });

// 获取项是否选中

$('#theinput').is(':checked')

或

$('#theinput').prop('checked')

或

theinput.checked

// 获取 radio 选中项的值

$('input[name="aaa"]:checked').val()

本文适用且不限于 iTunes 12.5，在 Windows 上实现。

iPhone / iPad 的铃声文件是 .m4r 格式的，可以通过 iTunes 将 .mp3 /.wav 等其它格式的音乐文件转换成 .m4r 文件。

打开 iTunes

菜单栏选择：文件 - 将文件添加到资料库 - 从文件资源管理器中选择要作为铃声的音乐文件

如果要截取其中一段音乐作为铃声，则在资料库中右键该音乐 - 显示简介 - 选项，设置开始和停止时间，长度不能超过 40 秒

在资料库中将其选中，菜单栏选择：文件 - 转换 - 创建 AAC 版本

此时在资料库中会多出一个音乐来，右键单击，在 Windows 资源管理器中显示，我们可以看到以原音乐文件名命名的 .m4a 文件（如果看不到扩展名，则在菜单上点击 查看，选中“文件扩展名”即可）

将该文件扩展名改为 .m4r

铃声做好了，怎样导入到手机上呢？简单的答案是用 iTools，其实上面制作铃声的过程也可以用 iTools 一键实现，哈~哈哈~哈哈哈~