❶ 怎樣搭建web項目測試環境_測試環境的搭建
在開發中大型的JavaEE項目時，前後端分離的框架逐漸成為業界的主流，傳統的單機部署前後端在同一個項目中的工程項目越來越少。這類JavaWeb項目的後端通常都採用微服務的架構，後端會被分大伍哪解為諸多個小項目，然後使用bbozookeeper或者springCloud來構建微服務，前端則會是一個單獨的項目，前台的請求通過微服務來調用。但是，不同與傳統的web項目，這類前後端分離的項目如何在開發中部署和運行呢？
當前後端分離時，後端項目一定會被載入到tomcat的webapp目錄下面，但是前端的資源院該如何被訪問到呢？這里以tomcat這個中間件為例，探討在開發這類項目的時候，如何讓前後端分離的項目部署並且運行起來，即後端項目部署在tomcat之後如何在運行時訪問靜態滾碼資源（非上線部署）。
主要有兩種方案：1.在本地通過Nginx來處理這些靜態資源。2、將靜態資源統一放入一個javaweb應用中，並將自動生成的war包隨後端項目一期丟入tomcat。下面詳細介紹
一、使用Nginx來訪問靜態資源。
在本地安裝nginx並且修改nginx.conf，修改相關配置，將web訪問的埠的資源進行更改，配置如下：
server{listen80;server_namelocalhost;charsetutf-8;#aess_loglogs/host.aess.logmain;
location/{proxy_passtomcat_pool;proxy_redirectoff;
proxy_set_headerHOST$host;
proxy_set_headerX-Real-IP$remote_addr;
proxy_set_headerX-Forwarded-For$proxy_add_x_forwarded_for;
client_max_body_size10m;
client_body_buffer_size128k;
proxy_connect_timeout90;
proxy_send_timeout90;
proxy_read_timeout90;
proxy_buffer_size4k;
proxy_buffers432k;
proxy_busy_buffers_size64k;
proxy_temp_file_write_size64k;
}
location~.*.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|woff|woff2|ttf|eot|map)${
rootD:Workspacesesop-html;indexindex.html;
}
listen對象改為你本地的tomcat訪問埠，最下面location中的root改為你前端項目中靜態資源的位置，這樣就可以實現只部署後端的項目就能訪問前端的頁面了。
二、將前端項目轉換為動態的web項目，隨後端項目一起丟入tomcat
這個方案省去了在本地安裝和配置nginx，但是也只適用於開發階段項目的部署運行和調試，真正在生產環境通常前後端項目會部署在不同的伺服器。
如果是IntellijIdea,在導入前端項目之後，右鍵項目addframeworksupport-->webapplication，這時將會把前端項目轉換為一個javaweb項目，然後將靜態資源放在生成的web目錄下即可。
如果是eclipse，可以新建一個javaweb項目然後將靜態資源放入web或橘含者webcontent目錄下，或者直接先導入前端項目，然後通過projectfacts將項目轉換為dynamicweb項目並勾選js等相關配置。
然後，運行項目時把後端的war包和前端的war包一同添加到deployment中運行即可。
❷ 前端工程師瀏覽器測試環境怎樣搭建
將php-5.4.14安裝\解壓到D盤或別的盤即可。
如上：APMServ5.2.6安裝\解壓到D盤或別的盤就可以。如文件夾里邊F:\APMServ5.2.6\www\htdocs網站軟體程序上傳到【網站根目錄"htdocs"】即可。MySQL資料庫文件存放目錄：MySQL5.1\data或MySQL4.0\data，MySQL默認用戶名：root，密碼為空 【點擊啟動軟體後】在瀏覽器輸入http://127.0.0.1或127.0.0.1迅雷、QQ旋風、BT等下載軟體啟動後默認會佔用80埠，導致APMServ無法啟動。解決方法：先關閉這些軟體，啟動APMServ。
Dreamweaver8是美國Adobe公司開發的集網頁製作和管理網站於一身的所見即所得網頁編輯器，它是第一套針對專業網頁設計師特別發展的視覺化網頁開發工具編輯，工具有很多，個人習慣選擇適合自己的這里只是舉例：
最後將你編輯好的網頁\網站程序通過FlashFXP上傳到你的空間，本地搭建的環境上傳到:\APMServ5.2.6\www\htdocs根目錄下或直接復制到文件夾也行。
5
以上說的是本地搭建網站環境，要想做網站還是建議購買空間\域名
❸ 如何用手機進行本地前端調試
第一步：連接電腦與手機
1. 手機打開「開發者選項」
安卓手機進入「設置」—>「關於手機」—> 在「版本號」上點7次（或其他的版本號位置，一個個試肯定有……）
然後「開發者選項」就出現在「設置」裡面了。
2. 手機打開「USB調試」
進入「開發者選項」—>打開「USB調試」（如果想手機長亮還要打開「不鎖定屏幕」）
3. 連接並允許調試
用USB數據線將手機與電腦連接—>手機上出現「允許該電腦調試」時點「允許」（可能會晚點出現，先去第二步）
第二步：用電腦啟動手機瀏覽
1. 打開chrome的inspect
在電腦chrome地址欄中輸入chrome://inspect—>勾選「Discover USB devices」
如無意外在Devices中會出現手機型號。
如果沒有，再確認下：開發者選項、USB調試、允許該計算機調試
2. 手機打開chrome app
在手機中打開chrome，這時電腦的chrome inspect中會出現輸網址的地方。
3. 測試手機瀏覽的控制
在電腦chrome inspect輸入框中隨便輸個在線網址，點Open，手機chrome就會打開該頁面。用電腦chrome可以控制刷新、關閉，但是用來調試的inspect點開是空白，應該是被牆了。
第三步：用手機測試本地頁面
1. 開啟本地伺服器
對的，很遺憾手機chrome不能進行靜態頁面的調試。
所以必須開本地伺服器，所幸現在有gulp+webserver，用法這里不講了。
總之，完成這一點後，你應該在電腦上用 http://localhost 來瀏覽網頁了。
2. 電腦chrome開啟埠轉發
在chrome inspect中點「Port forwarding...」—>把埠和localhost鏈接輸進去（比如8000和localhost:8000）—>勾選「Enable port forwarding」—>Done
3. 打開手機瀏覽localhost
如：輸入http://localhost:8000 點Open
這樣手機就能打開頁面了。
❹ vue部署到測試環境,doc文件下載前端報錯
這個時候後端API是一個明確的外網環境（使用外網IP或固定域名訪問），需要通過vue-cli腳手架搭建一個代理模式訪問API介面。因為，本地測試環境默認訪問的前端地址是 http://localhost:8080/，除非AP介面也是這地址和介面，不然必然出現跨域問題(跨域是瀏覽器的限制)
❺ 前端環境的安裝與配置
前端環境的安裝與配置？一、工具安裝
1.編輯器
2.Git(分布式的代碼管理工具)
3.Photoshop
4.Nodejs鏈接
二、 環境配置
1.配置git：
1.1 設置Git的user name和email：
$ git config --global user.name "name"
$ git config --global user.email "[email protected]"
1.2 生成SSH密鑰過程：(看需求配置)
$ ssh-keygen -t rsa -C "[email protected]"
3個回車，密碼為空。
Your identification has been saved in /home/tekkub/.ssh/id_rsa.
Your public key has been saved in /home/tekkub/.ssh/id_rsa.pub.
The key fingerprint is:
………………
最後得到了兩個文件：id_rsa和id_rsa.pub
添加密鑰到ssh：
登陸gitlab, Profile Settings -> SSH Keys -> ADD SSH KEYS ,找到本地的id_rsa.pub文件，復制出裡面的內容，添加到 key 內，此時 Title 會自動填上你的郵箱，沒有的話手動填寫, ADD KEY
1.3 拉取代碼到本地(許可權)
創建一個存放項目的文件夾，在該文件夾下，單擊右鍵，選擇git bash,打開git命令框，編寫命令：git clone [email protected]:xx/xx.git（可以在gitlab項目中找到存放地址，gitlab地址：http://gitlab.vchangyi.com ），按回車，就可以從gitlab上clone代碼到本地文件夾
1.4 手動安裝nodejs，如果是pc端安裝的話，nodejs版本不能過低。
安裝最新版的話npm安裝項目依賴會有問題，手機端gulp無法啟動，所以建議安裝nodejs V6。
1.5 測試node是否安裝成功
在git 命令窗或者node 命令窗中輸入命令 ：node -v
1.6 同理，測試npm是否安裝成功npm -v
1.7安裝gulp
在項目下打開git 命令窗，從淘寶源上自行安裝，這個時間需要等待和耐心，也會有網路原因導致安裝失敗，如果安裝失敗可以多來幾次，直到成功為止。
如果是pc端：npm install --registry=http://registry.npm.taobao.org --phantomjs_cdnurl=http://cnpmjs.org/downloads
npm 安裝時候 持久使用淘寶源 設置:
npm config set registry https://registry.npm.taobao.org
配置後可通過下面方式來驗證是否成功
npm config get registry
或
npm info express
❻ 前端的跨域問題理解
前端真的的是亂的一筆。--來自iOS開發者的一聲哀鳴
需要把前端看成兩部分，一部分是頁面，另一部分是介面（或者加數據資源）。前端頁面中調介面是有限制的，同源策略(SOP)要求我們調用的介面必須和頁面在同一域名下，說是為了保證數據的安全。所謂同源：協議+域名+埠
但實際情況是，在前後端分離的大趨勢下，好多頁面和介面的伺服器分布在不同的域名下。比如在開發時，前端頁面分為本地環境、測試環境、模擬環境、正式環境，而介面也分為測試環境、模擬環境、正式環境，當然也可以有本地環境。他們在不同的域名下或IP下或者埠下，是不同源的。或者平時我們也能遇到需要調用不同的伺服器數據資源。顯然，同源策略保障了部分安全的同時，給開發造成了很多的麻煩。
所以，跨域問題是每個前端繞不過去的坎兒。
解決辦法有兩個方向，一個是前端解決，一個是服務端介面解除限制。
前端解決就是通過jsonp、jquery ajax、axios配置代理等。還有個簡單的，比如Mac用戶，可以使用Charles工具設置代理，臨時使用。
服務端解決可以通過nginx反向代理設置允許跨域請求的域名、或者設置Access-Control-Allow-Origin，允許跨域資源共享等。
具體解決方案可參考 https://segmentfault.com/a/1190000011145364
反觀iOS，輪廓簡直不要太清晰，大部分時候只用專注於開發，沒有各種亂七八糟的事情。