摘要：因本人比較喜歡對(duì)一些技術(shù)文章進(jìn)行收藏，并進(jìn)行整理。搭建獲取鏈接的這里主要使用來(lái)搭建一個(gè)本地的服務(wù)器，畢竟是號(hào)稱分鐘創(chuàng)建一個(gè)完整的應(yīng)用程序的語(yǔ)言。主要的目的是將咱們的文章按每個(gè)月份來(lái)分類。另外，使用將中的數(shù)據(jù)，逐行寫入文件中。

因本人比較喜歡對(duì)一些技術(shù)文章進(jìn)行收藏，并進(jìn)行整理。像Pocket、Evernote這些工具都可以進(jìn)行離線收藏，都是很不錯(cuò)的工具，但我就想把這些喜歡的文章，進(jìn)行收藏整理至github，并且一鍵提交（順便還可以刷刷Github的活躍度），同時(shí)省了自己的時(shí)間，只需要在固定的時(shí)間，對(duì)這些進(jìn)行整理即可。

首先，簡(jiǎn)單得說(shuō)一下自己的需求，根據(jù)每天的閱讀文章通過(guò)每天歸類顯示，并按照每月來(lái)生成文章，具體的文章輸出結(jié)果顯示如2016.01閱讀文章。

這里主要的技術(shù)主要兩個(gè)難點(diǎn)：

一鍵點(diǎn)擊插件的生成

腳本編寫生成對(duì)應(yīng)的markdown

JS來(lái)獲取當(dāng)前文章的標(biāo)題以及鏈接
這里參照百度首頁(yè)鏈接的添加，通過(guò)JS先獲取到document以及l(fā)ocation對(duì)象，然后通過(guò)它倆來(lái)拿到當(dāng)前窗口的鏈接以及標(biāo)題，然后調(diào)用本地服務(wù)的一個(gè)請(qǐng)求，傳遞給本地服務(wù)，來(lái)進(jìn)行當(dāng)前網(wǎng)址的記錄。主要的代碼如下：

javascript: ((function(s, d, e) {
    var u = location;
    var f = "http://localhost:3000/create?link=" + e(u.href) + "&title=" + e(d.title) + "&_t=" + new Date().getTime();
    function a() {
        if (!window.open(f, "", "toolbar=0,status=0,resizable=1,width=700,height=450,left=" + (s.width - 700) / 2 + ",top=" + (s.height - 650) / 2)) u.href = f
    };
    if (/Firefox/.test(navigator.userAgent)) setTimeout(a, 0);
    else a()
})(screen, document, encodeURIComponent));

從上述的代碼可以看到，最主要的代碼就是通過(guò)window對(duì)象來(lái)打開(kāi)一個(gè)新的窗口，指定窗口就是咱們本地的一個(gè)API請(qǐng)求，鏈接格式為http://localhost:3000/create, 以及兩個(gè)參數(shù)link和title，對(duì)應(yīng)咱們生成markdown的內(nèi)容。

這里如何使用呢？在app/views/welcome/index.html.erb中，將上述的Js代碼放置在一個(gè)a標(biāo)簽中，將代碼作為鏈接href屬性的值。啟動(dòng)rails的服務(wù)器，輸入http://localhost:3000/index 就會(huì)顯示這個(gè)相對(duì)應(yīng)的url，我們將其拖拽至我們的書簽欄，則就會(huì)使用我們的插件工具了。

搭建獲取鏈接的API
這里主要使用Ruby on Rails來(lái)搭建一個(gè)本地的服務(wù)器，畢竟是號(hào)稱10分鐘創(chuàng)建一個(gè)完整的Web應(yīng)用程序的語(yǔ)言。

對(duì)應(yīng)的主要代碼目錄在app/controllers/article_controller.rb文件中，通過(guò)api請(qǐng)求http://localhost:3000/create?link={0}&title&{1} 來(lái)獲取需要保存的鏈接，主要代碼如下：

class ArticleController < ApplicationController

  def create
    title = params[:title]
    link = params[:link]
    data = []
    file_name = Rails.root.to_s + "/README.md"
    status = "ok"
    if title.nil? or link.nil?
      status = "error"
    else
      if(Date.today.mday == 1)
        new_file_name = "#{Rails.root.to_s}/#{Date.today.prev_day.strftime("%Y-%m").to_s}.md"
        File.rename(file_name, new_file_name)
        File.new(file_name, "w+")
      end
      data = DataHelper.append_to(file_name, title, link)
      if !data.nil?
        DataHelper.write_to(file_name, data)
      end
    end
    GitHelper.commit(title)
    render json: {"status" => status, "data" => data}
  end
