Clever Geek Handbook

Cloud Age CMS。 実装例

Javascriptで記述されたCMSについての議論を続け、ブラウザで完全に機能し、クラウドに保存します。 理論は以前の記事にありましたが、現在は実践です。 静的サイト用の最もシンプルなシステムを作成しましょう-JSには3つのボタンと100行だけです。



TK：

  1. ウェブサイトホスティング-独自のドメインをコンテナにバインドできるクラウドストレージ。 ファイルを管理するためのHTTP APIをお持ちの方は、Amazon S3、Openstack Swiftプロバイダー、または無料のGitHub Pagesに適しています。 私の場合、 Selectelクラウドになります。 すでにアカウントを持っています。
  2. 視覚的な「インプレース」編集とは、管理者がサイトページ上の要素を直接編集できる場合です。 ページの編集可能な部分は、特別なCSSクラス（「sv」）でマークします。
  3. HTMLページのソースコードの編集モード-WYSIWYGエディターが失敗した場合、またはページ全体のデザインを変更する必要がある場合。


インターフェース：





唯一の問題は、ブラウザーからXmlHttpRequestを介してSelectelリポジトリーにアクセスし、同一生成元ポリシーをバイパスすることです。

Selectelリポジトリ自体はCORSをサポートしていますが、auth.selcdn.ru認証ポイントはこれを誇っていません。 待ち伏せ！ サーバーを介してリクエストをプロキシする必要があります。 Yahoo Tablesの独創的で過小評価された技術が助けとなり、XMLマークアップとJavascriptの混合を使用して簡単なJSONPサービスを作成できます。 「テーブル」は、Yahooサーバーを介して認証リクエストを送信し、成功した場合はストアにキーを返します。

Yahoo Query Language（YQL）の言葉では、すべてが基本です。 

USE 'http://cms.svsite.com/auth.selectel.xml' AS auth; /*   */ SELECT * FROM auth WHERE url='https://auth.selcdn.ru' AND user='' AND key='';


トラフィックはhttpsを経由するため、安全な認証のために通過します。 私はマリッサとNSAを信頼しています。



CMSコードは、ブックマークレットやブラウザ拡張機能など、どこにでも存在できます。 同じSelectelに入れます。 次に、サイトにCMSを「インストール」するには、100行のJavascriptへのリンクを含むHTMLページをアップロードします。 SaaSではないものは何ですか？



要約すると。

テクノロジースタックはいものです。フロントエンドのHTMLとjQuery、Selectelリポジトリ、およびYahoo Tables-バックエンドです。 auth.selcdn.ruがCORSのサポートを開始したら、後者を取り除くことができます。

インターフェース：メインメニューとCKEditorの3つのボタン。 あなたは生きることができます。



CMSコードは、 cms.svsite.com / sv.jsで入手できます。

デモ： demo.svsite.com/admin.html 3341_democms / VdmXrmKpZe

重要！ 最後に保存した人-それとスリッパ。 更新は常にすぐに表示されるとは限りません（CDNキャッシュ）。 デモではすべての機能が利用できるため、誰かが破るまで機能します。



PS。

1.これは概念実証です。

2.コードは開いています-パッチを送信するか、シャットダウンします。

3. Selectel Storageについてのお話をありがとうございます。


More articles:


All Articles