智能手機接入小區(qū)管理系統(tǒng)設計和實現 計算機專業(yè)

1、智能手機接入小區(qū)管理系統(tǒng)設計摘 要社區(qū)是社會的一個主要組成部分，社區(qū)自身的成熟對社會整體的進步起著不可言喻的作用。中國經濟飛速發(fā)展的同時，人們對社會基層的成長也提出了新的要求：一是隨著國家綜合實力的不斷增強，社區(qū)工作不再像以前那樣可以“忽略”；二是社會主義市場經濟體制的改革過程中，迫切需要注意黨在基層社區(qū)的建設；三是由于城鎮(zhèn)人口巨大的增長速度，需要優(yōu)化老舊的社區(qū)管理模式；四是隨著人民生活水平的不斷提高，人們開始更加渴望多元化的精神文化建設。在新的時代，應該有更優(yōu)質的社區(qū)建設被實施，來滿足人們在這方面的需求。本文通過研究國內外的相關學術成果，分析了當前時代社區(qū)的發(fā)展情況以及社區(qū)管理模式的異同，并

2、且介紹了當前社區(qū)管理應用的混亂現象。本次設計利用Express框架設計了一個輕量級的應用，使得智能手機接入小區(qū)管理系統(tǒng)。并且應用最新的Manifest技術，無需復雜的操作，即可完成信息的查詢、事件的申報、代理繳費等任務。節(jié)省了大量的人力以及時間資源、降低了處理情況的繁雜度，為智能化社區(qū)的進展添磚加瓦，給居民的生活提供了便利。關鍵詞：Express；Manifest；智能手機The Design of Community Management System with Smartphone AccessAbstract: Community is an important part of soci

3、ety, and the development of the community plays a unique role in the development of the whole society. With the economic development, new requirements have also been put forward for the social base: First, as Chinas comprehensive strength continues to increase, community work at the grassroots level

4、 has become more important; Second, during the reform of the socialist market economic system, there is an urgent need to strengthen the party building at the grassroots level; Third, due to the huge growth rate of urban population, we need to optimize the old community management model.; Fourth, as

5、 peoples living standards continue to improve, peoples demand for material culture and spiritual culture have become more diverse. In the new era, there should be better community building implemented to meet peoples needs.By studying the relevant academic achievements at home and abroad, this artic

6、le analyzed the development of communities and the similarities and differences of community management models. It also introduced the chaos of current community management applications.This design uses Express framework to design a lightweight application, which makes smartphone could access to com

7、munity management system. And with the latest Manifest technology, you can complete information query, event reporting, agent payment, and other tasks without too much operations. It saves a lot of manpower and time resources, reduces the complexity of the processing situation, and contributes to th

8、e upgrading progress of intelligent community, provides so many conveniences for residents daily life.Keywords: Express;Manifest; Smartphone目 錄 TOC o 1-3 h z u HYPERLINK l _Toc515545532 第1章 前 言 PAGEREF _Toc515545532 h 1 HYPERLINK l _Toc515545533 1.1 課題背景 PAGEREF _Toc515545533 h 1 HYPERLINK l _Toc515

9、545534 1.1.1 國內社區(qū)管理近況的分析 PAGEREF _Toc515545534 h 1 HYPERLINK l _Toc515545535 1.1.2 國外社區(qū)發(fā)展情況的研究 PAGEREF _Toc515545535 h 3 HYPERLINK l _Toc515545536 1.2 主要內容 PAGEREF _Toc515545536 h 4 HYPERLINK l _Toc515545537 1.3 預期目標 PAGEREF _Toc515545537 h 5 HYPERLINK l _Toc515545538 第2章 小區(qū)管理系統(tǒng)的需求分析 PAGEREF _Toc515

10、545538 h 6 HYPERLINK l _Toc515545539 2.1 社區(qū)管理系統(tǒng)需求的抉擇 PAGEREF _Toc515545539 h 6 HYPERLINK l _Toc515545540 2.2 社區(qū)管理系統(tǒng)發(fā)展方向的分析 PAGEREF _Toc515545540 h 7 HYPERLINK l _Toc515545541 第3章 小區(qū)管理系統(tǒng)開發(fā)中的主要技術 PAGEREF _Toc515545541 h 9 HYPERLINK l _Toc515545542 3.1 HTML的技術應用研究 PAGEREF _Toc515545542 h 9 HYPERLINK l

11、_Toc515545543 3.2 JavaScript的技術應用研究 PAGEREF _Toc515545543 h 10 HYPERLINK l _Toc515545544 3.3 MongoDB的技術應用研究 PAGEREF _Toc515545544 h 11 HYPERLINK l _Toc515545545 3.4 HTTPS的特點分析 PAGEREF _Toc515545545 h 13 HYPERLINK l _Toc515545546 第4章 小區(qū)管理系統(tǒng)設計與實現 PAGEREF _Toc515545546 h 16 HYPERLINK l _Toc515545547 4.

12、1 小區(qū)管理系統(tǒng)總體設計 PAGEREF _Toc515545547 h 16 HYPERLINK l _Toc515545548 4.2 后端數據接口設計 PAGEREF _Toc515545548 h 17 HYPERLINK l _Toc515545549 4.3 前端界面設計 PAGEREF _Toc515545549 h 19 HYPERLINK l _Toc515545550 4.4 智能手機接入小區(qū)管理系統(tǒng)測試 PAGEREF _Toc515545550 h 23 HYPERLINK l _Toc515545551 結論 PAGEREF _Toc515545551 h 27 HY