end

上述代碼中，主要的邏輯有三處：

判斷當(dāng)天是否為當(dāng)月的第一天，若是的話，則需要重命名README.md文件為上個(gè)月的文件，形如‘2016-01.md"格式的文件。主要的目的是將咱們的文章按每個(gè)月份來(lái)分類。

通過(guò)DataHelper類來(lái)添加鏈接及其對(duì)應(yīng)的標(biāo)題，可以看到主要通過(guò)DataHelper的append_to和write_to方法來(lái)實(shí)現(xiàn)鏈接標(biāo)題的添加。代碼如下：

module DataHelper

  # 根據(jù)文件獲取添入標(biāo)題和鏈接之后的最新文本內(nèi)容
  def self.append_to(file_name, title, link)
    data = []
    changed = false
    inserted = false

    File.open(file_name).each do |line|
      if !inserted and line.start_with?("###") 
        # 當(dāng)前行為具體的日期
        date_str = line.slice(3, 3 + 10).squish
        if(is_date(date_str))
          # 當(dāng)前日期為今天，則在當(dāng)前天下添加新的一行數(shù)據(jù)
          if(Date.parse(date_str) == Date.today)
            data.push line
            data.push "+ [#{title}](#{link})

"
            changed = true
            inserted = true
          # 當(dāng)前日期小于今天，則新建今天的數(shù)據(jù)
          elsif(Date.parse(date_str) < Date.today)
            data.push "### #{Date.today}

"
            data.push "+ [#{title}](#{link})

"
            data.push "
"
            inserted = true
          end
        end
      end
      if !changed
        data.push line
      end
      changed = false
    end
    # 若沒(méi)有添加，則表示是個(gè)新建的文件，直接添加今天的數(shù)據(jù)
    if(!inserted)
       data.push "### #{Date.today}

"
       data.push "+ [#{title}](#{link})

"
       data.push "
"
    end
    data
  end

  # 向文件中寫入data
  def self.write_to(file_name, data)
    file = File.new(file_name, "w+")
    data.each do |line|
      file.write line
    end
    file.close
  end

  # 判斷字符是否為一個(gè)日期
  def self.is_date(str)
    result = false
    begin
      Date.parse(str)
      result = true
    rescue ArgumentError
      result = false
    end
    result
  end

end

在Datahelper的append_to方法中，是通過(guò)逐行讀取文件，根據(jù)文件對(duì)應(yīng)的日期標(biāo)題，獲取到相應(yīng)的日期，判斷當(dāng)前日期是否大于獲取的日期，大于的時(shí)候則可直接添加，等于的時(shí)候則可在日期下面的第一行中插入，最后我們獲取的將是一個(gè)data的數(shù)組。另外，使用write_to將data中的數(shù)據(jù)，逐行寫入文件中。

Git的自動(dòng)提交，這里實(shí)現(xiàn)的主要的代碼在GitHelper中，其中的代碼呈上：

module GitHelper

  def self.commit(title)
    t = fork do
      Signal.trap("HUP") {
        system "git status"
        system "git add ."
        system "git commit -am "add #{title}""
        system "git pull --rebase"
        system "git push"
      }
    end
    Process.kill("HUP", t) 
  end
end

我們知道Git提交是件耗時(shí)的操作，所以為了提高API的響應(yīng)速度，這里通過(guò)使用異步來(lái)提交Git請(qǐng)求，可以看到使用rebase來(lái)提交請(qǐng)求，所以出現(xiàn)沖突的時(shí)候，我們得自己手動(dòng)解決了。

打開(kāi)項(xiàng)目所在的目錄，使用 rails s來(lái)啟動(dòng)服務(wù)

在瀏覽器中輸入 http://localhost:3000/index 來(lái)顯示我們需要的書簽鏈接，如圖所示；

將上圖中的鏈接拖拽至chrome的書簽欄中，如圖：

點(diǎn)擊fav書簽，就可保存當(dāng)前的頁(yè)面了，并自動(dòng)提交了。

這樣，我們一個(gè)很簡(jiǎn)單的文章記錄加自動(dòng)提交的功能就完成了。當(dāng)然還有許多功能可以做一些擴(kuò)展，例如，可以支持不同的GitHub的倉(cāng)庫(kù)；做成chrome的插件來(lái)方便使用。最后，放上代碼地址：代碼地址

版權(quán)歸作者所有，轉(zhuǎn)載請(qǐng)注明 原文鏈接