CC康纳百川 Hello Word 2020-10-06T10:00:00.000Z https://ccknbc.github.io/yun/ CC康纳百川 Hexo 如何在中国大陆享受JOOX音乐服务 https://ccknbc.github.io/yun/posts/how-to-enjoy-joox-music-service-in-mainland-china/ 2020-10-07T10:00:00.000Z 2020-10-06T10:00:00.000Z 本篇教程不需要科学上网工具，但会提及，并且JOOX APP之后是可以全球不受限制听歌哦

在开始之前你可能需要知道JOOX什么，看了标题你知道它能提供流媒体音乐服务，但你需要了解一下它的身世

JOOX是一个起源于香港的正版音乐流媒体服务，提供包括三大唱片公司在内，超过200万首高品质歌曲的收听与下载。该服务发布于2014年12月，支持Android和iOS平台，在香港等地区运营。但现在它已在七个国家或地区运营，并支持了web和win, mac客户端可上官网查看，但你显然能发现页脚写着Tencent，啊没错就是你想的腾讯，其实你可以理解为海外版QQ音乐，但腾讯音乐娱乐的投资还不止这些，但这不是本文重点，前面提到，由于版权原因，只在特定地区运营，也就是限制了IP，而要享受JOOX提供的服务，就得让你的IP被识别为它支持的地区IP，大家通常都是使用魔法上网工具，来访问，但我发现它对IP限制并没有那么严格，那么是否可以伪造IP呢

火狐浏览器

打开浏览器，插件商店搜索X-Forwarded-For Header

安装后打开你的搜索引擎，搜索你想使用地区IP，比如香港或者泰国，马来西亚等，填入IP即可，就像图中所示

X-Forwarded-For Header

然后打开JOOX官网，就会根据你的IP自动识别区域，不同地区曲库不同所以根据个人需要来哦，接下来注册账号，不过如果是不使用中文的地区，可以在侧栏点击lang切换语言为中文哦，以下以泰国作为示例

QQ图片20201007125937

点击右上角Sign Up注册账号，根据相应要求填写信息，注册即可

QQ截图20201007130110

QQ截图20201007130237

你可以使用邮箱注册，手机号绑定绑定大陆手机号也是可以的，当然作为腾讯家的东西，你可以绑定微信，是不是很方便呢，这些你以后可以在APP中操作，这里不再赘述，登陆后你就可以尽情享受JOOX提供的音乐服务了

QQ图片20201007130420

Chrome浏览器，QQ浏览器之类的呢

打开浏览器，插件商店搜索Header-Editor，至于怎么访问谷歌应用商店，不用我多说了吧

安装后按照下图所示填入即可，和火狐差不多

QQ截图20201007130958

但记得做好分类，以便于切换，即Description，要切换时记得Active选中即可，不使用时记得关闭插件或取消勾选以免影响国内一些网站的访问

总结

X-Forwarded-For 是一个 HTTP 扩展头部，主要是为了让 Web 服务器获取访问用户的真实 IP 地址（其实这个真实未必是真实的，后面会说到）。
那为什么 Web 服务器只有通过 X-Forwarded-For 头才能获取真实的 IP？
这里用 PHP 语言来说明，不明白原理的开发者为了获取客户 IP，会使用 $_SERVER[‘REMOTE_ADDR’] 变量，这个服务器变量表示和 Web 服务器握手的 IP 是什么（这个不能伪造）。
但是很多用户都通过代理来访问服务器的，那么假如使用该全局变量，PHP获取到的 IP 就是代理服务器的 IP（不是用户的）。
可能很多人看的晕乎乎的，那么看看一个请求可能经过的路径：客户端=>（正向代理=>透明代理=>服务器反向代理=>）Web服务器。其中正向代理、透明代理、服务器反向代理这三个环节并不一定存在。

什么是正向代理呢，很多企业会在自己的出口网关上设置代理（主要是为了加速和节省流量）。
透明代理可能是用户自己设置的代理（比如为了FQ，这样也绕开了公司的正向代理）。
服务器反向代理是部署在 Web 服务器前面的，主要原因是为了负载均衡和安全考虑。

现在假设几种情况：
假如客户端直接连接 Web 服务器（假设 Web 服务器有公网地址），则 $_SERVER[‘REMOTE_ADDR’] 获取到的是客户端的真实 IP 。
假设 Web 服务器前部署了反向代理（比如 Nginx），则 $_SERVER[‘REMOTE_ADDR’] 获取到的是反向代理设备的 IP（Nginx）。
假设客户端通过正向代理直接连接 Web 服务器（假设 Web 服务器有公网地址），则 $_SERVER[‘REMOTE_ADDR’] 获取到的正向代理设备的 IP 。
其实这里的知识点很多，记住一点就行了，$_SERVER[‘REMOTE_ADDR’] 获取到的 IP 是 Web 服务器 TCP 连接的 IP（这个不能伪造，一般 Web 服务器也不会修改这个头）。

这个方法也能用于一些国外其他网站，但对于要求比较严格的，大家只能老老实实使用代理咯，好了，今天就讲到这里，我们下篇文章见！

]]> <p><strong>本篇教程不需要科学上网工具，但会提及，并且<code>JOOX APP</code>之后是可以全球不受限制听歌哦</strong></p> <p>在开始之前你可能需要知道<code>JOOX</code>什么，看了标题你知道它能提供流媒体音乐服务，但你需要了 Github Actions为什么这么香 https://ccknbc.github.io/yun/posts/why-github-actions-is-so-fragrant/ 2020-10-06T02:51:58.000Z 2020-10-06T04:00:00.000Z Github Actions为什么这么香,我为什么专门建了一个组织ccknbc-actions来跑actions并储存博客源码，或者其他只是单纯来跑actions的项目，一开始就单纯只是想分类，forked一堆，主账号自己的项目却混在其中，最新的反而是天天运行actions的（排在前面）

而对大多数博主来说，都是把自己的源码（包含源文章）仓库私有起来，而一个普通账号每个月私有仓库运行时间为2000分钟，确实，是完全够用的，对于我们这种月更博主来说一个月100分钟而已（好吧我就是懒）；不过作为白嫖党我还是公开了仓库（这样就不限制运行时间了），但如果你选择了定时执行某些项目，注意间隔最小为5分钟，而触发方式也是多种多样的，但最让人欣喜的是手动触发方式终于完成了技术革命，不再监控star动作了，而是只有项目所有者可执行，这样就不会再运行记录里出现一堆无关记录影响查看（虽然之前判断仓库所有者也是OK，但是强迫症不接受两秒运行跳过无关记录）

而且由于分配的临时机性能还不错，速度还是很可观的，并且不受长城防火墙的限制，可以很方便的做一些其他事情，这里就不细说，回到标题，它为什么这么香呢？

可能在工作流文件书写上没其他第三方简单，用过Travis CI或者Gitlab CI的都应该有体会，但自家的经过这么久的发展，用起来还是比较舒服的，而且用户编写的actions可以直接拿来用发布到市场，这样有些功能的实现就不用再自己想半天去实现，几行代码就搞定，用HEXO写博客的都知道Gitee托管静态网页要更新的话就得手动点一下更新才行，而actions就可以帮我们去点一下以实现同步全自动更新，多平台部署

Github本身自带的模板是OK的，但毕竟很多新手完全不懂，但其实上手一段时间就明白了每一步在做什么为什么要这样写，官方文档的例子虽然很简单但确实是包含了常用的一些步骤，再加上很多人分享，直接拿来用就行，毕竟搜索引擎不能摆在那不用，爬几篇文章学习一下就会了，这里我以部署HEXO博客为例来说一下