13、PERLINK l _Toc515545552 致謝 PAGEREF _Toc515545552 h 28 HYPERLINK l _Toc515545553 參考文獻 PAGEREF _Toc515545553 h 29第1章 前 言1.1 課題背景隨著新時代的到來，物業(yè)管理越來越受到人們的重視，人們對美好生活環(huán)境和服務要求也不斷增加，小區(qū)服務直接關系到人們的獲得感、幸福感。在這種情況下，更好更便捷的社區(qū)管理和服務能為社區(qū)居民營造一個全方位的理想生活氛圍，展示出中國城市的新時代的人類風采。進入到21世紀，中國城市地區(qū)的居民委員會都被上級組織勒令重建，它們的新名字中多了“社區(qū)”一詞。原本黨政性

14、質濃厚的居民委員會在此之后，社區(qū)服務所占的成分越來越大，所以“新版”居民委員會的門外會額外加一塊“社區(qū)服務中心”的牌子。在上海市，由于存在著許多蜿蜒交錯的巷弄，社區(qū)的概念一般用于指稱街道辦事處的轄區(qū)“街道”，通常為一個街道設置一個社區(qū)服務中心。國內的一些道路復雜的地區(qū)在社區(qū)服務實踐過程中，也借鑒了上海的經驗，同時因地制宜，提出了帶有本地特色的社區(qū)服務管理模式，為當地居民的日常生活提供了不少的幫助。農村地區(qū)也受此影響，衍變出了不同的特征。查閱分析我國已“升級”的新型農村社區(qū)的新聞資料，可將其總結為以下2種：單獨型，這類社區(qū)內的居民基本上是原來村莊的大部分村民，社區(qū)由原來的村莊單獨改建；整合型，這

15、類社區(qū)基本是多個鄉(xiāng)村重新組成的一個整體，居民來自于不同的村落。與傳統(tǒng)的村莊相比，新型農村社區(qū)有很多地方需要新居民去適應：集中居住的樓房，管理層級的調整，公共空間的合理使用，個人生活的隱私，農忙季節(jié)農產品的晾曬去雜等（GreenMeansGo，2018）。由于物業(yè)管理涉及的管理范圍較為廣泛，管理內容繁雜，日常工作需要耗費大量人力、財力、物力，而借助因特網，采用現代化計算機管理手段來提高物業(yè)管理的效率、降低物業(yè)管理的成本，是一種行之有效的解決辦法（陳長江 等，2006）。1.1.1 國內社區(qū)管理近況的分析中國房地產經過了迅猛發(fā)展的十余年，據有關統(tǒng)計，中國的物業(yè)管理公司大致有10500家，具有高級資

16、質的僅占到1/10，從業(yè)人員達到700萬人，可見體系之龐大。然而一些不正當服務、不合理收費的現象依舊存在，管理系統(tǒng)的低效沒有解決，物業(yè)管理、社區(qū)居民和周邊店鋪沒有發(fā)展成為一個互利互惠的整體（閆立朝，2016）。分析部分資料總結出，當前社區(qū)管理存在的問題主要體現在以下幾個方面：（一）社區(qū)管理體制存在問題現行的社區(qū)管理體制改革不夠徹底，政府的負擔仍舊不小。社區(qū)自治實際處于一種“傀儡”的情況之下。在當前的社區(qū)自治的實踐發(fā)展中，社區(qū)的自治地位越來越凸顯出來，這賦予了社區(qū)居民更多的權力，但在另一方面也意味著大量行政權力的上交，以至于社區(qū)管理體制下的諸多權力名存實亡。在這種情況下，社區(qū)自治和社區(qū)服務職能難

17、以成為社區(qū)工作的主要內容，職能缺位與越位交叉的現象十分嚴重。在改革開放后，居委會體制并未出現全局性變化，行政權威性弱化，職權、人力、財力、物力等的匱乏，導致很多看似容易的工作難以開展（張文彪，2018）242。（二）社區(qū)管理工作隊伍專業(yè)化程度低現如今，隨著城市單位體制的逐步弱化，越來越多的社會職能會不可避免地回歸到社會，社會事務也逐步由社區(qū)來承擔。但是社區(qū)管理工作的輻射范圍廣泛，涉及到的具體事務繁雜且專業(yè)化和綜合性較強，這就需要社區(qū)工作者具備相應的文化社區(qū)管理方面專業(yè)知識與之匹配。社區(qū)管理工作并沒有正規(guī)的人才引進渠道，相當一部分是臨時工，社區(qū)管理工作的服務質量深受影響（張文彪，2018）242

18、。（三）社區(qū)組織管理法律制度不近完善目前我國城市社區(qū)管理的法制建設還不夠健全，職責交叉而導致管理混亂，相應的管理制度尚未真正建立。社區(qū)自治組織的職責范圍模糊，與物業(yè)公司、政府部門、業(yè)主委員會這三方之間的聯動和權力邊界不清晰且無明確規(guī)定，容易出現執(zhí)行機構權責分配不均的現象。社會組織層面來看，社會中介組織發(fā)展緩慢，居民委員會等自治組織的作用尚未得到充分地發(fā)揮，社區(qū)居民參與率低，積極性不夠，社區(qū)內的溝通交流機制也有待完善（張文彪，2018）242。（四）社區(qū)服務資源不足目前，我國的社區(qū)的服務設施嚴重缺乏，許多社區(qū)居委會和黨群服務中心等辦公場所難以達到國家標準。社會服務的財物來源于政府，但現實中的社會

