3.4 フロントエンド
3.4.1は、 ニーズ分析
、ユーザーのフロントエンド・エンジニアリング・センター（中XC-UI-PC-学習終了ページを開発するために）。
3.4.2のAPI メソッド
ユーザー出口増加するプロジェクトの中心にAPIの方法
では、ベースモジュールlogin.jsは、次のように増加させます。
/*退出*/
export const logout = params => {
return http.requestPost('/openapi/auth/userlogout');
}3.4.3 出口ページ
1 は、ユーザ中心のプロジェクトで作成された出口ページ
参照：
2 、ルーティング構成
import Logout from '@/module/home/page/logout.vue';
import order_pay from '@/module/order/page/order_pay.vue';
// import LoginMini from '@/module/home/page/login_mini.vue';
export default [{
path: '/',
component: Home,
name: '个人中心',
hidden: true
},
{
path: '/login',
component: Login,
name: 'Login',
hidden: true
},
{
path: '/logout',
component: Logout,
name: 'Logout',
hidden: true
},
....3 、終了方法の
終了が正常にページのクリアのsessionStorageを
参照logout.vue
で作成されたフックメソッド要求メソッドが終了します
created(){
loginApi.logout({}).then((res) => {
if(res.success){
sessionStorage.removeItem('activeUser');
this.$message('退出成功');
this.logoutsuccess = true
}else{
this.logoutsuccess = false
}
},
(res) => {
this.logoutsuccess = false
});
},3.4.4 終了ページへの接続は
MODIFY 含ま/ header.html
<a href="javascript:;" @click="logout" v‐if="logined == true">退出</a>含ま/ header.htmlは追加要素のUI ライブラリ：
<script src="/css/el/index.js"></script>
将此js加到head的最下边ログアウトは、次のとおりです。
logout: function () {
this.$confirm('确认退出吗?', '提示', {
}).then(() => {
//跳转到统一登陆
window.location = "http://ucenter.xuecheng.com/#/logout"
}).catch(() => {
});
},3.4.5 試験
1は、ユーザがログインしている
2 終了をクリックし、
4 Zuul ゲートウェイ
4.1 要件分析
ゲートウェイは、複数のシステムのためのインターセプト要求することを心配するあまり、インターセプターと同等に作用します。
このセクションでは、ユーザーのIDゲートウェイが正当であることを確認するために使用します。
4.2 Zuul はじめ
は何ですかZuul ？
春クラウドZuul 統合Netflflix のZuulのマイクロサービスは、オープンソースプロジェクトが検証、要求のルーティング、負荷分散を実装し、実装ゲートウェイ
他の機能を検討します。
公式：https://github.com/Netflflix/zuul
ゲートウェイとは何ですか？
サービスゲートウェイが最初ゲートウェイに対する障壁マイクロサービス、サービス要求の前に配置され、要求が処理をルーティングするチェック、紛失されるであろう。サービスと
ビジネスゲートウェイは、安全性、適法性マイクロゲートウェイサービスの検証要求を向上させることができ、要求が合法的傍受、アクセス拒否されません。
Zuul とnginxの使用にどのように？
Zuul とnginxのは以下のように、実際のプロジェクトで使用する必要があり、nginxのの役割は、ロード・バランシングは、リバースプロキシであるZuulの役割はシークレット保護することである
、マイクロサービス要求をインターセプト、サービスへのセキュアなアクセス合法性とロードバランシングを検証します。
4.3 ビルドゲートウェイプロジェクトは、
ゲートウェイプロジェクト（作成するXC-支配-ゲートウェイ）：
1を、作成XC-支配ゲートウェイプロジェクトの
インポート「データ」 - " xc-govern-gateway.zip
2 、@EnableZuulProxy
起動クラスでの使用に注意@EnableZuulProxy ノートには、このプロジェクトを識別するZuul ゲートウェイ、クラスコードを開始し、以下の通りであります：
@SpringBootApplication
@EnableZuulProxy
public class GatewayApplication {
public static void main(String[] args) {
SpringApplication.run(GatewayApplication.class, args);
}
}