首先我们得明白，要让Github能在你git push上去后能自动部署博客，你得知道博客的源文件是必须要的，但备份哪些呢，下图只是以本站做一个示例，框中的是必须要有的（如果你不打算修改主题源码其实也不用备份，但毕竟可以节约时间，第一次备份前记得在主题文件夹删掉.git隐藏文件夹，不然推上去是空的会导致运行失败），其他根据个人需求，，配一个证书或者README等，但你还在疑惑；我没有.github文件夹啊，没错这个就是我们自己新建的文件夹，在博客根目录依次建立.github/workflows/*.yml文件

备份源文件

就像下图这样，工作流文件.yml你可以随便命名啦，然后我们在工作流文件中添加如下内容

目录

name: Update Blog Butterfly Site

on: 
  push:
    branches: 
      - master
  workflow_dispatch:
    inputs:
      name:
        description: '手动触发'
        required: false

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
    - name: Checkout
      uses: actions/checkout@v2
      with:
        ref: master

    - name: Setup Node
      uses: actions/setup-node@v1
      with:
        node-version: "12.x"
        
    - name: Install HEXO CI
      run: |
        npm install hexo-cli -g

    - name: Catch
      uses: actions/cache@v2
      id: cache-dependencies
      with:
        path: node_modules
        key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}

    - name: Install Dependencies
      if: steps.cache-dependencies.outputs.cache-hit != 'true'
      run: |
        npm install

    - name: Generate
      run: |
        rm -rf ./public
        rm -rf ./db.json
        rm -rf ./.deploy_git
        hexo -v
        hexo clean
        hexo generate
        gulp
    
    - name: Deploy
      run: |
        cd ./public
        git init
        git config --global user.name "ccknbc"
        git config --global user.email '${{ secrets.GIT_EMAIL }}'
        git add -A
        git commit -m "Updated By Github Actions"
        git push --force --quiet "https://ccknbc:${{ secrets.GH_TOKEN }}@github.com/ccknbc/butterfly.git" master:master
        git push --force --quiet "https://ccknbc:${{ secrets.GT_TOKEN }}@gitee.com/ccknbc/butterfly.git" master:master
        git push --force --quiet "https://${{ secrets.CD_USER }}:${{ secrets.CD_TOKEN }}@e.coding.net/ccknbc/blog/butterfly.git" master:master

    - name: Build Gitee Pages
      uses: yanglbme/gitee-pages-action@master
      with:
          gitee-username: ccknbc
          gitee-password: ${{ secrets.GITEE_PASSWORD }}
          gitee-repo: ccknbc/butterfly

你可能有所疑惑但又看得懂一些命令，别急，请接着往下看

GitHub Actions 指南

GitHub Actions使你可以直接在你的GitHub库中创建自定义的工作流，工作流指的就是自动化的流程，比如构建、测试、打包、发布、部署等等，也就是说你可以直接进行 CI（持续集成）和 CD（持续部署）

基本概念

  1. workflow: 一个 workflow 工作流就是一个完整的过程，每个workflow 包含一组 jobs任务

  2. job : jobs任务包含一个或多个job ，每个 job包含一系列的 steps 步骤

  3. step : 每个 step 步骤可以执行指令或者使用一个 action 动作

  4. action : 每个 action 动作就是一个通用的基本单元

说明：

  1. 最外层的 name 指定了 workflow的名称

  2. on 声明了一旦发生了 push 操作就会触发这个 workflow

  3. jobs定义了任务集，其中可以有一个或多个job 任务，示例中只有一个

  4. runs-on 声明了运行的环境

  5. steps定义需要执行哪些步骤

  6. 每个 step可以定义自己的 name和id，通过 uses 可以声明使用一个具体的 action，通过run 声明需要执行哪些指令。

  7. ${{}}`可以使用上下文参数`on` 声明了何时触发 `workflow` ，它可以是：1. 一个或多个`GitHub` 事件，比如 `push` 了一个 `commit` 、创建了一个`issue` ，产生了一次`pull request` 等等，示例：

    on:[push,pull_request]
    2. 预定的时间，示例（每天零点零分触发，不过因为时差关系，是北京时间上午8点）：
    on:
      schedule:
        -cron:'0 0 * * *'
    3. 某个外部事件。所谓外部事件触发，简而言之就是你可以通过`REST API`向 `GitHub` 发送请求去触发，具体请查阅官方文档: `repository-dispatch-event`配置多个事件，示例：
    on:

    # Trigger the workflow on push or pull request,

    # but only for the master branch

    push:

    branches:

    - master

    pull_request:

    branches:

    - master

    # Also trigger on page_build, as well as release created events

    page_build:

    release:

    types: # This configuration does not affect the page_build event above

    - created
    详细文档请参考: 触发事件## jobs`jobs`可以包含一个或多个 `job` ，如:
    jobs:

    my_first_job:

    name: My first job

    my_second_job:

    name: My second job
    如果多个`job` 之间存在依赖关系，那么你可能需要使用 `needs` :
    jobs:

    job1:

    job2:

    needs: job1

    job3:

    needs: [job1, job2]
    这里的`needs`声明了`job2` 必须等待 `job1` 成功完成，`job3`必须等待 `job1` 和 `job2`依次成功完成每个任务默认超时时间最长为 `360`分钟，你可以通过 `timeout-minutes` 进行配置:
    jobs:
    job1:
    timeout-minutes:
    ## runs-on & strategy`runs-on` 指定了任务的 `runner` 即执行环境，`runner` 分两种：`GitHub-hosted runner` 和 `self-hosted runner` 所谓的 `self-hosted runner` 就是用你自己的机器，但是需要 `GitHub` 能进行访问并给与其所需的机器权限，这个不在本文描述范围内，有兴趣可参考 `self-hosted runner` `GitHub-hosted runner` 其实就是 `GitHub` 提供的虚拟环境，目前有以下四种:1. `windows-latest : Windows Server 2019`2. `ubuntu-latest`或 `ubuntu-18.04`3. `ubuntu-16.04` : `Ubuntu 16.04`4. `macos-latest` : `macOS Catalina 10.15`比较常见的:
    runs-on:ubuntu-latest
    ## runs-on 多环境有时候我们常常需要对多个操作系统、多个平台、多个编程语言版本进行测试，为此我们可以配置一个构建矩阵例如：
    runs-on: ${{ matrix.os }}

    strategy:

    matrix:

    os: [ubuntu-16.04, ubuntu-18.04]

    node: [6, 8, 10]
    示例中配置了两种`os`操作系统和三种 `node`版本即总共六种情况的构建矩阵， `${{matrix.os}}     是一个上下文参数

strategy 策略，包括：

  1. matrix: 构建矩阵

  2. fail-fast : 默认为true ，即一旦某个矩阵任务失败则立即取消所有还在进行中的任务

  3. max-paraller : 可同时执行的最大并发数，默认情况下 GitHub 会动态调整

示例：

runs-on: ${{ matrix.os }}

strategy:

matrix:

os: [macos-latest, windows-latest, ubuntu-18.04]

node: [4, 6, 8, 10]

include:

# includes a new variable of npm with a value of 2 for the matrix leg matching the os and version

- os: windows-latest

node: 4

npm: 2

include声明了 os 为 windows-latest 时，增加一个 node和npm分别使用特定的版本的矩阵环境

与include 相反的就是exclude ：

runs-on: ${{ matrix.os }}

strategy:

matrix:

os: [macos-latest, windows-latest, ubuntu-18.04]

node: [4, 6, 8, 10]

exclude:

# excludes node 4 on macOS

- os: macos-latest

node: 4

exclude 用来删除特定的配置项，比如这里当os 为 macos-latest，将 node为 4 的版本从构建矩阵中移除

steps

steps 的通用格式类似于：

steps:

- name: <step_name>

uses: <action>

with:

<parameter_name>: <parameter_value>

id: <step_id>

continue-on-error: true


- name: <step_name>

timeout-minutes:

run: <commands>

每个 step 步骤可以有:

  1. id : 每个步骤的唯一标识符

  2. name : 步骤的名称

  3. uses : 使用哪个action

  4. run: 执行哪些指令

  5. with: 指定某个action 可能需要输入的参数

  6. continue-on-error : 设置为 true 允许此步骤失败job 仍然通过

  7. timeout-minutes : step 的超时时间

action

action 动作通常是可以通用的，这意味着你可以直接使用别人定义好的action

checkout action

checkout action 是一个标准动作，当以下情况时必须且需要率先使用:

  1. workflow 需要项目库的代码副本，比如构建、测试、或持续集成这些操作

  2. workflow 中至少有一个 action是在同一个项目库下定义的

使用示例：

- users:action/checkout@v1

如果你只想浅克隆你的库，或者只复制最新的版本，你可以在 with中使用fetch-depth声明，例如:

- user:action/checkout@v1
  with:
  fetch-depth:1

引用 action

  1. 官方action标准库: github.com/actions

  2. 社区库:marketplace

引用公有库中的 action

引用 action 的格式是{owner}/{repo}@{ref}或 {owner}/{repo}/{path}@{ref}，例如上例的中actions/checkout@v1，你还可以使用标准库中的其它 action，如设置 node 版本:

jobs:

my_first_job:

name: My Job Name

steps:

- uses: actions/setup-node@v1

with:

node-version: 10.x

引用同一个库中的 action

引用格式：{owner}/{repo}@{ref}或 ./path/to/dir

例如项目文件结构为：

-- hello-world (repository)

 |__ .github

 └── workflows

 └── my-first-workflow.yml

 └── actions

 |__ hello-world-action

 └── action.yml

当你想要在workflow 中引用自己的action 时可以：

jobs:

build:

runs-on: ubuntu-latest

steps:

# This step checks out a copy of your repository.

- uses: actions/checkout@v1

# This step references the directory that contains the action.

- uses: ./.github/actions/hello-world-action

引用 Docker Hub 上的 container

如果某个 action 定义在了一个docker container image 中且推送到了Docker Hub 上，你也可以引入它，格式是docker://{image}:{tag} ，示例：

jobs:

my_first_job:

steps:

- name: My first step

uses: docker://alpine:3.8

更多信息参考:Docker-image.yml workflow 和Creating a Docker container ``action

构建 actions

请参考：building-actions

env

环境变量可以配置在以下地方:

  1. env

  2. jobs.<job_id>.env

  3. jobs.<job_id>.steps.env

示例：

env:

NODE_ENV: dev


jobs:

job1:

env:

NODE_ENV: test


steps:

- name:

env:

NODE_ENV: prod

如果重复，优先使用最近的那个

if & context

你可以在 job和step中使用if条件语句，只有满足条件时才执行具体的job 或 step :

  1. jobs.<job_id>.if

  2. jobs.<job_id>.steps.if

任务状态检查函数:

  1. success() : 当上一步执行成功时返回 true

  2. always() : 总是返回 true

  3. cancelled() : 当 workflow被取消时返回 true

  4. failure() : 当上一步执行失败时返回 true

例如：

steps:

- name: step1

if: always()


- name: step2

if: success()


- name: step3

if: failure()

意思就是 step1总是执行，step2 需要上一步执行成功才执行，step3 只有当上一步执行失败才执行

${{<expression>}}

上下文和表达式: ${{}}

有时候我们需要与第三方平台进行交互，这时候通常需要配置一个token，但是显然这个 token 不可能明文使用，这种个情况下我们要做的就是：

  1. 在具体 repository 库Settings 的 Secrets 中添加一个密钥，如 SOMEONE_TOKEN

注：关于如何获取github或者其他平台的密钥及授权不是本文重点，大家可以自行百度

  1. 然后在workflow中就可以通过 ${{secrets.SOMEONE_TOKEN}} 将 token安全地传递给环境变量
steps:

- name: My first action

env:

SOMEONE_TOKEN: ${{ secrets.SOMEONE_TOKEN }}

这里的secrets 就是一个上下文，除此之外还有很多，比如：

  1. github.event_name : 触发workflow的事件名称

  2. job.status : 当前job 的状态，如 success, failure, or cancelled

  3. steps.<step id>.outputs : 某个 action 的输出

  4. runner.os : runner的操作系统如 Linux, Windows, or macOS

这里只列举了少数几个

另外在if 中使用时不需要 ${{}} 符号，比如：

steps:

- name: My first step

if: github.event_name == 'pull_request' && github.event.action == 'unassigned'

run: echo This event is a pull request that had an assignee removed.

上下文和表达式详细信息请参考：contexts-and-expression

看到这里你应该对示例文件有了一定的理解，并且想自己去实验一下了，那就去actions页面找到官方示例去体验一下吧

但对于为什么要备份package.json我想大家还是心存疑惑，那我们看看具体内容吧

{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build": "hexo generate",
    "clean": "hexo clean",
    "deploy": "hexo deploy",
    "server": "hexo server"
  },
  "hexo": {
    "version": "5.2.0"
  },
  "dependencies": {
    "cheerio": "^1.0.0-rc.3",
    "gulp-htmlmin": "^5.0.1",
    "hexo": "^5.2.0",
    "hexo-baidupush": "^1.0.2",
    "hexo-charts": "^1.0.3",
    "hexo-cli": "^4.2.0",
    "hexo-deployer-git": "^2.1.0",
    "hexo-generator-archive": "^1.0.0",
    "hexo-generator-baidu-sitemap": "^0.1.9",
    "hexo-generator-category": "^1.0.0",
    "hexo-generator-feed": "^3.0.0",
    "hexo-generator-index": "^2.0.0",
    "hexo-generator-search": "^2.4.1",
    "hexo-generator-sitemap": "^2.1.0",
    "hexo-generator-tag": "^1.0.0",
    "hexo-render-pug": "^2.1.4",
    "hexo-renderer-ejs": "^1.0.0",
    "hexo-renderer-marked": "^3.3.0",
    "hexo-renderer-pug": "^1.0.0",
    "hexo-renderer-stylus": "^2.0.1",
    "hexo-server": "^2.0.0",
    "hexo-tag-aplayer": "^3.0.4",
    "hexo-wordcount": "^6.0.1",
    "pump": "^3.0.0",
    "terser": "^4.8.0"
  },
  "devDependencies": {
    "gulp": "4.0.2",
    "gulp-cli": "2.3.0",
    "gulp-clean-css": "^4.3.0",
    "gulp-htmlclean": "^2.7.22",
    "gulp-uglify": "^3.0.2"
  }
}

我们看到里面包含了npm脚本和一些依赖（包含dev版本的），有了这个文件我们只需执行npm i(install)即可自动安装所以所需依赖插件，而不用一个一个去敲一堆命令啦，理解了这个简单的例子，大家在部署其他项目时也许能更得心应手吧

今天的分享就到这里结束了，本文还有很多纰漏还请读者指出，后续将更正，下篇文章见

]]> <p><code>Github Actions</code>为什么这么香,我为什么专门建了一个组织<code>ccknbc-actions</code>来跑actions并储存博客源码，或者其他只是单纯来跑actions的项目，一开始就单纯只是想分类，forked一堆，主账号自己 我为什么选择了Tidio做聊天系统 https://ccknbc.github.io/yun/posts/why-did-i-choose-tidio-as-the-chat-system/ 2020-10-02T13:18:42.000Z 2020-10-03T10:09:51.000Z 使用了很多聊天系统后，在这里做一个心得总结，虽然至今无人问津，但还是要坚持下去，有一天会有有缘人上门的

以以下几个为例：Chatra, Tidio, Daovoice, Gitter, Crisp可以说是各有长处，但我的想法是在免费的基础上获得更好的体验，可能这就是我最后选择了Tidio的原因`

Chatra

适合中小企业级别，发展客户，推广商品之类的，界面只有英语，无法更改语言，对于不懂英语的人来说不是很友好，但都是些简单单词，就还好，免费版的话说实话功能是足够的，可以记录访客从哪个网页发起对话，但一旦访客发起对话，就自动记录了访客IP，并且需要高级版才能查看，虽然一般没什么用处，但对于骚扰信息还是OK的

Crisp

同样也是定位于服务企业，所有当网站实际上只有你一个人，它还是会发送我们有什么可以帮您的，标配预调查填写信息，自适应语言（这点真的很赞，虽然自定义程度太差，毕竟给你翻译就挺好的），实时全球访客地图，机器人等都是很实用的功能，可控制访客是否可以发送附件，总体上自定义程度ok，颜值也还在线，免费版确实也够用的

Gitter

创建聊天室或者社区，更适合程序员使用，不过issue他不香吗

Daovoice

国内服务商，微信通知绝对好评，相对比较简约，不过以上这些都带有邮件通知，所以不用担心漏掉消息啦，邮件通知还是比较好看的，然后可以向曾经的访客批量发送通知（好功能但是不推荐，应该把主动权交给用户，还不如webpush），它的定位也是企业级别

Tidio

下面进入正题

  1. 虽然他的官网是只支持英文，但是小部件语言你可以添加几个并自行翻译（比如根据台湾地区语言习惯在地化一些繁体中文显得更亲切），这样一来自定义程度其实是很好的，然后你就可以获得和你现在看到的界面这样的效果

  2. 小部件渐变色真是深得我心，颜值瞬间提升，你还可以根据不同设备设定或排除显示界面，不同设备有不同的位置大小，Sidebar也是极好的，但本站集成了按钮所以不能按照原来的显示，您可以自行尝试

  3. 电子邮件通知footer自定义，也是一种推广

  4. 插件方便营销，不过配合谷歌事件分析还是很赞的

  5. 机器人引导，免费的够用了，很大的操作空间

  6. 自定义快速回复，这个其他的也有配备

  7. 主要是给了用户更多选择，告知用户我可能会记录你的IP等隐私信息，算是一种信任培养

    官方小部件

    官方小部件概览

    离线状态

    离线状态

    在线状态

    在线状态

    QQ截图20201003145531

中国台湾省好评

下载

设置界面概览
]]> <p>使用了很多聊天系统后，在这里做一个心得总结，虽然至今无人问津，但还是要坚持下去，有一天会有有缘人上门的</p> <p>以以下几个为例：<code>Chatra</code>, <code>Tidio</code>, <code>Daovoice</code>, <code> 简历模板 https://ccknbc.github.io/yun/posts/resume-template/ 2020-09-13T08:40:33.000Z 2020-09-13T08:40:33.000Z 案例A

178XXXXXX46 | anli150151@foxmail.com

求职意向：用户运营实习生

教育经历

成都工业学院 国际商务本科 2015.9 – 2019.7

l GPA：3.24/5.0（专业排名17/153）

l 荣誉/奖项：校级乙等奖学金2次(6%)、丙等奖学金1次(10%)、挑战赛校级赛2等奖、解说员风采大赛2等奖。

实习经历

瑞禾英语 外教老师助理 2018.4-2018.6

l 社群日常管理：协助外教负责5个班级群管理，包括发放教学资料、组织班级学习，收集整理课程资料，记录30位学生单独的成长记录，形成文档保存；

l 用户答疑解惑：协调外教老师和5个班级在课堂中出现的各种问题并及时翻译。及时解答学生关于发音的疑问，最终有效地纠正了口语发音。

l 调动课堂气氛：为提高学生课程参与度，调动课堂气氛，策划小游戏等；

l 课后辅导：密切跟踪关注学生课后的复习情况和学习上遇到的困难，向学生介绍一些更有效的学习方法来提高英语水平；

l 用户调研：利用Word协助制作并回收50**份家长调查问卷**，调查17位家长的意见反馈，及时和老师们交流，对6次课程内容进行修改，优化教学内容和服务质量；

中信银行郫都支行 零售部客户经理助理 2018.1-2018.2

l 维护客户：扩大客户群和完成贷款任务，维护和链家、中信地产和Q房网3家房产机构的业务关系。负责买卖及银行3方贷款资料等10份资料的收集和完善，进行贷款资料整理核实，协助初审等；

l 后续跟踪：处理客户还款申请及贷后管理，包括资料补办、跟踪贷款进度。维护客户关系，协助客户签署3份贷款合同文件。一个半月的实习里，完成53笔贷款业务。

嘉祥九思教育 晚辅老师 2017.3-2017.6

l 课堂纪律：负责对23位同学日常签到和考勤，监督学生按时参加晚辅，是学生的签到率提到14%。

l 答疑解惑：辅导小学生和初中生的语文、数学和英语作业，实时解决学生作业中遇到的困惑，及时与家长沟通并解决学生学业问题。所负责的学生，成绩提高到了85分，获得了家长的好评。

校园经历

经济与管理学院实践部 骨干成员 2015.09-2016.10

l 组织 “三月学雷锋”颁奖仪式，负责活动策划，组织协调活动人员。活动有486人观看，仪式圆满成功。

l 协助经济与管理学院“首届创新创业大赛”，负责人员组织和宣传工作。邀请了光谷创业咖啡的代表作为点评嘉宾，吸引了103同学参加。

技能/证书及其他

技能： Office办公（熟练）

证书**/**执照： acess数据库（二级）、英语（六级490分、四级450分）

语言： 英语口语（熟练）

自我评价

l 大四国际商务专业在读，分别在嘉祥九思、瑞和英语教育机构担任晚辅老师和助教，参与11**次英语课程内容的制作，在线解答各种学习困惑。负责30**人社群运营，包括调动课堂气氛、及时答疑、组织课堂纪律等；

l 个人荣誉：3次校级奖学金，全国大学生电子商务挑战赛校级赛2等奖等；

l 职业规划：在教育领域深入发展，当前职业定位是用户运营岗位

方方

​ 13722222457 | 22222222@163.com

​ 求职意向：人力实习生

教育经历

浙江科技学院 英语专业本科 2016.09 – 2020.07

l GPA：3.67/5.0（综合排名7/60）

l 荣誉/奖项：校级三等奖学金2次、国家励志奖学金2次、优秀学生干部1次

l 相关课程：高级口译、高级英语视听说、商务英语、英美文学

活动经历

浙江**科技学院外国语学院学生会 正主席 2018.10-2019.01**

l 活动策划：担任总策划人，负责院学生运动会开幕式的策划以及排演，召开2次学生会议后，在老师的指导下确定最终方案。