19、服務經費并未完全列入政府預算，許多工作由于缺乏經費最后終止。并且由于社區(qū)之間難以共享資源，使得一些社區(qū)持有的資源未得到充分利用，資源閑置現象嚴重，社區(qū)資源整合程度低（張文彪，2018）243。1.1.2 國外社區(qū)發(fā)展情況的研究“A community is a social unit that shares common values, or a group of interacting living organisms sharing an environment.”這是維基百科的對于社區(qū)一詞的釋義，更能體現出外國人對于社區(qū)的認知。國外的社區(qū)發(fā)展相對國內早一些，使用“planned comm

20、unity”的方法來規(guī)劃建立的占絕大多數。“planned community”的特點是預先策劃、整齊明晰，大多數建立在未開發(fā)的綠地之上，例如芬蘭的瓦薩、澳大利亞的堪培拉，都是典型。而最具代表性的“planned community”則是斯洛伐克的帕蒂贊斯克，設施齊全得更像一個小型城市。它于1938年和一座制鞋工廠一起被建立在一片平原之上，社區(qū)內的絕大多數成年人都任職于這個工廠（Sobreira，2018）。帕蒂贊斯克的俯瞰圖如圖1-1所示。圖1-1 帕蒂贊斯克經過時間的沉淀，在外國的社區(qū)管理模式中，美國的自治型社區(qū)管理模式、日本地區(qū)的混合型社區(qū)管理模式以及新加坡的政府主導型社區(qū)管理模式這三種

21、發(fā)展成為了標志性的社區(qū)管理模式類型，其管理特色值得參考。自治型社區(qū)管理模式：在這種管理模式下，政府行為和社區(qū)行為是沒有直接關系的，社區(qū)的工作完全自治，無論是聯邦政府還是地方政府都沒有權利干預社區(qū)事務。政府有關部門提供專項撥款，社區(qū)要進行一定的配合，同時通過各類社會團體及基金會來籌措一定的經費。社區(qū)的高度自治使得美國社區(qū)管理基本上是“政府規(guī)劃、指導、資助，社區(qū)組織具體實施的運行方式”（李玉杰 等，2018）138?；旌闲蜕鐓^(qū)管理模式：日本受西方文化傳統(tǒng)的影響形成了混合型社區(qū)管理模式。政府負責對社區(qū)的規(guī)劃、指導和經費支持，政府管理和自治特征相結合。地域中心和社會團體組織相互配合，給社區(qū)自治、社區(qū)管

22、理及其發(fā)展提供較大的發(fā)展空間。日本混合型社區(qū)是一種雙向管理模式，是政府行政管理部門和民間管理組織之間的共同協(xié)作（李玉杰 等，2018）139。政府主導型社區(qū)管理模式：新加坡是一個文化多元化的國家，有著多種民族、宗教和文化傳統(tǒng)，因此社區(qū)建設不僅要注重社區(qū)物質建設，更重要的是加強社區(qū)文化建設。新加坡根據地域范圍劃分為若干個社區(qū)發(fā)展理事會，負責實施本地域內的管理工作，社區(qū)發(fā)展理事會下設多個選區(qū)，按照選區(qū)為單位設立公民咨詢委員會，負責與政府溝通，維護居民權益。社區(qū)管理的最基層組織是居民委員會，全國社區(qū)的總機構是人民協(xié)會，是一個半官方性質的社區(qū)管理機構，具有法定地位。這種管理模式的社區(qū)主要經費來源于社會

23、贊助和政府撥款（李玉杰 等，2018）139。1.2 主要內容最近這幾年，我國在各地的社區(qū)管理領域實施了多項有創(chuàng)新意義的試驗，取得了相當大的進步。但這并不代表著人們對現在的社區(qū)管理服務已經心滿意足，正面面對并想辦法解決社區(qū)管理過程中發(fā)生的問題，才是正確、科學的方式。本文主要介紹的是智能手機接入小區(qū)管理系統(tǒng)設計。利用JavaScript、HTML等語言設計、創(chuàng)建一個簡易的小區(qū)管理系統(tǒng)，以瀏覽器為基礎運行平臺，實現智能手機接入小區(qū)管理系統(tǒng)設計，為用戶提供清爽的界面體驗以及實用的功能，讓居民更切實地感受到互聯網時代的信息技術給生活帶來的便捷、舒適和安全。網頁應用相比于通常的原生應用更為輕量，能為用戶

24、帶來更好的體驗，而且可以通過改造升級為PWA，提供更完善的功能；此外，無需為不同設備的操作系統(tǒng)而做出不同的適配版本，因為應用是工作在瀏覽器上的，可以多平臺共通。1.3 預期目標通過使用本應用，加強業(yè)主方與物業(yè)方之間的配合，減少不必要的摩擦和人員派遣，能夠為業(yè)主提供更舒心的社區(qū)環(huán)境，能夠為物業(yè)方提供更為有效率的管理能力，可謂是兩全其美。在系統(tǒng)開發(fā)過程中可以根據實際的需求，適當地增刪功能，現計劃完成以下幾個主要的目標：1.發(fā)布小區(qū)的重要消息、緊要告示，以及日常生活的實用信息；標示社區(qū)周邊的一些重要場所，如醫(yī)院、五金店等。用戶通過點擊新聞標題，可以獲取到更為詳細的內容。2.業(yè)主的維修投訴頁面，住戶通

