whoru

Gitalk 一个基于 Github issues 和 Preact 开发的评论插件，在 Hexo NexT 主题中可以很方便的开启，并且简洁、轻量。

刚开始使用的时候挺稳的，但是近期出现登录不上的问题。通过查看浏览器的「网络面板」，发现 cors-anywhere.herokuapp.com 这个地址报错 403。这是一个实现跨域请求转发的服务，而 Gitalk 正是依赖它与 Github 进行通信。为什么会 403 呢，最后找到官方说明，大体意思就是：这个地址只是用来演示的，但是发现流量越来越大，所以要进行限流。

解决这个问题最好的办法是：自建。

今天查看 NexT 官网，发现有人已经提供了解决方案参见这里。

本文主要就是介绍如何自建这个跨域代理，实测可用的完整过程如下下文：

场景：一个外网访问地址，不希望对全部人可见，希望只有正确输入用户名、密码的人才能访问时，可以通过修改 Nginx 配置实现。

1. 检查 htpasswd 是否可用

我们会用到一个工具 htpasswd，主要用于对访问密码加密（注：千万不要直接存明文密码！！！），可使用以下命令检查是否已经安装：

1
2

sq@host01:~$ which htpasswd
/usr/bin/htpasswd

如果没有这个工具，需要先安装：

1
2
3
4
5

# Ubuntu
$ sudo apt-get install -y apache2-utils

# CentOS
$ yum -y install httpd-tools

最近买了个雷蛇的鼠标，Windows 7 系统下通过雷云安装驱动的时候，弹窗提示「Windows要求已数字签名的驱动程序」，错误窗口详细信息的大意是一个驱动文件无法通过系统的数字签名，无法安装，导致设备可能无法正常使用。

这其实是系统的一个安全警告，可通过以下命令关闭系统的数字签名认证：

1

bcdedit.exe -set loadoptions DDISABLE_INTEGRITY_CHECKS

重启系统，然后重新安装出错的程序就可以了。

注意：如果还是不行的话，则安装以下官方补丁程序：

Windows 7 32bit：https://www.microsoft.com/zh-CN/download/details.aspx?id=46078

Windows 7 64bit：https://www.microsoft.com/zh-CN/download/details.aspx?id=46148

Webpack 是一个现代 JavaScript 应用程序的静态模块打包工具。主要针对js、css、html、图片、字体文件，进行压缩、优化、合并等操作，以实现前端项目的工程化。

1. Hello Webpack

1.1. 安装

1
2
3
4
5
6
7
8
9
10
11

# 1. 初始化项目
➜  npm init -y

# 2. 安装 webpack
# --save-dev 可以用 -D 代替
➜  npm i webpack webpack-cli --save-dev

# 3. 在 package.json 中添加编译命令
  "scripts": {
    "build": "webpack"
  },

1.2. 添加源码文件

初始状态下（未进行任何配置），webpack 会查找项目到 /src/index.js 文件作为打包入口，并且输出到 /dist 目录下，所以需要先添加源码文件，才能执行打包操作。

1
2

// /src/index.js
console.log(`hello webpack`);

1.3. 执行打包

1
2
3
4
5
6
7
8
9

➜  npm run build

> webpack-demo1@1.0.0 build /Users/sunqiang/www/learning/webpack/webpack-demo1
> webpack

[webpack-cli] Compilation finished
asset main.js 29 bytes [emitted] [minimized] (name: main)
./src/index.js 29 bytes [built] [code generated]
webpack 5.3.2 compiled successfully in 315 ms