l 活动执行：负责现场彩排，组织3个班级共计60余人进行现场有序演练，耗费2天达成方阵表演效果，最终运动会开幕式圆满完成。

浙江科技学院外国语学院英语162班 班长 2017.09-2019.06

l 协调分工**：**带领班干部筹办班级迎新晚会，经过多次开会讨论，2天之内形成具体方案，将任务细化分配到个人，督导晚会各环节进程，最终成功举办班级晚会，参与人数27/31，获得班级同学的认可。

l 组织彩排**：**在学校开展校特优学风班评比比赛时，与老师班委一起策划现场评比表演，分配规划任务。赛前与比赛工作人员协商彩排时间并组织了4次彩排，在17个强劲班级中，取得了总分第二的好成绩。

浙江科技学院外国语学院勤工助学处 负责人兼辅导员助理 2018.09-2019.06

l 沟通协调**：**在从事勤工助学时，主要负责招聘岗位与人数的拟定，以及每隔两个月一次的薪酬统计。初始期间与院负责老师以及其他老师多次沟通协商，协调出最适合的用工人数及用工岗位，获得了负责老师的认可。

多项志愿活动 志愿者

l 人员接待**：**在世界医药健康信息学大会中担任酒店志愿者，负责与外宾沟通并迎接入住，大会信息咨询，会场班车引导，因服务细致热心，还收到了澳大利亚与会嘉宾的感谢与礼物。

l 英语翻译：在世界地理信息学大会中担任餐饮组志愿者，给参会国家部长及其家属提供餐饮服务，并担任翻译。

此外还参加了浙江省口译大赛志愿者，浙江省-下奥地利商务论坛翻译人员。

技能/证书及其他

技能： Office办公（熟练）

证书/执照：英语（四级、六级），专业英语四级（笔试，口试）

语言： 英语口语（熟练），日语（一般掌握）

个人荣誉：“we talent”优秀学子；院学生会主席；优秀学生干部；全国大学生英语竞赛校二等奖；浙江省LSCAT笔译大赛二等奖；优秀志愿者

[Name]

[Phone Number] | [Email Address] | [Physical Address (make it short; just highlight where you are now)]

(Reminder: 中英文简历各一页！改完后记得删除所有中括号)

EDUCATION

[University Name] [City], [State/Country]

Bachelor of [Arts/Science]; Major in [Major] [Start date (month/year)] – [End date (expected)]

· GPA: [xx] / 4.0; [If you’re outside the US, list grades under your system here instead]

· Honors/Awards: [xx]

· Major Coursework: [Economics / Accounting / Finance classes, only the “hardcore” courses; highlight what content you learnt from the courses, rather than only list the official names of the courses]

INTERNSHIP EXPERIENCE

[Company Name 1] [City], [State/Country]

Explanation of the company (if it is not “big name”)

[Position Title], [Group Name] [Start Date] – [End Date]

· [Summary sentence stating what you did and the overall results of your work]

· [Conducted research on the xx industry, covering market size, growth, trends and key success factors, which was used in the external study part of the strategic planning report for a xxx client]

· [Collected such financial data as revenue, margin and cost breakdown of 10+ competitors of a client in XX industry through desktop research, analyzed the data through modeling, and the results were used for the competitor benchmarking and strategic recommendations report]

· [Led a team of xxx members to organize a marketing campaign, which attracted xxx customers within xx days, and increased the sales of the month by xx% ]

[Company Name 2] [City], [State/Country]

Explanation of the company (if it is not “big name”)

[Position Title], [Group Name] [Start Date] – [End Date]

· [Summary sentence stating what you did and the overall results of your work]

· [Conducted research on the xx industry, covering market size, growth, trends and key success factors, which was used in the external study part of the strategic planning report for a xxx client]

· [Collected such financial data as revenue, margin and cost breakdown of 10+ competitors of a client in XX industry through desktop research, analyzed the data through modeling, and the results were used for the competitor benchmarking and strategic recommendations report]

· [Led a team of xxx members to organize a marketing campaign, which attracted xxx customers within xx days, and increased the sales of the month by xx% ]

EXTRACURRICULAR ACTIVITIES

[Student Club Name] [City], [State/Country]

[Position Title] [Start Date] – [End Date]

· [Summary sentence stating what you did and the overall results of your work]

· [Led a team of xx people to organize xx activities to recruit xx new members, increasing the overall membership from xx to xx within xx months]

· [Organized xx conference, which invited xx speakers and attracted xx audience]

[Volunteer Work Name] [City], [State/Country]

[Position Title] [Start Date] – [End Date]

· [Summary sentence stating what you did and the overall results of your work]

· [Organized xx activities …, which attracted xx participants / xx audience / helped xx people to xxx]

· [Led a team of xx people to xxx]

SKILLS & INTERESTS

Languages: TOEFL [xx] / 120; IELTS [xx] / 9; CET-4/6 [xx] / 710; xx years’ overseas study and living experience

Technical Skills: [List any programming languages – including MS Office/Excel]

Certifications & Training: [Any extra courses or programs relevant to your target, e.g., CPA, CFA]