25、過填寫描述信息，把具體情況傳達給物業(yè)方，物業(yè)方根據事件的種類、緊急程度等調度相關人員，更為有效地處理業(yè)主所遇到的問題，為業(yè)主提供優(yōu)質的服務。3.日常繳費功能，住戶可以填寫準確信息來完成網上的代繳費，節(jié)省了不少時間。4.貼心服務功能，物業(yè)方能夠依據住戶填寫的信息，代替住戶完成一些任務，例如，臨時保管物品、特別關照老人子女等。第2章 小區(qū)管理系統(tǒng)的需求分析2.1 社區(qū)管理系統(tǒng)需求的抉擇經過第一章的分析，可以發(fā)現國內外的社區(qū)管理確實有很多不同之處，但這并不意味著其就沒有值得借鑒學習的地方。每種社區(qū)管理模式在當地獨有的政治、經濟和文化的影響下，不斷進化。每種成熟的管理模式都有其存在、發(fā)展至今的能力，只

26、有吸取國外的優(yōu)秀方式，再結合本地特色稍加修改，才能創(chuàng)造出和諧高效的社區(qū)管理手段。表2-1具體展示了幾種典型模式之間的差別。表2-1 不同社區(qū)管理模式主要特點比較一覽表 類型特點自治型管理模式混合型管理模式政府主導型管理模式管理權力主體社區(qū)及自治組織社區(qū)和政府共同設立管理機構政府設立管理部門為主導政府社區(qū)關系完全分離部分分離完全結合居民參與意識極強較強較弱管理運行機制社區(qū)組織廣泛參與政府支持，社區(qū)居民參與共同管理政府主持管理社區(qū)管理性質社會占主導地位政府和社會相協(xié)同政府主導借著互聯網時代的優(yōu)勢，不少管理類型的應用出現在人們面前，幫助業(yè)主去參與社區(qū)事務，但是需要坦承的是，這些應用所提供的功能卻使其

27、更像是一個購物類應用，并且廣告的布置、插入也極大地降低了用戶的使用體驗以及使用欲望。居民需要切實地感受到互聯網時代信息技術給生活帶來的便捷、舒適和安全，但是這樣的“特色”卻“喧賓奪主”得有些明顯。讓社區(qū)的業(yè)主更多的參與進社區(qū)組織的健康向上的樂趣活動，不僅能夠增強業(yè)主與社區(qū)之間的聯系，而且可以豐富本地社區(qū)的精神屬性，營造出欣欣向榮、積極向上的生活氛圍。此外，社區(qū)內部的組織也能借此機會宣傳自己的優(yōu)勢及作用，給予社區(qū)的業(yè)主列出更多的選擇。社區(qū)管理機構需要更用心地協(xié)調政府與居民的關系，處事不能過于強硬、冷漠，要讓社區(qū)內的居民更好地理解政府的相關政策、規(guī)范，要更順滑地推行相關的措施方法，要更積極地舉辦陽

28、光有趣的活動，要更友善地處理鄰里之間的小摩擦，更有效地解決社區(qū)內發(fā)生的問題，讓居民全身心地體會到社區(qū)生活的美好。2.2 社區(qū)管理系統(tǒng)發(fā)展方向的分析新時代的科技發(fā)展日新月異，社會生產中的大多數行業(yè)都可以看到智能化管理的影子AI更是一個燙手山芋，為社會的進步獻出了不可忽視的力量。其中，現代社區(qū)管理的智能化實踐引起了社會各界人民的高度重視。在黨的十九大報告中提出社會治理“社會化、法制化、智能化、專業(yè)化”要求的背景下，類型多樣化的國際化社區(qū)治理對于探索復雜社區(qū)治理的有效形式和路徑、推動形成更具包容性的城市發(fā)展形態(tài)具有極強的前瞻意義。通過對先進地區(qū)試點經驗的調查和分析，可以看出中國正以開放的創(chuàng)新意識和強

29、有力的執(zhí)政規(guī)劃，借助豐富的黨群政治資源，充分發(fā)揮社會組織和專業(yè)隊伍的力量，將中國的制度優(yōu)勢轉化為具體的社會治理效能（樊鵬，2018）57。新型社區(qū)治理，發(fā)揮著推動地方當局進行主動積極改革的作用城市管理者和基層官僚隊伍會做出基于行政能力自保的理性選擇。引入大量專業(yè)機構為街道以下的黨組織和居委會分憂，發(fā)展其成為居民服務供給的主體，是現有體制下的“唯一”選項，有利于把基層黨組織從具體、繁重的社區(qū)事務之中解放出來，也更有利于培育出健康高效的專業(yè)社會力量。從另一個角度來看，建設出高品質多元化的智能社區(qū)、留住高科技的專業(yè)人才，是帶動地區(qū)產業(yè)升級和高端服務業(yè)發(fā)展的引擎，是推動城市向更高層次發(fā)展轉型的有效手段

30、之一（樊鵬，2018）63。受到互聯網急速發(fā)展的影響，很多家具也已經邁入了一個新的紀元它們變得更加“聰明”，能理解使用者發(fā)出的一些“復雜”的要求，而社區(qū)管理同樣也借著智能化管理煥發(fā)了“新生”。小區(qū)車輛的智能識別、網上繳費、智能門鎖、社區(qū)WIFI等，這些新技術逐步融入人們的生活之中，給人們帶來了更好的生活體驗。現在，互聯網通過光纖把世界各地的人們串聯起來；琳瑯滿目的應用層出不窮，提供了諸多實用的功能，改變了人們的生活方式。而智能化社區(qū)，則在持續(xù)地提供新穎的服務，給人類帶來更優(yōu)質的生活品質。未來，社區(qū)管理系統(tǒng)必將更緊密地與智慧家居結合起來，在一個地方，用戶就能處理和社區(qū)日常生活相關的事物、為自己設

31、計出一個理想的生活環(huán)境。第3章 小區(qū)管理系統(tǒng)開發(fā)中的主要技術3.1 HTML的技術應用研究HTML（Hypertext Markup Language）超文本標記語言不是一種標準的編程語言；它是一種標記語言，它會教導瀏覽器如何去渲染將要訪問的網頁，目前主要使用的是它的第5個版本HTML5，公開于2014年。它可以變得復雜，也可以變得簡單，這取決于開發(fā)者的選擇。HTML的“基本成員”是元素，它能夠包裝或標記內容的不同部分，使其按照預先設計好的形式呈現在文檔樹中。HTML由位于第一行的“”聲明，如果沒有聲明或者聲明寫錯了，瀏覽器就沒有辦法正常渲染頁面，一個最簡單的HTML文件的結構如圖3-1所示。

32、圖3-1 HTML的結構物理學家Tim Berners-Lee在歐洲核研究組織工作時，為科學家們設計出一種可以在因特網上共享文件的方法，但是其介質只能是通過郵件、FTP等來傳輸的純文本文件。早期版本的HTML也試圖加入SGML大家族，但在HTML4之前的語法并沒有嚴格地遵守SGML的標準因為HTML的定義就是“松散的”。SGML是一種語法及其復雜的標記語言，已經不再適應于現代互聯網的高速發(fā)展。因此，作為主管的W3C在制定新一代HTML標準時，決定脫離SGML的語法限制，把語言風格明朗化、簡潔化，讓其淺顯易懂，并且延續(xù)了部分HTML4的風格。開始標簽把一個約定好的值元素名括在尖括號內，它表示這個

33、元素在此生效；結束標簽與開始標記基本上是相同的，但多了一個正斜杠，它代表這個元素在此“收場”。內容在獨特的元素中有不同的含義，如在圖3-2中代表著一段文本。上述的各個“部分”拼接起來便構成了一個簡單的元素。不同類型的元素都有各自獨有的特點，也有共通的地方，這也是W3C所期望的“responsive”。元素也能夠獲得額外的屬性，屬性包含元素的一些附帶的、或是自有的有用的信息，不過這些重要的信息并不會直接展示給訪問的瀏覽者，通常被開發(fā)者用來設計網頁內各區(qū)塊的樣式以增強視覺效果。圖3-2 一個簡單元素的結構因為HTML的處理對象是瀏覽器，所以它可以在不同的系統(tǒng)上給用戶帶來大致一樣的內容呈現如果使用同

34、款瀏覽器的話，同時會為不同的界面（分辨率）做出不同程度的自適應以提供更好的用戶體驗（Pachinko，2018）。3.2 JavaScript的技術應用研究JavaScript是世界上最流行的腳本語言，因為在互聯網上能夠瀏覽到的全部網頁以及衍生的HTML5應用的交互邏輯都是由JavaScript實現的。1995年，美國的網景（Netscape）公司憑借Navigator瀏覽器成為了人類邁入Web時代后最有名的第一代互聯網公司。后來，網景公司想讓一些動態(tài)反饋可以在靜態(tài)網頁上體現出來，使網頁看起來“富有生命力”，讓網頁能夠與使用者“互動”。Brendan Eich因此受命設計一種新的編程語言去實現

35、這個目標，也就是JavaScript。經過十幾年的發(fā)展，所有現代的HTML頁面都使用JavaScript來增強用戶與Web站點和Web應用程序之間的交互（Canon，2017）。與HTML不同，JavaScript是輕量級的解釋型編程語言。通過編寫不同的代碼，可以創(chuàng)建動態(tài)更新的內容，控制頁面渲染的內容，以及更多。AngularJS是一個基于JavaScript的開源前端Web應用程序框架，于2009年被開發(fā)出來，后來被Google公司收購?，F在主要由Google的AngularJS團隊和開發(fā)者社區(qū)來維護，以解決開發(fā)單頁面應用程序時所遇到的許多問題。AngularJS調整、改寫了部分標準的HTM

36、L標簽和屬性，在降低代碼復雜度的同時，增強了腳本代碼的可讀性。得益于雙向的數據綁定，網頁中的一部分數據會被AngularJS拿來與JavaScript對象中對應的值對比、更新。為了創(chuàng)建更易于測試的開發(fā)項目，AngularJS會誘導渲染引擎去處理依賴注入和交換控制。它還使用承諾（Promise）和延遲對象（defer）優(yōu)化處理原本復雜的異步回調過程（Aqra，2018）。2014年，原本的AngularJS團隊開始開發(fā)新一代Angular應用平臺Angular 2.0，并通知各位開發(fā)者將會于2018年7月發(fā)布AngularJS的長期支持版本1.7。盡管AngularJS的版本停止在了1.x，但是