Interests: [Keep this to 1-2 lines and be specific, e.g. Travelling (backpacked to 20 countries); Piano (Grade 10)]

]]> <p><strong>案例A</strong></p> <p>178XXXXXX46 | <a href="mailto:&#x61;&#110;&#108;&#x69;&#49;&#53;&#x30;&#x31;&#53;&#x31;&#64;&#x66;&#x6f;&#x78 第55届金钟奖相关 https://ccknbc.github.io/yun/posts/about-the-55th-golden-bell-awards/ 2020-08-26T06:03:44.000Z 2020-09-26T15:59:59.000Z
  • 资料来自维基百科，自由的百科全书，根据相关法律法规做了适当修改，坚持一个中国原则，但也遵守CC BY SA协议
    • 第55届金钟奖 55th Golden Bell AwardsGBA55.jpg
    日期广播类：2020年9月19日电视类：2020年9月26日
    地点台湾台北市国父纪念馆
    国家或地区中国台湾
    主办单位指导单位：文化部主办单位：文化部影视及流行音乐产业局承办单位：三立电视
    主持人广播：吴玛丽、陈子见电视：白家绮、Gino、曾莞婷、陈冠霖、黄路梓茵、卢广仲、曾国城、炎亚纶
    预展主持人电视类星光大道：黄豪平、李霈瑜
    官方网站gba.tavis.tw
    电视／电台转播
    电视网络广播类：三立电视、Vidol电视类：三立电视、公视、Vidol
    时长广播类：电视类：
    ← 第54届金钟奖第56届 →

    第55届金钟奖（英语：55th Golden Bell Awards / 55th GBA）是2020年台湾传媒业界的年度盛事之一，以表扬2020年度杰出的台湾广播与电视从业人员，延续过往模式分为广播、电视金钟奖，并均于台北市国父纪念馆举行。广播金钟奖颁奖典礼于2020年（民国109年）9月19日举行，由吴玛丽、陈子见担任典礼主持人；电视金钟奖颁奖典礼于2020年（民国109年）9月26日举行，由白家绮、Gino、曾莞婷、陈冠霖／黄路梓茵、卢广仲／曾国城、炎亚纶三个组合分段担任典礼主持人，黄豪平、李霈瑜担任星光大道主持人。

    过程[编辑]

    广播[编辑]

    • 本届广播金钟奖报名时间为2020年4月13日～2020年5月4日
    • 本届广播金钟奖特别奖推荐时间为2020年4月13日～2020年6月5日
    • 2020年8月19日公布广播金钟奖入围名单。

    电视[编辑]

    • 本届电视金钟奖报名时间为2020年4月13日～2020年5月4日
    • 本届电视金钟奖特别奖推荐时间为2020年4月13日～2020年6月5日
    • 2020年8月26日公布电视金钟奖入围名单。

    广播类入围暨得奖名单[编辑]

    109年度广播金钟奖颁奖典礼于2020年9月19日于台北市国父纪念馆举行，颁发如下奖项：

    节目奖[编辑]

    流行音乐节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《Langdau原创社》财团法人原住民族文化事业基金会黄子佼、茄子蛋
    获奖《Street Voice未来进行式》飞碟广播股份有限公司
    《耳朵借我》财团法人原住民族文化事业基金会
    《告白》内政部警政署警察广播电台
    《宝岛真无闲》宝岛新声广播电台股份有限公司

    类型音乐节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    获奖《Jazz Supreme 爵士‧无所不在》财团法人台北劳工教育电台基金会吴建恒、ABAO阿爆
    《客家妹来打卡》财团法人客家公共传播基金会
    《原声探索》财团法人原住民族文化事业基金会
    《倾听音乐》财团法人佳音广播电台
    《当音乐来敲门》正声广播股份有限公司

    教育文化节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《自然笔记》国立教育广播电台王美英、范钦慧
    《森林美乐地》汉声广播电台
    《笔尖上孩提的奇幻之旅》财团法人中央广播电台
    获奖《雁子飞过台三线》财团法人客家公共传播基金会
    《余音鸟袅》内政部警政署警察广播电台

    儿童节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《i动物进行式》国立教育广播电台小茱姐姐（施贤琴）、依娜（黄怡馨）、Deborah（李诺亚）
    《大脚逛世界》内政部警政署警察广播电台
    获奖《地球探险号》国立教育广播电台
    《维多叔叔的故事欢乐车》基隆轻松广播电台股份有限公司

    少年节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《技职MVP》国立教育广播电台邵大伦、邱锋泽、陈零九
    《青春好好Young》财团法人富邦文教基金会
    《青春创学院》国立教育广播电台
    获奖《发现新鲜“市”》内政部警政署警察广播电台
    《听青春在唱歌》台北广播电台

    社会关怀节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《45度角的天空》汉声广播电台林书炜、黄博炜
    《人生路歌声情》国立教育广播电台
    《生命拼图》行政院农业委员会渔业署渔业广播电台
    《幸福北台湾》国立教育广播电台
    获奖《碍运动》内政部警政署警察广播电台

    艺术文化节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《RTI放映室》财团法人中央广播电台蒋伟文、曲艾玲
    《山海族子民》财团法人原住民族文化事业基金会
    《世界梦想表演厅》国立教育广播电台
    获奖《生活AGOGO-说在地的故事》全国广播股份有限公司
    《声动美术馆》财团法人中央广播电台

    生活风格节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《Joy’s Fantasy》财团法人台北劳工教育电台基金会流氓阿德（黄永德）、陈明珠
    《世界异家来作客》财团法人客家公共传播基金会
    《全世界最亮的光》财团法人中央广播电台
    获奖《食随滋味》内政部警政署警察广播电台
    《农民食堂开饭了》国立教育广播电台

    社区节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《大地采风》正声广播股份有限公司高雄广播电台王美英、范钦慧
    《日出的所在》正声广播股份有限公司云林广播电台
    《移山倒海樊梨花-Love can move mountains 听见台湾的心跳声》台湾广播股份有限公司
    《爱上新竹》竹科广播股份有限公司
    获奖《诸罗采风》正声广播股份有限公司嘉义广播电台

    广播剧奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    获奖《人生想想剧场》财团法人中央广播电台杨小黎、谢哲青
    《大树下听故事》大树下广播电台股份有限公司
    《珍女人时代剧场》台北广播电台
    《时代剧场》财团法人中央广播电台
    《假日听电影》正声广播股份有限公司高雄广播电台

    单元节目奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《Cultural Visa Everywhere》财团法人中央广播电台杨小黎、谢哲青
    《KISS旅行台湾的一百种视角》大众广播股份有限公司
    获奖《台湾幸福进行曲》好家庭广播股份有限公司
    《技职翻转人生》国立教育广播电台
    《英文有意思》汉声广播电台

    个人奖[编辑]

    流行音乐节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    获奖小树《Street Voice未来进行式》飞碟广播股份有限公司黄子佼、茄子蛋
    内克（吴宇轩）《告白》内政部警政署警察广播电台
    邵大伦《宝岛真无闲》宝岛新声广播电台股份有限公司
    陈炜智《台湾电影笔记》竹科广播股份有限公司
    葛大为《同行相记》台北之音广播股份有限公司

    类型音乐节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    获奖徐崇育《Jazz Supreme 爵士‧无所不在》财团法人台北劳工教育电台基金会吴建恒、ABAO阿爆
    陈明珠《客家妹来打卡》财团法人客家公共传播基金会
    黎慧芝、管仁健《那些年我们一起唱的歌》财团法人中央广播电台
    墨镜哥（甘仲维）《Voice Over 鲜声夺人》汉声广播电台
    谭志薏、戴伸峰《弦外之音》财团法人中央广播电台

    教育文化节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    王美英《e啦！原住民》高雄广播电台王美英、范钦慧
    府城lalelin《诗情也绵绵》财团法人中央广播电台
    获奖范钦慧《自然笔记》国立教育广播电台
    徐凡（徐豫梅）《笔尖上孩提的奇幻之旅》财团法人中央广播电台
    杨照（李明骏）《东亚史的关键时刻》台北广播电台

    儿童节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    小茱姐姐（施贤琴）《i动物进行式》国立教育广播电台小茱姐姐（施贤琴）、依娜（黄怡馨）、Deborah（李诺亚）
    吴廷宏、吴亦伟、吴蔚恩《唱歌学族语-三猫教你唱 blaq balay》财团法人原住民族文化事业基金会
    获奖依娜（黄怡馨）、Deborah（李诺亚）《大脚逛世界》内政部警政署警察广播电台
    陈燕柔、邱宇宽《地球探险号》国立教育广播电台

    少年节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    Polo（陈歆翰）、柚仔（林品贝）《台湾文武爿》财团法人中央广播电台邵大伦、邱锋泽、陈零九
    季洁（蔡宜颖）《技职MVP》国立教育广播电台
    柯华葳、游婷雅《阅读推手》好家庭广播股份有限公司
    获奖端端（陈端慧）《青春创学院》国立教育广播电台
    郑晴（郑雅卿）、蒋蓉（施旭治）《发现新鲜“市”》内政部警政署警察广播电台

    社会关怀节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    世昌（洪世昌）《人生路歌声情》国立教育广播电台林书炜、黄博炜
    获奖尚恩（黄彦翔）、倚乐（陈怡蓓）、旁白哥（孙铭宏）、Manga（吴曼嘉）《碍运动》内政部警政署警察广播电台
    林书炜、朱芯仪《POP最正点》台北流行广播股份有限公司
    马士（凌士哲）《生命拼图》行政院农业委员会渔业署渔业广播电台
    詹婉如《就要听“婉”报》财团法人中央广播电台

    艺术文化节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    朱家绮《声动美术馆》财团法人中央广播电台蒋伟文、曲艾玲
    林菲《生活AGOGO-说在地的故事》全国广播股份有限公司
    阿俊（徐智俊）、李文玫《客家靓朱玉》财团法人宝岛客家广播电台
    获奖端端（陈端慧）《世界梦想表演厅》国立教育广播电台
    谢哲青《音乐心旅行》财团法人台北劳工教育电台基金会

    生活风格节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    大米（林琼美）《农民食堂开饭了》国立教育广播电台流氓阿德（黄永德）、陈明珠
    吴若权《媒事来哈啦》财团法人富邦文教基金会
    获奖流氓阿德（黄永德）《全世界最亮的光》财团法人中央广播电台
    舞赛．古拉斯《岛屿文创村》财团法人原住民族文化事业基金会
    苏筠、果果《食随滋味》内政部警政署警察广播电台

    社区节目主持人奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    朱卫茵《周末生活女王－低碳环保乐》飞碟广播股份有限公司王美英、范钦慧
    思安（陈思安）《幸福藏宝图》正声广播股份有限公司
    洪惠冠、蔡荣光《爱上新竹》竹科广播股份有限公司
    获奖杨长顺《日出的所在》正声广播股份有限公司云林广播电台
    靓慧（王靓慧）《大地采风》正声广播股份有限公司高雄广播电台

    企划编撰奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    士玶（黄士玶）、赖可（赖冠宇）、露西（陈珮茹）、俊孝（林俊孝）、罄榆（林罄榆）《一心一艺》内政部警政署警察广播电台杨小黎、谢哲青
    内克（吴宇轩）、Vicky（刘虹钰）、Amy（丁宛臻）《告白》内政部警政署警察广播电台
    获奖奇林Michael（林祺宏）、徐凡（徐豫梅）、董娘（董丽琴）、林彦伯、黄裕元、林佩蓉、Joey（刘怡彣）、咪可Miko（李虹靓）《宝岛记事簿》国立教育广播电台
    洁枫（尹洁枫）、叶国新 Jacky（陈昱豪）、刘碧薇 李易澄《东西有艺鉴》内政部警政署警察广播电台
    郑立明、廖南瑛《青年转动全球》国立教育广播电台

    音效奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    成春福《Cultural Visa Everywhere》财团法人中央广播电台杨小黎、谢哲青
    获奖吴坤龙、蔡怡雯、林宪𬭎《假日听电影》正声广播股份有限公司高雄广播电台
    李可《听！是谁在歌唱》高雄广播电台
    徐进辉、郑惠文 沈逸华、张贺杰《大树下听故事》大树下广播电台股份有限公司
    陈文彬《珍女人时代剧场》台北广播电台

    广告奖[编辑]

    商品类广告奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《床的世界-上床篇》灰姑娘音乐制作有限公司夜猫DJ Dennis、阿达、HowHow陈孜昊
    获奖《昇达轮胎无所不在 一路向前守护全台》正声广播股份有限公司台北广播电台
    《高雄观音山金宝塔-阿兄篇》王子音乐出版社
    《抢银行篇》环球七福广告有限公司
    《挤身上流篇》财团法人台北劳工教育电台基金会

    非商品类广告奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《POP Radio防疫广告【清洁队员】篇》台北流行广播股份有限公司夜猫DJ Dennis、阿达、HowHow陈孜昊
    《防疫大作战之今年七夕不相会篇》正声广播股份有限公司云林广播电台
    获奖《防疫宣导》灰姑娘音乐制作有限公司
    《环宇公益广告-最美距离篇》环宇广播事业股份有限公司
    《关怀老人篇》台南知音广播股份有限公司

    电台奖[编辑]

    电台品牌行销创新奖[编辑]

    入围／得奖作品制作公司／广播公司颁奖嘉宾
    《【永远的流行乐之王 Michael Jackson 逝世十周年 纪念特辑】》财团法人台北劳工教育电台基金会夜猫DJ Dennis、阿达、HowHow陈孜昊
    获奖《【疫情平安 一起平安】广播与数位专题影音展》好家庭广播股份有限公司
    《超级大喇叭：宝岛逗相挺》大千广播电台股份有限公司

    创新研发应用奖[编辑]

    入围／得奖者入围／得奖作品制作公司／广播公司颁奖嘉宾
    内政部警政署警察广播电台《广播“视”界魅力无限 社群媒体聚合平台应用》内政部警政署警察广播电台夜猫DJ Dennis、阿达、HowHow陈孜昊
    获奖国立教育广播电台《数字化广播体验-麦宝电波行动录音室》国立教育广播电台
    蔡明佑、李明勋、谢锦隆《广播站台视觉与环境管理发展技术应用》汉声广播电台
    郑明祈、吴国钦、陈俊谕《因应疫情之异地主播室系统设计》行政院农业委员会渔业署渔业广播电台

    特别贡献奖[编辑]

    得奖者
    从缺

    • 109年度电视金钟奖星光大道

    • 总监制：王淑娟

    • 星光大道执行监制：黄晓玫

    • 星光大道制作人：许蕙茹

    • 星光大道制作群：邱湘莹、张伶卉、林君谕、周矩源、林孟如、吴亚桦、胡馥纯、廖亭琇、王芷晴、许芳瑜、袁锦仪、谢岳龙、李哲豪、孙黄贤、古淑慧、叶韦成、林思婷、余玫仪、胡佳倩、锺宏源、黄伟嘉、任禹洁、李真苡、黄雅新、陈佳莹、吕伟诚、姚佳燕、徐郁婷、陈钲锠、吴佳颖、简婉如、王建棠、锺孟洁、陈品柔、纪婷文、胡存智、邱玉芸、锺雨庭、陈颀惠、黄蓝、林贝珊、余柏颉

    • 三立工程部

    • 工程统筹：龚美富

    • 星光导播：锺宜莹

    • 现场指导：李建霖、江国玮

    • 助理导播：张成柔、王薏宁

    • 技术指导：陈建良

    • 视讯工程师：刘世裕、吴元申、赵德昇

    • 视讯助理：张元威、王通燊

    • 摄影师：朱华阳、林明雄、王文龙、王新智、黄春镇、陈俊雄、林文陞

    • 灯光师：薛芳铭、王文枫、林中强、邱汉忠、李智伟、王孟蓁

    • 成音师：孟兆欣、叶志忠、夏永柠、罗梵笠、蔡豊泽、陈文隆

    • 后制统筹：苏玠玺

    • 剪辑指导：薛宇琳、许佳雯

    • 后制剪辑：范志明、吴鸿伟、赖庆原、黄珮瑜、李幸蓉、陈美绍、史昇鑫、张君豪

    • 影片制作：郑亨泰、古淑慧、巫少强、廖昱凯、杨治娟、黄雅新、吴佳颖、黄建国、林思婷、简婉如、李晨瑜

    • 影片音效：声都传播有限公司

    • 影片旁白：马克（沈子煜）

    • 影片灯光：邱汉光

    • 影片摄影：外景摄影组

    • 星光大道主持人：李霈瑜

      • 化妆：Backstage Jimy Wu
      • 发型：ZOOMhairstyling Spud_Tan谭信文
      • 服装提供：APUJAN
      • 珠宝提供：APM monaco YUN YUN SUN
      • 造型：金比白工作室 Claire化妆

    • 星光大道主持人：黄豪平

      • 化妆/发型：Ryan
      • 服装：沈子宸

    • 109年度电视金钟奖颁奖典礼

    • 总监制：王淑娟

    • 执行监制：黄晓玫

    • 制作人：谢孟芬

    • 典礼制作群：王梦黛、邱湘莹、张伶卉、周矩源、林君谕、林孟如、吴亚桦、杨雅斐、王韵慈、杨治娟、陈钲锠、胡馥纯、吴佳颖、简婉如、王建棠、锺孟洁、陈奕颖、蔡妏雪、黄佳雯、周倢羽、黄至柔、邱亭瑄、许崇豪、苏子晴、蓝敬淇、李晨瑜、谢欣妤、林芳玉、锺欣惠、苏圣棋、江政颖、洪辰嫣、锺衣雯、凃嘉文、周妍廷、陈诗涵、沈美仪、陈淑卿、董依𬭚、苏振邺、蔡婉婷、赖玉婷、陈怡静、洪维信、杨雁捷、张韶恩、梁永青、梁家豪、林雅婷、李东元、蔡青萦、叶为诚、程仁伟、陈钰雯、凌静宜、许芳瑜、林友三、曹美琳、范振轩、黄雅文、陈宥亘、黎莉、黄鹏瑞、蔡宗翰、郑宇彤、田惠敏、廖翊婷、曾译卉、叶子瑄、王怡钧、陈怡如、郭柏旸、徐弦纭、徐嘉妤、邱苡洁、田筱琪、周亮辰、陈信智、曾琴、李奇莹、邱筱婷、徐郁婷、邱泠、余品贤

    • 三立工程

    • 工程统筹：龚美富

    • 导播：吴美君

    • 现场指导：邱雅玲、李紫瑀、李建霖、江国玮

    • 助理导播：黄雅琳、翁逸玫、李孟洁、萧谊諠

    • 技术指导：陈建良

    • 视讯工程师：刘世裕、吴元申、赵德昇

    • 视讯助理：张元威、王通燊

    • 摄影师：潘铭义、陈俊谊、王书镇、陈光杰、黄兆春、豊世颖、吴思宸、林茂荣、杜彦翔、吴茂瑞、林岢霈

    • 灯光师：薛芳铭、王文枫、林中强、邱汉忠、李智伟、王孟蓁

    • 成音师：孟兆欣、叶志忠、夏永柠、罗梵笠、蔡豊泽、陈文隆

    • 主持人：白家绮

      • 梳化：王盈乔
      • 发型：罗南
      • 造型：小意思造型设计工作室 莉丝、怡如
      • 礼服：bob Jian Daniel Wong
      • 珠宝：SHEE’S FINE JEWELRY 侍好珠宝
      • 鞋：Rene Caovilla

    • 主持人：Gino(蔡东威)

      • 发型：好剪才
      • 梳化：濬绮工作室 邱绣育
      • 造型：小意思造型设计工作室 莉丝、怡如
      • 礼服：Boss
      • 珠宝：LONGINES 浪琴表
      • 鞋：LAIO复古绅士装

    • 特别感谢：凤凰艺能股份有限公司、民间全民电视公司

      未完待补….

      参考资料[编辑]

    1. ^ 金钟奖直播资讯看这里 戏剧类大乱斗 追思桥段感伤,中央社，2020年9月26日

    2. ^ 金钟奖第55届 完整入围名单,中央社，2020年8月26日

      外部链接[编辑]

    ]]>     <ul> <li><strong>资料来自维基百科，自由的百科全书，根据相关法律法规做了适当修改，坚持一个中国原则，但也遵守CC BY SA协议</strong></li> </ul> <table> <thead> <tr> <th align="left">第55届金钟奖 5     Uptime免费网站存活监控 https://ccknbc.github.io/yun/posts/uptime-free-website-survival-monitoring/ 2020-08-20T01:58:09.000Z 2020-08-20T01:58:09.000Z

    前言

    对于静态托管网站来说，如果你放在不同的仓库，或者是托管服务商，那么有一个必要的网站存活监控是非常重要的，实时监控哪个仓库存活，哪个仓库无法访问，以便及时调整自己的线路。

    UptimeRobot是一个免费提供网站存活监控的服务商，免费版本可以同时监控50个站点，最高频率可以达到5分钟一次，而且还可以自己生成公共页面以便访问，还可以绑定自定义域名。

    正文

    网站地址：https://uptimerobot.com/

    注册什么的就不用说了吧

    创建监视器

    注册完成之后登录会直接进入控制台

    创建新的监视器

    选择你要监视的方式，https 是通过访问的形式，ping 就是ping你的地址，port 就是监视端口

    这就创建好一个监视器啦

    生成公共页面

    我们要访问监视器总不能每次都登录吧，Uptime贴心的准备了可以生成公共页面，还可以绑定自定义域名哦

    选择要显示的监视器，是全部显示还是只显示选中

    创建完成之后就可以使用你的自定义域名来访问啦，或者使用默认域名

    在这里进行访问

    这里是我的例子：大白萝卜の网站监控

    API

    如果你不喜欢他生成的页面，或者想要自己部署，那么你可以使用别人制作的主题，地址：

    两个一样，随便选一个

    fork到自己仓库后，修改相关配置即可

    三种APIkey自己按照需要任选其一生成即可，在配置文件中进行修改，之后自己部署完毕就OK啦

    大佬的例子：Flexiston 的网站状态 卓越科技- 的网站状态

    ]]>     <p><img src="https://cdn.jsdelivr.net/gh/laugh0608/CDN/img/20200820100301.png" loading="lazy" loading="lazy"></p> <h2 id="前言"><a href="#前言"     简单浏览器更新推送的实现 https://ccknbc.github.io/yun/posts/implementation-of-simple-browser-update-push/ 2020-08-18T12:39:36.000Z 2020-08-18T12:39:36.000Z 这篇文章主要想大家介绍如何使用webpushr及其对应的插件hexo-web-push-notification来帮我们节省时间完成自动推送更新

    插件安装

    npm i hexo-web-push-notification --save

    注册webpushr账号

    首先进入官网注册账号 ，注意需要谷歌人机验证，请自备工具访问
    注册账号

    注册后登录就进入网站选择界面，不过新注册应该是直接进入添加新网站，老用户也可点击添加新网站，但实际上可以多网站共用，因此也就没没必要了
    登陆成功

    根据图中提示自行完善网站信息
    添加网站

    注册完毕后就可前往管理面板了
    验证安装

    这里截图划线部分为Tracking code，忘记保存的话可以回退步骤，或者待会儿在管理面板查看
    安装组件

    然后我们大致熟悉一下环境，更多信息可自行查看；为什么使用这个实际上因为

    1. 他能做到用户主动订阅浏览器更新通知，新文章或者公告等（后面再讲）
    2. 它在60000订阅一下是完全免费的，而且很可靠，你不需要服务器或者其他复杂配置，所有一切均由webpushr完成
    3. 懒得使用网站统计，它这个可视化的数据也还是够用了，每周也会给你发一封邮件，说明你这周的订阅表现
    4. 它的功能强大，自定义程度高，界面比较友好

    面板预览

    当然他还是有缺点的

    1. 浏览器清除本地数据后他会把你当作新用户发送欢迎通知，影响了数据统计
    2. 它的地图把宝岛台湾划在中国之外
    3. 有时候你会延后几天收到一条更新通知

    获取几个必要配置

    1. 点击Setup -> Tracking code(或Integration -> Manual Integration)，如果你刚才保存了可以核对一下是否有误
    2. 点击Integration -> REST API Keys可以获取到Key和Authentication Token

    加下来我们进行配置，按照开发者的README，我们需要在HEXO根目录的配置文件_config.yml添加如下内容（记得替换为自己的）

    webPushNotification:
      webpushrKey: "your webpushr rest api key"
      webpushrAuthToken: "your webpushr authorize token"
      trackingCode: "AEGlpbdgvBCWXqXI6PtsUzobY7TLV9gwJU8bzMktrwfrSERg_xnLVbjpCw8x2GmFmi1ZcLTz0ni6OnX5MAwoM88"

    关于安装部分就差不多结束了，下面我们回到webpushr网站对我们的网站进行相关配置

    这部分就不截图了，大家即使不懂英语也能看明白知道setup, push的意思再配合网站的显示，还有操作变化都能明白（网页翻译真好用），比如选择订阅推送的样式内容（emoji也是特色个人觉得），订阅通知小铃铛，欢迎推送，这些在你刚才打开我网站的时候都已经体验过了（如果没有，检查一下弹窗是否被拦截，清楚浏览器数据后体验一下）

    API通知就是利用我们生成好的newpost.json本地与远端进行比较来进行更新文章推送，比较特色的就是定时自动推送，这个我们拿来做临时公告也是非常方便的

    其他内容就请读者自定探索吧

    如何完成文章更新推送

    但说了这么多，触发推送的条件还没讲呢，而我们一般推送文章，大致使用如下格式即可

    ---
    title: Hexo使用Web Push Notification 浏览器通知推送
    tags:
      - hexo
      - 服务器推送技术
      - push notifications
    categories:
      - 开发
    comments: true
    abbrlink: 98ae9e55
    date: 2020-02-26 10:00:00
    ---

    Web Push Notification 是怎么工作的？个人博客为什么要使用它？如何使用它？

    <!-- more -->

    请注意一定要有预览内容，也就是---和<!-- more -->之间的内容

    讲到这里我们就发现，我们可以通过是否写预览内容来自主控制是否向订阅者推送这篇文章更新，而不是所有文章都推送，这种主动方式是我觉得比较人性化的

    点击 查看开发经历 | 查看更多相关资讯 | 特殊推送解决方案 | 泛用推送解决方案

    其他须知

    你如果阅读了隐私，你会发现它可以收集用户的很多信息，比如IP，国家或地区，设配类型等等，这些你可以选择自行开启或关闭，因为有时候过度收集这些无用隐私也是没必要的；不过作为有垃圾评论或者恶意评论来说，这种记录也是一种帮助

    当然要想让读者愿意订阅你的博客，你的确要在内容下下功夫，我相信只要你能持续输出有趣有用的内容，就不愁没有订阅者的，一起加油吧！

    这篇文章还有许多不足的地方，如有错误，欢迎指正

    ]]>     <p>这篇文章主要想大家介绍如何使用<code>webpushr</code>及其对应的插件<code>hexo-web-push-notification</code>来帮我们节省时间完成自动推送更新</p>     HEXO折腾 https://ccknbc.github.io/yun/posts/hexo-toss/ 2020-07-01T00:00:00.000Z 2020-07-01T04:00:00.000Z 个人目前使用主题为Butterfly 3.0.1版本，HEXO 5.0.2版本

    请按照以下步骤依次安装相应依赖和框架

    搭建步骤

    安装 Node.js

    什么是 Node.js ？
    这得从什么是 JS 说起，JS 也就是 JavaScript。（为什么有种从盘古开天辟地开始的感觉）没错，JavaScript 就是网页的盘古。JavaScript 是一种编程语言，我们所见到的网页中的交互和逻辑处理几乎都是由 JavaScript 完成。
    JavaScript 语法简单，易学易用。（当然也请不要小瞧它，虽然它入门门槛低，但上限同样也很高。包括但不限于实现网站前后端，手机桌面应用程序，机器学习，计算机图形学等。）
    在 Node.js 诞生前，JavaScript 都运行于浏览器端。也就是说，它是鱼，浏览器是装满了水的水缸。
    2008 年，Chrome V8 诞生。2009 年，Node.js 诞生。并成为 GitHub 早期最著名的开源项目。GitHub 可能大家已有所了解，后续再说。
    Node.js 便是一个基于 Chrome V8 引擎的 JavaScript 运行环境。（当年第一次看到这句话时，我也一脸懵逼。）按照我的理解，JavaScript 是鱼，Chrome V8 就是抽水机，Node.js 则把这台抽水机也装在你电脑上。于是你的电脑也有了 Node.js 这个和浏览器相似的水缸，也可以在里面运行 JavaScript 了！
    当然 Node.js 和浏览器端还是因为自身定位和一些历史原因而有些许区别的，不再展开。
    Node.js | 百度百科
    JavaScript | MDN

    下载｜ Node.js

    建议下载长期支持版而非当前发布版（因为如果是最新版，容易出现一些奇妙的 bug）。

    全部默认下一步进行安装。

    Windows 打开命令提示符，macOS 打开终端。（= =，这个不会就请百度吧。）
    Linux 用户右上角关闭本标签页。

    后续如提到输入命令，均默认指打开终端进行输入。

    输入 node --version，如果得到的版本号与你方才安装的一致，那么 Node.js 就已经成功安装。

    Node.js 安装成功时也默认安装了 npm，在此后将会用到。
    npm 是随 Node.js 一起被安装的包管理工具，你可以理解成 Node.js 自带的应用商店。

    对了，国内使用 npm 可能很慢。

    你可以考虑切换为 taobao 镜像源。

    npm config set registry https://registry.npm.taobao.org

    npm & yarn 常用包与命令

    Git 与 GitHub

    安装 Git

    Visual Studio Code，简称 VS Code。
    目前最为强大易用的编辑器，轻量且快速。（宇宙第一编辑器）
    注意：它并不是我们常常听到的 VS，VS 常常指的是 Visual Studio，是一个功能强大的 IDE（集成开发环境），体积也相比 VS Code 都要大上一个量级。

    在此之前，我建议你先安装 VS Code。因为安装 Git Bash 时，可以设置 VS Code 作为默认编辑器。

    Git 是一个开源的分布式版本控制系统，由 Linus Torvalds（同时也是 Linux 的作者）为了管理 Linux 开发而开发。
    简而言之，是一个版本管理工具。譬如设计师设计好了第三版的海报，客户却说还是要第一版吧，这时便可以通过 Git 快速回退到最初的版本。
    你只需要把每次更改的状态（Git 会自动进行检测，你只要掌握基础的几条命令就可以了）告诉 Git，而不需要每个版本都保存一份压缩包，既方便也能大大节约空间。
    （当然这主要只对代码文本起作用，因为 Git 的本质是记录各行代码的增减，倘若是像视频、海报这类二进制文件来说便体现不出丝毫优势了。当然想要应对这种场景还有 Git LFS。）

    下载 Git 并安装（如果国内速度太慢，可以试试这里）

    macOS 用户可以下载官网的安装包进行安装，也可以直接安装 App Store 的 Xcode（附带会安装 Git，但是比较大）。

    类似的工具还有：SVN。但始终更推荐 Git，因为它功能更为强大且它的背后还有更强大的生态：GitHub。

    注册 GitHub

    这一部分内容，你也可以放到本地调试并预览成功后并打算线上部署的时候，再回过头来看。

    GitHub 一听便与 Git 有所渊源。Git 在英文中是懒人、饭桶之意。Hub 则是中心、集线器的意思。譬如 USB 集线器就是 USB Hub。所以 GitHub 就是饭桶中心（大雾）。
    GitHub 是全世界最大的开源项目与代码托管平台，也是众多开发者的交流场所。还是全球最大的同性交友网站。
    而代码托管本身用到的正是上文提到的 Git 技术。

    注册 GitHub 账号。（虽然都是英文，但不必畏惧，也并不会造成使用障碍，只要记得最常用的选项含义即可，以及善用手头的翻译软件。）

    注意：注册时的英文用户名将成为你可以使用的免费域名前缀。

    登录 GitHub。

    为什么要用 GitHub？
    对于平民玩家来说，在初次尝试建立自己的网站时，也许并不会有闲钱或者说决心来购买自己的服务器与域名。
    而 GitHub 则提供了 GitHub Pages 这一服务。
    用户们可以利用这一服务，部署自己的静态站点。

    点击右上角的 + -> New repository 新建仓库。

    仓库名称务必为 你的用户名.github.io，用户名是英文，大小写无所谓，但建议统一小写。（因为你会发现时常切换大小写很麻烦）

    为什么必须这个作为仓库名？
    GitHub Pages 服务的命名规范，同时若您没有自己的域名，使用Github提供的服务的话，请务必将此仓库设为公开，同时它也将成为你的专属域名。当然，你也可以购置自己的专属域名并用它来提供内容。

    点击 Create repository。

    安装 Hexo

    Hexo

    为嘛使用 Hexo ？
    Hexo 是一个快速、简洁而强大的博客框架，基于 Node.js，同样托管于 GitHub 之上。生态中拥有众多插件主题。你可以基于它快速生成一些静态页面。
    你可以使用别人的各种主题与插件，也可以自己定制开发想要的功能。
    为什么不是…?
    其他常用的博客框架还有 WordPress，Typecho，Ghost 等，但这些往往都需要购置自己的服务器，而无法静态化地部署到 GitHub Pages 上。（当然，相应的功能和灵活性也大大提升。）静态化站点还有一个优势就是访问速度往往更快。
    静态网站生成器还有 Vuepress，Gatsby 等。但这些多是为了写文档而量身定制的，你也可以使用它们，但是相较 Hexo 的博客定位，它们关于博客的插件和主题以及解决办法会少得多。
    Hexo 提供的功能与 Hugo 几乎都有，（生成大量文件时，甚至比 Hexo 更快）不过它是基于 GO 语言。日后你想对自己的网站进行自定义，即便是 Hugo，你编写前端的交互仍旧需要使用 JavaScript，所以选择基于 JavaScript 的 Hexo 可以降低学习成本。（你若对 GO 有兴趣，仍然可以尝试使用 Hugo，但本教程将不会针对 Hugo 进行展开。）
    所以对于新手来说，使用 Hexo 作为起始点，不失为一个好选择。（当然如果你有钱租服务器，并希望快速上手的话，就可以考虑考虑 WordPress 或者 Typecho）
    这里顺带推荐一下小伙伴 染川瞳 的 WordPress 主题 Sakurairo，阔落 的 Typecho 主题 miracles，都是很漂亮的主题。

    在终端中输入以下命令：

    npm install hexo-cli -g
    # 如果安装失败，可能是没有权限，可以尝试头部加上 sudo 重新执行
    # sudo npm install hexo-cli -g

    install 自然是安装。
    hexo-cli 则是 hexo 的终端工具，可以帮助你生成一些模版文件，之后再用到。
    -g 代表的是全局安装。也就是在任何地方都可以使用，否则会只能在安装的目录下使用。

    此时，请先通过 cd 进入你本地电脑打算存储网站代码的文件夹目录。（或者右键文件夹 Git Bash Here）

    cd | DOS 命令
    cd （LINUXSHELL 命令）

    譬如：

    注意：这里是你自定义的目录，请不要复制粘贴

    # '#' 字符后的文字代表注释，不需要输入
    # Windows
    cd C:\Users\CCKNBC\Documents\GitHub\
    #实际上我用的是D:blog目录,按需选择即可
    # macOS
    # cd /Users/yunyou/github/

    接下来输入：

    hexo init 你的名字.github.io

    hexo 正是因为我们之前安装了 hexo-cli 这一个包，所以我们可以在终端中使用 hexo 这一命令。
    init 初始化博客的模版文件。后面跟的是你要新建的文件夹，最好和你此前新建的仓库名一致。

    # 进入你的博客文件夹
    cd 你的名字.github.io
    # 默认安装所有 `package.json` 文件中提到的包
    npm install
    # 你也可以缩写成 hexo s
    hexo server

    server 代表开启本地的 Hexo 服务器，这时你就可以打开浏览器，在地址栏中输入 localhost:4000 就可以看到本地的网页了。

    按 Ctrl + C 中断服务器的运行。

    至此，基础的模版页面便已经搭建好了。

    主题安裝

    使用 Hexo 主题

    Hexo 默认提供的是 hexo-theme-landscape 主题。
    默认主题样式简单，功能较少。所以大多数人并不会使用默认主题。

    Git 安装

    在博客根目录里安装稳定版master分支【推荐】

    git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

    如果想要安装比较新的dev分支，可以

    git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

    npm 安装

    此方法只支持Hexo 5.0.0以上版本

    在博客根目录里

    npm i hexo-theme-butterfly

    应用主题

    修改hexo配置文件_config.yml（根目录），把主题改为Butterfly（注意配置要和你的主题文件夹名大小写完全一致哦）

    theme: butterfly

    如果你沒有pug以及stylus的渲染器，请下载安装： 

    npm install hexo-renderer-pug hexo-renderer-stylus --save

    在进行配置修改之前，为了以后主题通过git pull平滑升级，请不要随意改动主题源码，虽然你可以通过强制合并来解决，但保险点总是没错的，并且由于主题的**约定>配置特性，因此我们通常在Hexo根目录sorce/_data下把主题的_config.yml（主题目录）复制过来，并且重命名为butterfly.yml**，然后再对butterfly.yml进行修改即可

    有了上面的基础，我们就可以根据对应的**文档**修改相应的配置了,以下不再赘述

    生成静态文件

    至今我们的工作都是在本地进行，想必你也很想放到线上与小伙伴们分享。
    这便轮到了 GitHub Pages 的出场，不过 GitHub Pages 只支持纯静态文件。

    所以我们需要使用以下命令先来生成站点的静态文件。

    # 如果进行多次生成，为了避免受错误缓存影响，最好使用 hexo clean 先清除一遍。
    hexo generate
    # 缩写为 hexo g

    此时你的文件夹目录下会出现 public 这个文件夹，里面存放的就是你站点的静态文件。

    与远程仓库建立关联

    接下来我们将本地的仓库与此前在 GitHub 上建立的仓库建立关联。

    git init # 初始化 Git 仓库，只需要执行一次即可

    在将其部署到 GitHub Pages 上之前，我们最好先建立一个分支。

    什么是分支？
    Git 提供了版本管理功能，其中还有一个分支功能，你现在可以简单地将其理解为平行世界。

    你的名字.github.io 部署后，GitHub Pages 将默认使用你的 master 分支作为静态文件部署。
    所以我们最好新建一个 hexo 分支（命名无所谓）用来存储 Hexo 地源代码，master 分支则用来存储部署后的静态文件。

    git checkout -b hexo

    这时便成功建立了一个 hexo 分支。（此后的工作都将在 hexo 分支下进行）

    你可以通过 git branch -v 来查看当前有哪些分支，使用 git branch 分支名 来切换到对应的分支。

    Git 学习笔记

    部署

    为了更方便的部署到 GitHub Pages，Hexo 提供了 hexo-deployer-git 插件。

    老规矩，安装。

    npm install hexo-deployer-git

    在 _config.yml 中配置。

    deploy:
      type: git
      repo: 你此前新建的仓库的链接 # 比如：https://github.com/YunYouJun/yunyoujun.github.io
      branch: master # 默认使用 master 分支
      message: Update Hexo Static Content # 你可以自定义此次部署更新的说明

    保存，部署！

    第一次可能需要你输入用户名与密码。
    密码输入的时候不会出现 ***，不要害怕，已经输入进去了。

    hexo deploy

    等待完成后，打开网址 https://你的名字.github.io 就能看到你的线上网站了。

    使用 https，http 可能无法正常打开。HTTPS 是多了安全加密的 HTTP，Chrome 浏览器已经默认会显示 http 链接为不安全。
    为了安全，建议开启强制 https 跳转。项目地址页面 -> Settings -> Options -> GitHub Pages -> Enforce HTTPS。（翻到下面）
    此时，http 网址会自动重定向到 https

    备份与自动部署

    我们当前只是将生成的静态文件部署到了云端。

    为了以防万一，我们应该将网站的源代码文件也推送到 GitHub 仓库备份。

    # 与远程 Git 仓库建立连接，只此一次即可
    git remote add origin https://github.com/你的用户名/你的名字.github.io

    接下来准备提交，这几句命令将是你以后每次备份所需要输入。

    # 添加到缓存区
    git add -A
    git commit -m "这次做了什么更改，简单描述下即可"
    # 推送至远程仓库
    git push
    # 第一次提交，你可能需设置一下默认提交分支
    # git push --set-upstream origin hexo

    每次推送都要输入这三条命令，你可能觉得有些麻烦。
    那么你可以编写 bash 脚本。

    譬如，在根目录下新建 update.sh。

    # 如果没有消息后缀，默认提交信息为 `:pencil: update content`
    info=$1
    if ["$info" = ""];
    then info=":pencil: update content"
    fi
    git add -A
    git commit -m "$info"
    git push origin hexo

    此后更新的话，只需要在终端执行 sh update.sh 即可。

    更新麻烦，每次部署也很麻烦，可以使用持续集成进行自动部署。

    什么是持续集成？
    持续集成是一种软件开发实践。对软件进行自动化构建，以此来发现错误。
    Travis CI 就是一个线上持续集成服务的提供商。它可以拉取你每次推送到 GitHub 上的代码，然后根据你的要求对其进行构建。
    我们可以趁机让它自动生成网站静态文件，然后自动帮我们部署。
    除此之外，你还可以使用 GitHub Actions ，Netlify 等服务。
    GitHub Actions 相比 Travis 等，自身便拥有仓库的 Token，不再需要额外设置，可以直接使用 secrets.GITHUB_TOKEN。
    推荐一个专门用来部署 gh-pages 的 Actions actions-gh-pages

    关于更多更具体的自动化部署方案和操作步骤，你可以参考我的小伙伴 ChrAlpha 的 初探无后端静态博客自动化部署方案。

    他在文章中详细介绍了 Netlify 、GitHub Actions 和 Travis CI 的部署方法。

    你也可以参考 Hexo 的官方文档 将 Hexo 部署到 GitHub Pages

    我就不在此画蛇添足。

    当然还有个更简便的方法，直接参考我的 gh-pages.yml。

    去掉夹在 yarn install 与 yarn build 之间的 algolia 部分，直接粘贴到你的 .github/workflows/ 文件夹（自己新建）下 xxx.yml 文件里即可。

    推送后便可直接自动部署。

    至此，你的站点便基本搭建完成，此后继续对主题进行自定义吧。

    开始写作

    文章

    输入以下命令即可新建 xxx.md 文件。

    hexo new post xxx

    md 是 Markdown 的后缀名，是一种简洁方便的文本标记语言。你只需要记住简单的几种语法，就可以快速进行编写。
    为什么使用 Markdown？
    首先 Hexo 本身就是将 Markdown 转化为静态的 Html 文件，来方便用户编写文章。
    Markdown 就好似介于 Word 与 TXT 文本之间。Word 体积大、大部分功能实际上根本用不到，且最后的文档常常带有许多冗余信息。
    而 TXT 却无法实现加粗、标题、下划线、水平分割线等常用的功能。
    （这里所说的 TXT 只是一种纯文本格式的代称，实际上 Markdown 也是纯文本文件，不过通过语法和 Markdown 编译器，我们就可以看到一些简单的样式。）

    譬如本文就是通过 Markdown 编写。

    # 一级标题

    ## 二级标题

    **加粗文字**

    更多语法（虽然说是更多，但是其实也没多少）：Markdown 基本语法

    这是我写的一个 Markdown 样式：star-markdown-css

    上面是渲染过后的效果，你可以与其 Markdown 的纯文本原文进行对比。

    页面

    你可以新建一些自己的自定义页面。

    譬如直接在 Hexo 目录下的 source 文件夹下直接新建 HTML 进行编写。

    也可以通过以下命令来新建页面。（当然还是 Markdown，不过也是可以在 Markdown 里写 HTML 的，也会被渲染出来。）

    hexo new page xxx

    至于对应的参数配置，请参考主题文档

    FAQ

    视频？

    没有视频，一是懒，二是文字更利于更新勘误。

    以及文章中将会频繁出现参考链接，更方便使用。

    如何绑定你的自定义域名？

    首先，你得有个自己的域名。

    避免广告嫌疑，你可以自行前往相关域名提供商购买。
    但是如果你有幸能看到谷歌广告（概率较小），可以考虑点一点。

    并使用 CNAME 解析到 你的名字.github.io。（当然 A 记录直接解析到 GitHub Pages IP 地址也可以。）

    Managing a custom domain for your GitHub Pages site

    在 Hexo 工作目录下 source 文件夹下新建 CNAME 文件（没有后缀名）。

    CNAME 即相当于告诉 GitHub 允许将 xxx.github.io 为你的域名提供服务。
    source 目录下的文件除了特殊的 markdown 会被解析为 html，其余都会原样复制到生成的静态文件夹中。
    所以你需要在 source 文件夹下建有 CNAME，它会在生成静态文件时，将 CNAME 拷贝到静态文件夹并部署到 master 分支。
    如果只是在 GitHub 上设置（项目地址页面 -> Settings -> Options -> GitHub Pages -> Custom domain），它会自动添加到 master 分支上，但随后不包含 CNAME 的部署会将其覆盖。

    内容填写你的域名即可。

    About custom domains and GitHub Pages

    备案

    如果想要使用国内的一些服务，比如 CDN，不备案确实寸步难行。

    此处我指的是 ICP 备案，并非公安备案。（实际上我从来没有进行过公安备案，且目前在使用服务时，并未受到任何相关限制。）

    国内备案往往意味着你还需要一台国内的服务器，譬如通过腾讯云备案时会需要你设置关联的服务器（阿里云应当也是如此）。
    实际上你的网站并不一定得在这台服务器上，即便你只是免费试用了一个月，但是备案成功了，之后过期了对备案也不会有何影响。

    也就是说你完全可以使用学生优惠（10 元左右）购买一个月的云服务器，用于关联，并在这个月内抓紧备案好，此后云服务器过期不会影响备案问题。
    学生优惠的话 阿里云 或者 腾讯云 都有。

    备案前需要注意的几点就是：

    • 确定你的域名是否可以备案
    • 关闭评论区
    • 提交备案时的备注说明不得含有 交流 字样
    • 首页不能含有其他网站的直达链接
    • 遵纪守法无不良信息（这是当然的）

    你也可以直接关停网站，等待备案成功后再重新打开。（今后每年偶尔会复查，但相对会宽松许多。）

    此后，按照网站指引的备案步骤一步步来即可。（以前还要等待幕布寄送拍照，现在可以直接在手机上人脸验证）

    备案成功后页脚必须清晰地展示备案号，且备案号含有指向 http://www.beian.miit.gov.cn/ 的超链接。

    源文件备份

    备份什么？

    百密总有一疏，因此我们需要做好博客源文件的备份，你固然可以直接将整个文件夹打包，但当你后续安装的插件越来越多，你会发现压缩或者解压耗时越来越长，实际上我们只需要备份根目录的几个文件（夹）即可，source文件夹（里面存放着你博客的主要资源），_config.yml（HEXO的配置，如果你不升级HEXO的话，这个也是很重要的），然后就是package.json（和它的名字一样，他能告诉你你安装了哪些插件及其对应的版本），有了这些你就能在另外一台电脑上很快恢复你的博客环境（当然我本人采用了Cloud Studio作为临时环境，也是不错的）

    我的package.json一览，如果其中一些插件你也有兴趣可以按照插件官方说明尝试，这里不做功能注释，虽然总会踩一些奇奇怪怪的坑，但当你慢慢修正时，虽然很折腾，但的确是乐在其中

    {
      "name": "hexo-site",
      "version": "0.0.0",
      "private": true,
      "scripts": {
        "build": "hexo generate",
        "clean": "hexo clean",
        "deploy": "hexo deploy",
        "server": "hexo server"
      },
      "hexo": {
        "version": "5.0.0"
      },
      "dependencies": {
        "cheerio": "^1.0.0-rc.3",
        "cnpm": "^6.1.1",
        "gulp-htmlmin": "^5.0.1",
        "hexo": "^5.0.0",
        "hexo-abbrlink": "^2.2.1",
        "hexo-baidu-url-submit": "0.0.6",
        "hexo-deployer-git": "^2.1.0",
        "hexo-feed": "^1.0.2",
        "hexo-generator-archive": "^1.0.0",
        "hexo-generator-baidu-sitemap": "^0.1.9",
        "hexo-generator-category": "^1.0.0",
        "hexo-generator-index": "^1.0.0",
        "hexo-generator-search": "^2.4.0",
        "hexo-generator-sitemap": "^2.1.0",
        "hexo-generator-tag": "^1.0.0",
        "hexo-render-pug": "^2.1.4",
        "hexo-renderer-ejs": "^1.0.0",
        "hexo-renderer-marked": "^3.0.0",
        "hexo-renderer-pug": "^1.0.0",
        "hexo-renderer-stylus": "^1.1.0",
        "hexo-server": "^1.0.0",
        "hexo-tag-aplayer": "^3.0.4",
        "hexo-wordcount": "^6.0.1",
        "imagemin": "^7.0.1",
        "npm-check": "^5.9.2",
        "terser": "^4.8.0"
      },
      "devDependencies": {
        "gulp": "^4.0.2",
        "gulp-clean-css": "^4.3.0",
        "gulp-htmlclean": "^2.7.22",
        "gulp-imagemin": "^7.1.0",
        "gulp-uglify": "^3.0.2",
        "workbox-build": "^5.1.3"
      }
    }

    备份方式

    不能在一棵树上吊死，所以我选择了多平台备份，分别是Github,Gitee,Coding三个平台，多一个平台，多一份保障，这里注册账号实名认证什么的不再赘述，大家应该都会，注意的一点就是我们建的仓库选择**私有仓库**，不然别人把你md一拷走，就成别人的的了，不过大多数人比较自觉，我们这静态博客，F12源码什么的也看的清清楚楚，爬走很简单，主要靠自觉，防止转载（其实无所谓，秉着开源共享的理念，其实标明出处大家也就不会特别在意）

    首先在博客根目录使用以下命令初始化本地仓库添加一个远程仓库

    git init

    如果本地未显示.git文件夹，请注意打开显示隐藏文件夹

    然后运行 git remote add <shortname> <url> 添加一个新的远程 Git 仓库，同时指定一个方便使用的简写：

    git remote add <shortname> <url>

    比如 git remote add origin git@github.com:CCKNBC/Hexo.git，添加多个仓库地址等更多操作请参考**Git-基础-远程仓库的使用**，按照个人喜好来添加多个仓库地址，我这里全部使用的origin,通过手动添加了coding,gitee的仓库地址，不影响使用就行

    然后我们运行git remote -v查看一下结果，是自己想要的即可

    origin  git@github.com:CCKNBC/Hexo.git (fetch)
    origin  git@github.com:CCKNBC/Hexo.git (push)
    origin  git@e.coding.net:ccknbc/blog/source.git (push)
    origin  git@gitee.com:ccknbc/blog.git (push)

    然后我们就可以推送对应的内容了

    git pull
    git add .
    git commit -m "%date% %time%: Updated By CCKNBC Local"
    git push origin -u

    上面git push origin -u这个是因为第一次推送，我们采取强制推送，如果还是不行我们git push origin -f（因为是第一次无所谓，以后请不要随意使用-f），以后我们只需要git push即可，同时commit的内容请根据实际需要自行修改

    以下是我的.git/config一览,设置好后你可以更换你的第一个url，也就是fetch仓库，根据个人喜好来（或者说网络原因），下面使用的是github的，那么git pull等操作就会按照这个仓库来和本地做比较，选择一个连接比较快的就好

    [core]
    repositoryformatversion = 0
    filemode = false
    bare = false
    logallrefupdates = true
    symlinks = false
    ignorecase = true
    [remote "origin"]
    url = git@github.com:CCKNBC/Hexo.git
    fetch = +refs/heads/*:refs/remotes/origin/*
    url = git@e.coding.net:ccknbc/blog/source.git
    url = git@gitee.com:ccknbc/blog.git
    [branch "master"]
    remote = origin
    merge = refs/heads/master

    在上面的添加多个仓库中，个人因为懒的输入命令，所以直接手动添加的下面两行，反正目的达到就行

    url = git@e.coding.net:ccknbc/blog/source.git
    url = git@gitee.com:ccknbc/blog.git

    然后在配置好公钥的情况下，强制推送即可，至此，你的博客源文件已经推送至你的备份仓库，可以去查看是否有一条强制推送的commit记录了，同时检查是否有theme文件夹（因为涉及到后面的魔改，部分源文件修改，因此我们也做好备份），如果没有，检查主题文件夹是否有.git文件夹，删掉后再次推送即可

    如何优雅的魔改

    在不动主题源文件方便日后升级的情况下，我们大部分采用外部引入css,js的方式实现，同时上传至github，借用jsDelivr提供的CDN加速服务快速引用

    在博客根目录source文件夹下新建一个xxx.js和xxx.css，名字自己取就行，最后我们正确引入即可，在主题配置文件butterfly.yml（下文将直接简写根配（根目录的_confg.yml），主配（主题配置source目录下的butterfly.yml））搜索inject,然后在以下位置插入对应的css和js即可，例如，我是存放在主题文件夹子文件夹css和js内

    inject: 
      head:
        - <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/CCKNBC/ccknbc.github.io@latest/css/ccknbc.css">
      bottom:
        - <script src="https://cdn.jsdelivr.net/gh/CCKNBC/ccknbc.github.io@latest/js/ccknbc.js"></script>

    所以按照上面所说的对应的你的链接即为，其中your name是你的github用户名，请注意根据具体路径变通

    https://cdn.jsdelivr.net/gh/your name/your name.github.io@latest/xxx.css
    https://cdn.jsdelivr.net/gh/your name/your namec.github.io@latests/xxx.js

    若是本地预览就可使用（请根据路径自己修改）

    /css/ccknbc.css
    /js/ccknbc.js

    接下来分别编辑css和js文件即可，当然你可以直接复制粘贴或者直接引用我的链接

    css

    @font-face {
        font-family: 'sleek';
        src: url('https://cdn.jsdelivr.net/gh/lete114/CDN2/zaxiang/sleek.woff2');
    }


    /*标题颜色修改*/

    #page-header #site_title {
        color: #8FBC8F;
    }

    #page-header #site-name.blog_title {
        color: #8FBC8F;
    }

    /* 滚动条 */

    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #8FBC8F;
        background-image: -webkit-linear-gradient( 45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
        border-radius: 2em;
    }

    ::-webkit-scrollbar-corner {
        background-color: transparent;
    }

    ::-moz-selection {
        color: #fff;
        background-color: #8FBC8F;
    }

    #web_bg {
        background: -webkit-linear-gradient(
          0deg,
          rgba(247, 149, 51, 0.1) 0,
          rgba(243, 112, 85, 0.1) 15%,
          rgba(239, 78, 123, 0.1) 30%,
          rgba(161, 102, 171, 0.1) 44%,
          rgba(80, 115, 184, 0.1) 58%,
          rgba(16, 152, 173, 0.1) 72%,
          rgba(7, 179, 155, 0.1) 86%,
          rgba(109, 186, 130, 0.1) 100%
        );
        background: -moz-linear-gradient(
          0deg,
          rgba(247, 149, 51, 0.1) 0,
          rgba(243, 112, 85, 0.1) 15%,
          rgba(239, 78, 123, 0.1) 30%,
          rgba(161, 102, 171, 0.1) 44%,
          rgba(80, 115, 184, 0.1) 58%,
          rgba(16, 152, 173, 0.1) 72%,
          rgba(7, 179, 155, 0.1) 86%,
          rgba(109, 186, 130, 0.1) 100%
        );
        background: -o-linear-gradient(
          0deg,
          rgba(247, 149, 51, 0.1) 0,
          rgba(243, 112, 85, 0.1) 15%,
          rgba(239, 78, 123, 0.1) 30%,
          rgba(161, 102, 171, 0.1) 44%,
          rgba(80, 115, 184, 0.1) 58%,
          rgba(16, 152, 173, 0.1) 72%,
          rgba(7, 179, 155, 0.1) 86%,
          rgba(109, 186, 130, 0.1) 100%
        );
        background: -ms-linear-gradient(
          0deg,
          rgba(247, 149, 51, 0.1) 0,
          rgba(243, 112, 85, 0.1) 15%,
          rgba(239, 78, 123, 0.1) 30%,
          rgba(161, 102, 171, 0.1) 44%,
          rgba(80, 115, 184, 0.1) 58%,
          rgba(16, 152, 173, 0.1) 72%,
          rgba(7, 179, 155, 0.1) 86%,
          rgba(109, 186, 130, 0.1) 100%
        );
        background: linear-gradient(
          90deg,
          rgba(247, 149, 51, 0.1) 0,
          rgba(243, 112, 85, 0.1) 15%,
          rgba(239, 78, 123, 0.1) 30%,
          rgba(161, 102, 171, 0.1) 44%,
          rgba(80, 115, 184, 0.1) 58%,
          rgba(16, 152, 173, 0.1) 72%,
          rgba(7, 179, 155, 0.1) 86%,
          rgba(109, 186, 130, 0.1) 100%
        );
    }



    .layout_post>#post {
        background: rgba(255,255,255,.0);
    }


    /* 鼠标图标 */

    body {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/Jkll8I.png), auto;
    }


    /*a标签*/

    a:hover {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    }


    /*按钮*/

    button:hover {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    }


    /*i标签*/

    i:hover {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    }

    /*页脚a标签*/

    /* #footer-wrap a:hover {
        text-decoration: none;
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    } */


    /*分页器*/

    #pagination .page-number:hover {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    }


    /*头部的导航栏*/

    #nav .site-page:hover {
        cursor: url(https://cdn.jsdelivr.net/gh/lete114/CDN@1.0/Use/JkuClT.png), auto;
    }

    /* a(链接)标签的默认颜色 */


    /* 宽度大于800小于9999执行 */


    /* @media only screen and (min-width: 800px) and (max-width: 9999px) {
        
        #article-container a {
            color: #00c4b6;
            display: inline-block;
            position: relative;
        }
    } */



    /* 打造效果渐变 */

    @-webkit-keyframes Gradient {
        0% {
            background-position: 0 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0 50%;
        }
    }

    @-moz-keyframes Gradient {
        0% {
            background-position: 0 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0 50%;
        }
    }

    @keyframes Gradient {
        0% {
            background-position: 0 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0 50%;
        }
    }

    #subtitle {
        background: linear-gradient(-45deg, #ffecd2, #fcb69f, #84fab0, #8fd3f4,#fddb92,#d1fdff,#e4afcb,#7edbdc,#eea2a2,#7ac5d8);
        background-size: 400% 400%;
        -webkit-animation: Gradient 10s ease infinite;
        -moz-animation: Gradient 10s ease infinite;
        animation: Gradient 10s ease infinite;
        -o-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

    #subtitle:before {
        background-color: rgba(0, 0, 0, 0);
    }

    js

    // 设置页脚博主会动的心
    $(document).ready(function(e){
        $('.copyright').html('©2020 <i style="color:#49B1F5;animation: announ_animation 0.8s linear infinite;" class="fa fa-heartbeat"></i> CC康纳百川');
    })

    if(aidaori()){
        $("html").css({
            "filter":"gray !important",
            "filter":"progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)",
            "filter":"grayscale(100%)",
            "-webkit-filter":"grayscale(100%)",
            "-moz-filter":"grayscale(100%)",
            "-ms-filter":"grayscale(100%)",
            "-o-filter":"grayscale(100%)" 
        });
    }
    //在特定日期变灰
    function aidaori(){
        var aidaoriarr=new Array("0403","0404","0405","0406","0414","0512","0807","0909","1213");
        //2020年4月4日 新冠肺炎哀悼日，清明节
        //2010年4月14日，青海玉树地震
        //2008年5月12日，四川汶川地震
        //2010年8月7日，甘肃舟曲特大泥石流
        //1976年9月9日，毛泽东逝世
        //1937年12月13日，南京大屠杀
        var mydate = new Date();
        var str = "";// + mydate.getFullYear();
        var mm = mydate.getMonth()+1;
        if(mydate.getMonth()>9){
          str += mm;
        }else{
          str += "0" + mm;
        }
        if(mydate.getDate()>9){
          str += mydate.getDate();
        }else{
          str += "0" + mydate.getDate();
        }
        if(aidaoriarr.indexOf(str)>-1){
            return 1;
        }else{
            return 0;
        }
    }

    // 可爱的Title
    var OriginTitle = document.title;
    var titleTime;
    document.addEventListener('visibilitychange', function() {
        if (document.hidden) {
            $('[rel="icon"]').attr('href', "https://cdn.jsdelivr.net/gh/CCKNBC/CDN/logo/ccknbc.png");
            document.title = '(つェ⊂) 我藏好了哦~~';
            clearTimeout(titleTime);
        } else {
            $('[rel="icon"]').attr('href', "https://cdn.jsdelivr.net/gh/CCKNBC/CDN/logo/favicon.svg");
            document.title = '(*´∇｀*) 被你发现啦~~' + OriginTitle;
            titleTime = setTimeout(function() {
                document.title = OriginTitle;
            }, 2000);
        }
    });

    更多类容可以百度，自己DIY，有想法当然要实现啊

    未完待续…

    ]]>     <p><strong>个人目前使用主题为Butterfly <code>3.0.1</code>版本，HEXO <code>5.0.2</code>版本</strong></p> <p>请按照以下步骤依次安装相应依赖和框架</p> <h2 id="搭建步骤"><a href="#     生产实习 https://ccknbc.github.io/yun/posts/production-practice/ 2020-06-29T13:00:00.000Z 2020-06-29T13:00:00.000Z 等待更新中 时间为整点定时发布

    待同步 取消加密

    图片还未上传至图床

    视频嵌入还未做好 YouTube已OK

    目录在左侧

    超声波及温度传感摇摆风扇
    所用元件：

    UNO R3开发板 ×1

    大面包板 ×1

    舵机 ×1

    舵机支架 ×1

    电位器 ×1

    1k电阻 ×1

    USB数据线 ×1

    小风扇 ×1

    摇头风扇支架组件 ×1

    ULN2003AN驱动芯片 ×1

    三色LED ×1

    鳄鱼夹 ×2

    面包线 若干

    开发环境：Arduino IDE,Mind+
    预期要求：

    通过超声波测距和温度传感控制舵机是否旋转，当距离小于30cm或温度大于30℃时在设定的角度之间来回旋转；通过电位器控制电机，小风扇旋转的快慢。

    大致设计思路：
    具体实现源代码：
    //引入库文件
    \#include <Servo.h>//舵机库，之间要有空格，否则编译时会报错。
    \#include <Wire.h> //是I2C通讯的，Arduino和I2C设备通讯使用的(SCLK DIN RCLK) 
    //以下为函数声明
    void zhuan();
    void buzhuan();
    void chaoshengbo();
    void wendu();
    //以下为变量声明及初始声明
    Servo myservo;//定义舵机变量名
    unsigned char jiao;
    const int P=A0;//电位器输入引脚
    const int U=8;
    int sensorValue=0;//电位器电压值
    int outputValue=0;
    // 设定SR04连接的Arduino引脚
    const int TrigPin = 10;
    const int EchoPin = 11;
    unsigned long distance;
    int temp;//温度
    int tol;//校对码
    int j;
    unsigned int loopCnt;
    int chr[40] = {0};//创建数字数组，用来存放40个bit
    unsigned long time;
    \#define pin 2
    //以下为主函数部分
    void setup() //初始设定
    {
     myservo.attach(9);//定义舵机接口
     Serial.begin(9600);//设定波特率为9600 
     pinMode(TrigPin, OUTPUT);// 要检测引脚上输入的脉冲宽度，需要先设置为输入状态
     pinMode(EchoPin, INPUT);
     Serial.println("Ultrasonic sensor:");
     buzhuan();
     chaoshengbo();
     wendu();
     } 
    //以下为循环执行部分
    void loop() 
    {
     chaoshengbo();
     wendu();
     delay(500);
     if ((distance<30) || (temp>30)) 
     {
      digitalWrite(4, LOW);//红灯灭，代表舵机未旋转
      digitalWrite(7, HIGH);//绿灯亮，代表舵机开始旋转
      zhuan();
      chaoshengbo();
      wendu();
      delay(500);
     }
     else if((distance>30) || (temp<30))
      {
      buzhuan();
      chaoshengbo();
      wendu();
      delay(500);
      }
    }
    //以下为函数定义部分
    void zhuan()//定义舵机转
    {
     myservo.write(jiao);
     sensorValue=analogRead(P);
     outputValue=map(sensorValue,0,1023,0,255);
     analogWrite(U,outputValue);
     for(jiao=30;jiao<150;jiao++)
      {
       myservo.write(jiao);//设置舵机旋转的角度 
       delay(10);  
      }
      for(jiao=150;jiao>30;jiao--)
      {
       myservo.write(jiao);//设置舵机旋转的角度 
       delay(10);  
      }
    }
    void buzhuan()//定义舵机不转
    {
     digitalWrite(TrigPin, LOW);
     delayMicroseconds(2);
     myservo.write(jiao);
     digitalWrite(4, HIGH);
     digitalWrite(7, LOW);
     sensorValue=analogRead(P);
     outputValue=map(sensorValue,0,1023,0,255);
     analogWrite(U,outputValue);
     myservo.write(jiao); 
    }
    void chaoshengbo()//定义超声波测距
    {
     // 产生一个10us的高脉冲去触发TrigPin
     digitalWrite(TrigPin, LOW);
     delayMicroseconds(2);
     digitalWrite(TrigPin, HIGH);
     delayMicroseconds(10);
     digitalWrite(TrigPin, LOW); // 检测脉冲宽度，并计算出距离
     //delayMicroseconds(2);
     distance = pulseIn(EchoPin, HIGH) / 58.00;
     Serial.print("距离：");
     Serial.print(distance);
     Serial.print("cm");
     Serial.println();
    }
    void wendu()//定义温度测量
    {
     bgn:
     delay(500);
    //设置2号接口模式为：输出
    //输出低电平20ms（>18ms）
    //输出高电平40μs
     pinMode(pin,OUTPUT);
     digitalWrite(pin,LOW);
     delay(20);
     digitalWrite(pin,HIGH);
     delayMicroseconds(40);
     digitalWrite(pin,LOW);
    //设置2号接口模式：输入
     pinMode(pin,INPUT);
     //高电平响应信号 
     loopCnt=10000;
     while(digitalRead(pin) != HIGH)
     {
      if(loopCnt-- == 0)
      {
    //如果长时间不返回高电平，输出个提示，重头开始。
       Serial.println("HIGH");
       goto bgn;
      }
     }
     //低电平响应信号
     loopCnt=30000;
     while(digitalRead(pin) != LOW)
     {
      if(loopCnt-- == 0)
      {
    //如果长时间不返回低电平，输出个提示，重头开始。
       Serial.println("LOW");
       goto bgn;
      }
     }
    //开始读取bit1-40的数值  
      for(int i=0;i<40;i++)
     {
      while(digitalRead(pin) == LOW)
      {}
    //当出现高电平时，记下时间“time”
      time = micros();
      while(digitalRead(pin) == HIGH)
      {}
    //当出现低电平，记下时间，再减去刚才储存的time
    //得出的值若大于50μs，则为‘1’，否则为‘0’
    //并储存到数组里去
      if (micros() - time >50)
      {
       chr[i]=1;
      }else{
       chr[i]=0;
      }
     }  
    //温度，8位的bit，转换为数值
    temp=chr[16]*128+chr[17]*64+chr[18]*32+chr[19]*16+chr[20]*8+chr[21]*4+chr[22]*2+chr[23];
     //校对码，8位的bit，转换为数值
    tol=chr[32]*128+chr[33]*64+chr[34]*32+chr[35]*16+chr[36]*8+chr[37]*4+chr[38]*2+chr[39];
    //输出：温度、湿度、校对码
      Serial.print("温度：");
      Serial.print(temp);
      Serial.println("℃");
    }

    串口串口显示情况1，此时温度为28℃，距离为275cm左右，都不满足舵机旋转的条件，红色指示灯常亮。

    对应的实际运行情况如下图所示：

    串口串口显示情况2，串口串口显示情况1，此时温度为28℃，距离为5cm左右，满足舵机旋转的条件，绿色指示灯常亮。

    对应的实际运行情况如下图所示

    YouTube：
    ]]>     <p><strong>等待更新中 时间为整点定时发布</strong></p> <blockquote> <p><strong>待同步</strong> <strong>取消加密</strong></p> <p><strong>图片还未上传至图床</strong></p> <p>     基于小波变换的数字水印检测 https://ccknbc.github.io/yun/posts/digital-watermark-detection-based-on-wavelet-transform/ 2020-06-09T12:52:00.000Z 2020-06-09T13:00:00.000Z 数字水印技术原理

    数字水印技术实际上就是通过对水印载体的分析、水印信息的处理、水印嵌入点的选择、嵌入方式的设计、嵌入调制的控制和提取检测方法等相关技术环节进行合理优化，寻求满足不可感知性、鲁棒性和安全性等约束条件下的准最优化设计问题。在实际应用中，一个完整水印系统的设计通常包括水印的生成、嵌入、检测和提取四个部分。

    1 水印生成

    通常基于伪随机数发生器或混沌系统来产生水印信号，从水印的鲁棒性和安全性方面来考虑，常常需要对原水印进行预处理来适应水印嵌入贺认。

    2 水印嵌入

    在尽量保证水印不可感知性的前提下，嵌入最大强度的水印，可提高水印的稳健性。常用的水印嵌入准则有加法准则、乘法准则和融合准则。

    3水印检测

    指判断水印载体中是否存在水印的过程。

    4水印提取

    指水印被比较精确地提取的过程。 水印的提取和检测可以需要原始图像的参与（明检测）， 也可不需要原始图像的参与（盲检测）

    数字水印的分类

    • 按水印的特性
    • 鲁棒数字水印：要求嵌入的水印能够经受各种常用的编辑处理
    • 脆弱数字水印：需要对信号的改动足够敏感，是人们能够根据脆弱水印的状态判断出数据是否被篡改。
    • 按水印的检测过程
    • 明文水印：检测工程中，需要原始数据。普遍来讲，鲁棒性较之盲水印要好。
    • 盲水印：只需要密钥，不需要原始数据
    • 按水印的内容
    • 有意义水印：水印是商标、音频片段等
    • 无意义水印：序列号，仅检测是否含水印
    • 按水印的隐藏位置
    • 空域
    • 频域
    • 时域

    数字水印技术基本上具有下面几个方面的特点：

    —-安全性：数字水印的信息应是安全的，难以篡改或伪造，同时，应当有较低的误检测率，当原内容发生变化时，数字水印应当发生变化，从而可以检测原始数据的变更；当然数字水印同样对重复添加有很强的抵抗性

    —-隐蔽性：数字水印应是不可知觉的，而且应不影响被保护数据的正常使用；不会降质；

    —-鲁棒性：是指在经历多种无意或有意的信号处理过程后，数字水印仍能保持部分完整性并能被准确鉴别。可能的信号处理过程包括信道噪声、滤波、数/模与模/数转换、重采样、剪切、位移、尺度变化以及有损压缩编码等。

    –嵌入容量(embedding capacity)：是指载体在不发生形变的前提下可嵌入的水印信息量。尤其是隐蔽通信领域的特殊性，对水印的容量需求很大。

    tfsmLi.gif

    图1 数字水印嵌入与提取框图

    典型的数字水印算法

    数字水印的技术实现

    空域-LSB

    LSB方法是最简单的嵌入水印的方法。事实上 ，任何一幅 图片都具备一定的容噪性 ，这表现在像素数据的最低有效位(Least Significant Bit，LSB)对 人 眼的视觉影响很 小，秘密信息就隐藏在图像每一个像素的最低位或次低位 ，实现其不 可见性。

    频域

    将图片的灰度强弱，视为图片的频域。通过某种变换手段（傅里叶变换，离散余弦变换，小波变换等）将图像变换到频域（小波域），在频域对图像添加水印，再通过逆变换，将图像转换为空间域。相对于空域手段，频域手段隐匿性更强，抗攻击性更高。

    DCT

    DCT以8x8的像素为单位进行，生成的是8x8的DCT系数数据块。DCT变换的最大特点是对于一般的图像都能够将像块的能量集中于少数低频DCT系数上，即生成8x8DCT系数块中，仅左上角的少量低频系数数值较大，其余系数的数值很小，这样就可能只编码和传输少数系数而不严重影响图像质量。

    小波变换

    “小波”就是小区域、长度有限、均值为0的波形。小波变换就是选择适当的基本小波或母小波ψ(t)，通过对基本小波的平移、伸缩而形成一系列的小波，这簇小波作为基可以构成一系列嵌套的（信号）子空间，然后将欲分析的信号（例如图像）投影到各个大小不同的（信号）子空间之中，以观察相应的特性。这样，就相当于我们用不同的焦距去观察一个物体，可从宏观到微观，从概貌到细节观察得十分详尽。所以小波变换又被称为“数学显微镜”。

    空域+频域

    该算法通过混沌置乱水印图像，建立水印与载体数据之间的Hash单向映射函数，使用两种不同的嵌入方法，先后嵌入水印到空域和DFT域。水印被多次嵌入，实现了水印的盲提取。

    数字水印的应用场景

    • 多媒体作品盗版追溯：利用数字水印的不可见性，在不影响作品的情况下，加入版权信息的数字水印，可抗击拷贝，剪切。
    • 证件的防伪认证：如学历证，合同，票据等，携带数字水印后，可通过制定的方式提取水印，验证证件等数字文件是否被涂改；
    • 阿里事件：阿里追查泄密员工的时间本身，说明，水印可以有效的追溯信息的释放源；
    • 隐蔽信息传递：水印可携带加密信息后，藏在多媒体文件中传播，并通过特定的提取方式获取水印。可以作为一种隐蔽信息的通信方式。

    源程序代码及部分注释

    基础设置模块，同时存储着密钥，全局变量 main.m

    global I ;
    global W;
    global P;
    global Iw;
    ntimes=23; % 秘钥1,Arnold置乱次数
    rngseed=59433; % 秘钥2，随机数种子
    flag=1; %是否显示图像，0 不显示，1 显示

    嵌入水印模块：setdwtwatermark.m

    matlabfunction [Iw,psnr]=setdwtwatermark(I,W,ntimes,rngseed,flag)
    %基于小波变换数字水印嵌入
    %I：载体图像，灰度图
    %W：水印图像，二值图，且长宽相等
    %ntimes: 秘钥1,Arnold置乱次数
    I=imcrop(I,[0 0 size(I,2) size(I,1)-1]);
    type=class(I);
    I=double(I);
    W=logical(W);
    [mI,nI]=size(I);
    [mW,nW]=size(W);
    if mW~=nW
      error('SETDWTWATERMARK:ARNOLD','ARNOLD置乱要求水印图像长宽必须相等！')
    end
    [ca1,ch1,cv1,cd1]=dwt2(I,'haar');
    [ca2,ch2,cv2,cd2]=dwt2(ca1,'haar');
    if flag
      figure('Name','载体小波分解')
      subplot(121)
      imagesc([wcodemat(ca1),wcodemat(ch1);wcodemat(cv1),wcodemat(cd1)])
      title('一级小波分解')
      subplot(122)
      imagesc([wcodemat(ca2),wcodemat(ch2);wcodemat(cv2),wcodemat(cd2)])
      title('二级小波分解')
    end
    Wa=W;
    H=[1,1;1,2]^ntimes; 
    for i=1:nW
      for j=1:nW
    ​    idx=mod(H*[i-1;j-1],nW)+1;
    ​    Wa(idx(1),idx(2))=W(i,j);
      end
    end 
    flag=1;
    if flag
      figure('Name','水印置乱与嵌入')
      subplot(221)
      imshow(W)
      title('原始水印')
      subplot(222)
      imshow(Wa)
      title(['置乱水印，变换次数=',num2str(ntimes)]);
    end
    %数字水印嵌入
    ca2w=ca2;
    rng(rngseed);
    idx=randperm(numel(ca2),numel(Wa));
    for i=1:numel(Wa)
      c=ca2(idx(i));
      z=mod(c,nW);
      if Wa(i)
    ​    if z<nW/4
    ​      f=c-nW/4-z;
    ​    else
    ​      f=c+nW*3/4-z;
    ​    end
      else 
    ​    if z<nW*3/4
    ​      f=c+nW/4-z;
    ​    else
    ​      f=c+nW*5/4-z;
    ​    end
      end
      ca2w(idx(i))=f;
    end
    ca1w=idwt2(ca2w,ch2,cv2,cd2,'haar');
    Iw=idwt2(ca1w,ch1,cv1,cd1,'haar');
    Iw=Iw(1:mI,1:nI);
    mn=numel(I);
    Imax=max(I(:));
    psnr=10*log10(mn*Imax^2/sum((I(:)-Iw(:)).^2));
    I=cast(I,type);
    Iw=cast(Iw,type);
    if flag
      subplot(223)
      imshow(I);
      title('原始图像')
      subplot(224);
      imshow(Iw);
      title(['添加水印，PSNR=',num2str(psnr)]);
    end

    提取水印模块：getdwtwatermark.m

    function [Wg,nc]=getdwtwatermark(Iw,W,P,ntimes,rngseed,flag)
    [mW,nW]=size(W);
    if mW~=nW
      error('GETDWTWATERMARK:ARNOLD','ARNOLD置乱要求水印图像长宽必须相等！')
    end
    Iw=double(Iw);
    W=logical(W);
    ca1w=dwt2(Iw,'haar');
    ca2w=dwt2(ca1w,'haar');
    Wa=W;
    rng(rngseed);
    idx=randperm(numel(ca2w),numel(Wa));
    for i=1:numel(Wa)
      c=ca2w(idx(i));
      z=mod(c,nW);
      if z<nW/2
    ​    Wa(i)=0;
      else
    ​    Wa(i)=1;
      end
    end
    Wg=Wa;
    H=[2 -1;-1,1]^ntimes;
    for i=1:nW
      for j=1:nW
    ​    idx=mod(H*[i-1;j-1],nW)+1;
    ​    Wg(idx(1),idx(2))=Wa(i,j);
      end
    end
    nc=sum(Wg(:).*W(:))/sqrt(sum(Wg(:).^2))/sqrt(sum(W(:).^2));
    flag=1;
    if flag
      figure('Name','数字水印提取结果')
      subplot(121)
      W=imcrop(W,[0 0 size(P,2) size(P,1)]);  
     imshow(W)
      title('原始水印')
      subplot(122)
      Wg=imcrop(Wg,[0 0 122 107]);
      imshow(Wg)
      title(['提取水印，NC=',num2str(nc)]);
    end

    GUI调用模块 watermatk.m

    function varargout = watermark(varargin)
    gui_Singleton = 1;
    gui_State = struct('gui_Name',    mfilename, ...
    ​          'gui_Singleton', gui_Singleton, ...
    ​          'gui_OpeningFcn', @watermark_OpeningFcn, ...
    ​          'gui_OutputFcn', @watermark_OutputFcn, ...
    ​          'gui_LayoutFcn', [] , ...
    ​          'gui_Callback',  []);
    if nargin && ischar(varargin{1})
      gui_State.gui_Callback = str2func(varargin{1});
    end
    if nargout
      [varargout{1:nargout}] = gui_mainfcn(gui_State, varargin{:});
    else
      gui_mainfcn(gui_State, varargin{:});
    end
    function watermark_OpeningFcn(hObject, eventdata, handles, varargin)
    movegui( hObject,'center' );
    handles.output = hObject;%移动窗口到屏幕中心
    guidata(hObject, handles);
    function varargout = watermark_OutputFcn(hObject, eventdata, handles) 
    varargout{1} = handles.output 
    % --- Executes on button press in pushbutton1.
    function pushbutton1_Callback(hObject, eventdata, handles) 
    main
    [filename pathname]=uigetfile({'*.jpg;*.bmp';'*.*'},'请选择底图文件');
    %%打开图像
    I=imread(filename); %读取原始图像
    [filename pathname]=uigetfile({'*.png;*.tif';'*.*'},'请选择水印文件');
    helpdlg('选择完毕，您可点击查看以确认是否需要重新选择','提示');
    I = rgb2gray(I);%转换为灰度图
    W = imread(filename);%读取水印图像
    if strcmp(filename(end-3:end),'tif')
      W= rgb2gray(W);
      W=imbinarize(W);%转化成二值图像
    end
    P=W;
    Mm=size(W,1); %水印的行数
    Nm=size(W,2); %水印的列数
    %将图像扩展为长宽相等
    if Mm<Nm
      Max=Nm;
      Min=Mm;
      for i=Min:Max
    ​    for j=1:Max
    ​      W(i,j)=1;
    ​    end
      end
    else 
      Max=Mm;
      Min=Nm;
      for i=1:Max
    ​    for j=Min:Max
    ​      W(i,j)=1;
    ​    end
      end
    end  
    function pushbutton2_Callback(hObject, eventdata, handles)
    main
    figure('Name','载体图像与水印图像')
    subplot(211);
    imshow(I);
    title('载体图像')
    subplot(212);
    imshow(P);
    title('水印图像') 
    function pushbutton3_Callback(hObject, eventdata, handles)
    main
    [Iw,psnr]=setdwtwatermark(I,W,ntimes,rngseed,0); 
    function pushbutton4_Callback(hObject, eventdata, handles)
    main
    [Wg,nc]=getdwtwatermark(Iw,W,P,ntimes,rngseed,0);

    基于小波的水印技术 运行结果演示

    1图像的选择与导入

    进入GUI主界面

    tfsGAW.png

    图2 GUI主界面

    点击选择图片，分别选择载体图像和水印图像

    tfs4wL.png

    图3 选择底图文件

    tfsHFw.png

    图4 选择水印文件

    两项都选择完毕后提示选择完成，

    tfschv.png

    图5 选择完毕 帮助提示框

    对于取消选择未设置警告与报错提示，防止过多弹窗

    2载体图像小波变换

    这部分未单独新开按钮和图片显示窗口，但程序的确执行了，用户无需知晓

    3水印图像的预处理

    tfs5JR.png

    图6 预处理成二值图像后的水印

    4小波数字水印的嵌入

    tfsAjg.png

    图7 原始水印和置乱水印以及原始图像和添加水印之后的图像对比

    5小波数字水印的提取

    tfs848.png

    图8 原始水印和提取的水印的对比

    将原始水印和提取水印进行对比，两个相关系数为0.99356，相关系数越接近1, 则提取的水印和原始水印越相似。

    ]]>     <p><strong>数字水印技术原理</strong></p> <p>数字水印技术实际上就是通过对水印载体的分析、水印信息的处理、水印嵌入点的选择、嵌入方式的设计、嵌入调制的控制和提取检测方法等相关技术环节进行合理优化，寻求满足不可感知性、鲁棒性和安全性等约束条件下的准最优化设