37、這并不代表著它是一個落后、難以使用、性能差勁、被拋棄的框架，世界上仍有10%左右開發(fā)者依然選擇AngularJS作為他們的前端框架，社區(qū)中的討論也在繼續(xù)。Node.js問世于2009年，是一個基于Chrome V8引擎的JavaScript運行環(huán)境。 Node.js使用的是由事件驅動的、非阻塞式I/O的事務處理模型。JavaScript其實是一個完整的編程語言雖然在有些地方的規(guī)范不夠“嚴謹”。由于部分前端開發(fā)者通常寫得沒有那么規(guī)整，給人們留下了“JavaScript就是個玩具語言”的壞印象。如果模塊化的JavaScript代碼運行在Node.js上的話，開發(fā)者就完全沒有解決瀏覽器兼容性問題的后

38、顧之憂，并且能夠使用最新的ES6語法標準，完全滿足工程上的需求，足以設計出高性能的Web服務（佚名，2018）。Express.js是世界上最流行的基于Node.js的開源web框架，它高度包容、快速而極簡的，無需繁瑣的設置即可建立出表現優(yōu)秀的網站。各大論壇中關于它的討論帖的數量是一個巨大的數字，開發(fā)者們沒有任何理由不選擇它作為一個輕量級應用的“后盾”（佚名，2018）。3.3 MongoDB的技術應用研究MongoDB（Mongo Database）是使用C+語言編寫的一個基于分布式文件存儲的開源數據庫系統(tǒng)。MongoDB不是傳統(tǒng)的關系型數據庫管理系統(tǒng)。在操作相當大量的數據時，NoSQL類數

39、據庫能夠比傳統(tǒng)的關系型數據庫展現出更優(yōu)秀的表現。目前比較流行的Python，Java等多種語言都在MongoDB的支持列表中, MongoDB還為市場上主流的操作系統(tǒng)推出了各自的版本。NoSQL是“Not Only SQL（不僅僅是SQL)”的簡寫形式。在2009年的一次關于分布式開源數據庫的會議上，來自Rackspace的Eric Evans把“NoSQL”再次引入人們的視線，此刻的“NoSQL”代表的是非關系型、分布式、沒有提供“ACID”的數據庫設計模式。同年，“no:sql(east)”在亞特蘭大召開，它揮出了這項革命性運動的最濃墨重彩的一筆讓世界再次意識到NoSQL類數據庫的優(yōu)勢。對

40、彼時風靡全球的關系型數據庫來說，這一概念在全球范圍內的盛行無疑讓人們瞠目結舌。時至今日，對“NoSQL”一詞最準確的解釋是，非關聯類型的，強調Key-Value Stores和文檔數據庫的優(yōu)點，而不是單純的反對傳統(tǒng)的關系數據庫管理系統(tǒng)（佚名，2018）。隨著互聯網上RIA網站的涌現，傳統(tǒng)的關系數據庫在配合新型網站，尤其是超大規(guī)模、高并發(fā)式的網站時已經有些招架不住，暴露出來不少的問題。而“新”的非關系數據庫則借此機會取得了相當快速的進步，扎實地壯大自己的“根基”，開始蠶食原先由傳統(tǒng)的關系數據庫管理系統(tǒng)占據主要份額的全球市場。目前比較成熟的NoSQL類數據庫有Hbase，Redis，MongoDB

41、以及Neo4J等。盡管它們都屬于NoSQL，但是每個庫仍是不同的類型，例如Hbase是列存儲類型，而MongoDB是文檔存儲類型，Neo4J則是圖存儲類型。MongoDB不限制每個鍵對應的值的數目。比如一個新聞網站，有些新聞沒有讀者評論，那么它的值就是一個空集；有的新聞引發(fā)了讀者的熱烈討論，那么它的值就是擁有很多鍵值對的集合。除此之外，MongoDB沒有規(guī)定同一個集合里面的不同文檔必須要有相同的鍵。還以上面那個例子來說，有的文章可能沒有開放評論，不過這些不同的文檔都可以方便地存儲在MongoDB中，而且查詢起來也相當輕松，因為操作者不需要進行跨文檔查詢。MongoDB會把數據集中存放在一處，填

42、充著數據的許許多多的鍵值對構成了它的數據結構，這與JSON文件的格式很像。前文曾經提到過JavaScript對于網頁的重要性，因此，MongoDB的數據和應用所使用的數據可以說是“無縫銜接”，這免除了很多轉換格式帶來的惱人問題。MongoDB中基本的概念，如圖3-3所示。圖3-3 MongoDB 特點Node.js和MongoDB能夠建立完整的“REST”服務?！癛EST”是一種基于HTTP定義一組約束和屬性的架構風格，它允許開發(fā)者使用固定的接口輔助完成客戶端與服務器的通信過程。在REST風格的Web服務中，對URI的請求將觸發(fā)XML、JSON或其他格式的響應返回。響應可以確認對已經存儲的資源

43、進行的更改，并且能夠提供到別的有關聯的頁面的URL。除了基礎的自帶命令行工具，MongoDB同樣支持多種可視化工具來對存儲的數據進行各項操作，官方提供MongoDB Cloud Manager、MongoDB Compass，第三方軟件也有很多，如mongo-express、MongoChef、Robo 3T。這些可視化工具減少了操作人員對于命令語句的依賴，大大降低了工作時的復雜度。3.4 HTTPS的特點分析HTTP（Hypertext Transfer Protocol）超文本傳輸協(xié)議是一種能夠獲取網絡資源的通訊協(xié)議?，F代網絡上發(fā)生的數據的交換都依賴于它。HTTP網絡通信的幾個關鍵組成部分

44、如圖3-4所示。圖3-4 HTTP網絡通信HTTPS（Hypertext Transfer Protocol Secure）超文本傳輸安全協(xié)議是一種通過計算機網絡進行安全通信的傳輸協(xié)議。HTTPS的底層雖然使用HTTP實現網絡通信，但是它會使用SSL或者TLS來加密需要傳輸的數據包。大多數人知道，或者至少懷疑，通過公共互聯網連接購買物品是不明智的，但他們可能并不知道原因所在。其中一個原因是潛在的“中間人攻擊”中間人攻擊是指有人把他自己插入到用戶和用戶正在訪問的網站的中間，并通過模仿雙方來獲取訪問敏感信息的權限，如密碼、信用卡數據。舉個簡單的例子，Ann在她最喜歡的咖啡店瀏覽百思買電子商務網站，

45、并且想要買些什么。此時沒有任何辦法阻止一個惡意的中間人攻擊插入Ann和百思買的會話，他可以捕獲并且修改將要傳輸的數據。如果Ann此刻進行購買，他就能夠調整訂單數量或竊取她的全部身份信息。Ann和她訪問的網站都會落入危險之中。HTTPS增加了安全性，但不是全面的保護已經有一些人在設法“解決”認證過程。HTTPS現在還不夠完美，而且隨著時間的推移它會進一步改善。HTTPS開發(fā)的主要目的，是提供對網站服務器的身份認證，保護交換數據的隱私與完整性（Kayce Basques，2018）?，F在，幾乎所有類型的網站都在使用HTTPS“武裝”自己的網頁，保護個人用戶的敏感信息、網頁之間的通訊和訪問網頁時的私

46、密性。HTTPS還提供了更為強大的全新網絡平臺功能，更新一些“老舊”的API，而且支持PWA的運行。一個擁有HTTPS證書的網站，會有圖3-5所示的彈窗提示。圖3-5 HTTPS標示第4章 小區(qū)管理系統(tǒng)設計與實現4.1 小區(qū)管理系統(tǒng)總體設計本次設計以HTML作為骨架，構建應用的主體頁面，后端使用Express框架來維護創(chuàng)建好的“REST”服務，來確保前后端數據的流通；不同的頁面能夠去完成不同的功能，項目絕大部分數據存儲在MongoDB中。AngularJS是“MEAN”堆棧MongoDB數據庫、Express.js服務器框架、AngularJS前端框架和Node.js服務器運行時環(huán)境的前端部分

47、。用戶打開主頁，可以瀏覽到工作人員發(fā)布的社區(qū)新聞、臨時通知等，獲取到最新的消息；通過上方的導航欄跳轉到“表單”頁面，用戶可以填寫表單，提供詳細的要求或者信息來告知物業(yè)方自己有哪些事情需要解決處理；通過上方的導航欄跳轉到“周邊”頁面，用戶可以查看社區(qū)周圍的娛樂、體育、醫(yī)療等設施這里使用重繪的地圖能更為清晰地標出地點；通過上方的導航欄跳轉到“聯系我”頁面，用戶可以查看社區(qū)內部的一些機構、組織的位置和聯系方式，快速滿足需求。屏幕的左下方設計了一個按鈕，點擊可以回到頂部，滑動可以喚出另外的功能按鈕來刷新頁面。管理端可以使用額外的頁面，來發(fā)布最新情況、社區(qū)活動等信息，也可以刪除過時、失效的新聞；用戶發(fā)來

48、的表單信息，使用數據庫的可視化工具操作，更為安全、方便，幾乎沒有上手難度。首先安裝好本次設計所需的服務器運行時環(huán)境Node.js的長期支持版本，按照指導一步步安裝。MongoDB數據庫去官方網站下載即可，然后安裝。要注意一點，需要提前在安裝MongoDB的磁盤根目錄下新建一個data文件夾，之后才能使用各種方式命令行或者GUI正常訪問到MongoDB。本次設計使用的AngularJS版本號是1.6.9；AngularJS含有多個可以額外使用的模塊文件，每個文件都可以獨立使用，根據項目中的使用程度有選擇地放進項目文件夾，沒有使用到的就放在一邊。Express框架需要在npm窗口下載、全局安裝，E

49、xpress需要下載額外的express-generator包來進行基礎的操作。開發(fā)時使用Mongoose來連接到MongoDB并對其操作，使用nodemon包來解決實時刷新預覽的問題。本次設計選擇Chrome瀏覽器作為產品的測試平臺，使用的版本號為66.0.3359.181。Chrome瀏覽器可以實時模擬多個頁面，以檢測產品在各個終端上的效果。檢測各部分版本號，這是排查問題、搜索答案時重要的依據，如圖4-1所示。圖4- 版本號檢測4.2 后端數據接口設計項目的目錄如圖4-2所示。圖4-2 目錄結構數據的結構文件存放在models中，腳本、樣式表、圖片等資源放在public“公共”文件夾內；r

50、outes文件夾里是路由文件，views文件夾里的是視圖文件將要展示在瀏覽器上的主要內容，package .json文件記錄著項目的依賴項等一系列基本信息，app.js文件是Express的“根基”，它設定了服務器的方法規(guī)則。在app.js中調用自帶的方法把Mongoose連接到本地已經自動建立好的數據庫，具體的代碼如圖4-3所示。圖4-3 Mongoose連接數據庫Mongoose提供一系列原生的方法來操作數據庫中的數據，這里不再詳細介紹。需要設計2個模板，1個用來規(guī)范管理方發(fā)布的信息，另1個用來規(guī)范用戶提交的表單信息。雖然使用的數據是無模式的，不過使全部的數據擁有一個規(guī)范合理的結構會易于驗

51、證信息的真實性。模板設計了3個屬性（內容），分別是新聞標題、新聞內容、具體時間；表單模板設計了7個屬性（內容），分別是地點、是否解決、期待時間、聯系方式、事件詳情、事件種類、提交時間。如圖4-4，4-5所示。圖4-4 新聞模板圖4-5 表單模板通過在路由文件里面編寫的代碼，設計具體的頁面路徑，路徑設置使用/news/:id來展示新聞信息，詳細表單信息則對用戶隱藏，本次設計如圖4-6所示。圖4-6 具體路由設置4.3 前端界面設計使用AngularJS的factory方法創(chuàng)建2個服務，分別對應后端2個數據接口，都使用封裝好的、高級的$resource服務替代$http與其通信，如圖4-7所示。圖

52、4-7 factory方法通過改寫尾部的$routeProvider，可以調整將要渲染的頁面，展示出不同的信息。為每個頁面指定各自的控制器，來改變能夠使用的功能。利用$resource獲取的數據暫時存儲在臨時創(chuàng)建的數組中，使用AngularJS內置的ng-repeat指令從該數組取出數據的內容，填充進HTML文檔中，展示給用戶，如圖4-8所示。圖4-8 分配控制器的設置“周邊”頁面使用重繪的地圖來標示周邊的娛樂、體育、醫(yī)療設施，相比于接入百度地圖等地圖，能夠清晰地傳達給瀏覽者更多有效的信息，如圖4-9所示。圖4-9 簡單的地圖“聯系我”頁面與周邊頁面設計的大同小異，地圖更換為社區(qū)內部的結構圖，

53、指引用戶去了解本社區(qū)內部的成員，下方會列出有效的聯系方式，如圖4-10所示。圖4-10 示例地圖首頁展示了新聞列表，并且設計了一個輸入框去檢索過往的信息。頁面頂部引用了必應的每日圖片，每天都有新的圖片呈現給用戶；后期也可以使用自建的圖庫，例如社區(qū)內部景觀的攝影、社區(qū)居民生活中的攝影，如圖4-11所示。圖4-11 首頁貼圖管理方可以進入到控制頁面，發(fā)布、修改新聞，這個地址只有管理員知道。填寫完必要的信息后，點擊發(fā)布按鈕，即可把新聞、活動、通知等公布給用戶；在列項頁面，管理方可以刪除已經發(fā)布的消息，如圖4-12，4-13所示。圖4-12 發(fā)布新聞頁面圖4-13 管理頁面用戶發(fā)來的表單信息使用數據庫

54、的可視化工具操作，容易上手，功能全面，更加安全。請求的事務由不同的“varis”的值來分類，“details”的值用來描述事務的詳細信息。管理員收到請求后，安排相關人員處理，接收到用戶的確認完成信息后將請求歸檔為已完成“completed”的值改為“true”。這里以MongoDB Compass Community版為例，每一條信息的詳細內容如圖4-14所示，連接到數據庫后的軟件主頁頁面如圖4-15所示。圖4-14 詳細表單信息圖4-15 可視化軟件管理頁面4.4 智能手機接入小區(qū)管理系統(tǒng)測試首先啟動MongoDB，然后進入項目文件夾讓Node.js開始工作。打開Chrome瀏覽器，在地址欄

55、輸入默認的地址進入新聞的主頁，為圖4-11所示的畫面。使用鼠標點擊新聞標題，新聞的詳細內容就會被瀏覽器“展示”出來，如圖4-16所示。圖4-16 新聞詳細頁面表單頁面，用戶按照提示的內容認真填寫表單，然后通過點擊“提交”按鈕將信息發(fā)送、添加到數據庫，管理人員就可以看到用戶的請求，然后安排相關的人員處理。表單提供了多個描述項，幫助用戶表達出最關鍵的信息，一份填寫中的表單如圖4-17所示。圖4-17 表單詳細頁面由于使用AngularJS編寫這個應用，所以在移動端，用戶也能夠得到非常好的用戶體驗。通過滑動頂部，用戶可以喚出沒有默認顯示的導航欄，如圖4-18所示。頁面會自適應調整自己的位置和大小，以在不同分辨率的終端上呈現出大小適中的圖形和內容，分別如圖4-19，4-20，4-21所示。圖4-18 移動端導航欄圖4-19 移動端首頁圖4-20 移動端新聞詳情頁面圖4-21 移動端表單頁面經過上述測試，智能手機接入小區(qū)管理系統(tǒng)的設計基本實現了所提出的要求，能夠滿足用戶的基本需求，為用戶帶來良好的服務。結 論隨著市場經濟的蓬勃發(fā)展，物業(yè)管理已然脫去了過往“沉重的外衣”，演變成為一個值得關注的新型服務產業(yè)。物業(yè)所管理的是“無情”的物品，服務的卻是“有情”的人類；隨著物聯網科技的不斷成熟，人們能