blob: 1d7a53a30f082204601ba33e817d4c0e44317024 [file] [log] [blame]
<!doctype html>
<!--
Minimal Mistakes Jekyll Theme 4.4.1 by Michael Rose
Copyright 2017 Michael Rose - mademistakes.com | @mmistakes
Free for personal and commercial use under the MIT license
https://github.com/mmistakes/minimal-mistakes/blob/master/LICENSE.txt
-->
<html lang="cn" class="no-js">
<head>
<meta charset="utf-8">
<!-- begin SEO -->
<title>基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统 - Apache ServiceComb</title>
<meta name="description" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta name="author" content="Lisen">
<meta property="og:locale" content="cn">
<meta property="og:site_name" content="Apache ServiceComb">
<meta property="og:title" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<link rel="canonical" href="https://github.com/pages/apache/incubator-servicecomb-website/cn/docs/servicecomb-springcloud-zuul-demo/">
<meta property="og:url" content="https://github.com/pages/apache/incubator-servicecomb-website/cn/docs/servicecomb-springcloud-zuul-demo/">
<meta property="og:description" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta name="twitter:site" content="@ServiceComb">
<meta name="twitter:title" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta name="twitter:description" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta name="twitter:url" content="">
<meta name="twitter:card" content="summary">
<meta name="twitter:creator" content="@Lisen">
<meta property="og:type" content="article">
<meta property="article:published_time" content="2019-01-22T00:00:00+08:00">
<script type="application/ld+json">
{
"@context" : "http://schema.org",
"@type" : "Person",
"name" : "Apache ServiceComb",
"url" : "https://github.com/pages/apache/incubator-servicecomb-website",
"sameAs" : null
}
</script>
<meta name="google-site-verification" content="HvJjNd7vvJ-yjSTHlBiIWEYxp_Hrz-PYEY5Idz9LRcA" />
<!-- end SEO -->
<link href="/feed.xml" type="application/atom+xml" rel="alternate" title="Apache ServiceComb Feed">
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script>
document.documentElement.className = document.documentElement.className.replace(/\bno-js\b/g, '') + ' js ';
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>
<script src="/assets/vendor/prism/prism.js"></script>
<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<!-- For all browsers -->
<link rel="stylesheet" href="/assets/css/main.css?v=1">
<link rel="stylesheet" href="/assets/vendor/prism/prism.css?v=1">
<!--[if lte IE 9]>
<style>
/* old IE unsupported flexbox fixes */
.greedy-nav .site-title {
padding-right: 3em;
}
.greedy-nav button {
position: absolute;
top: 0;
right: 0;
height: 100%;
}
</style>
<![endif]-->
<meta http-equiv="cleartype" content="on">
<!-- start custom head snippets -->
<!-- insert favicons. use http://realfavicongenerator.net/ -->
<link href="https://fonts.cat.net/css?family=Roboto:400,500,700|Source+Code+Pro" rel="stylesheet">
<script src="/assets/js/custom.js"></script>
<!-- end custom head snippets -->
</head>
<body class="layout--single">
<!--[if lt IE 9]>
<div class="notice--danger align-center" style="margin: 0;">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</div>
<![endif]-->
<div class="masthead" onmouseleave="$('#childrenShow').css('display', 'none')">
<div class="masthead__inner-wrap">
<div class="masthead__menu">
<nav id="site-nav" class="greedy-nav">
<a class="site-title active" href="/cn"><img src="https://www.apache.org/img/servicecomb.png"></a>
<ul class="visible-links">
<li class="masthead__menu-item" onmouseenter="$('#childrenShow').css('display', 'none')">
<a href="/cn/">首页</a>
</li>
<li class="masthead__menu-item" onmouseenter="$('#childrenShow').css('display', 'none')">
<a href="/cn/developers/">项目</a>
</li>
<li class="def-nav-li" onmouseenter="$('#childrenShow').css('display', 'block')">
<a href="/cn/docs/users/">文档</a>
<ul id="childrenShow" class="def-children-show" onmouseleave="$('#childrenShow').css('display', 'none')">
<li><a href="/cn/docs/quick-start/" class="">入门指南</a></li>
<li><a href="/cn/docs/users/" class="">用户手册</a></li>
<li><a href="/cn/slides/" class="">大咖视频</a></li>
<li><a href="/cn/faqs/" class="">常见问题</a></li>
</ul>
</li>
<li class="masthead__menu-item" onmouseenter="$('#childrenShow').css('display', 'none')">
<a href="/cn/developers/contributing">社区</a>
</li>
<li class="masthead__menu-item" onmouseenter="$('#childrenShow').css('display', 'none')">
<a href="/cn/year-archive/">博文</a>
</li>
<li class="masthead__menu-item" onmouseenter="$('#childrenShow').css('display', 'none')">
<a href="/cn/release/">下载</a>
</li>
</ul>
<button><div class="navicon"></div></button>
<ul class="hidden-links hidden"></ul>
<div class="nav-lang">
<a href=/docs/servicecomb-springcloud-zuul-demo/>English</a>
</div>
</nav>
</div>
</div>
</div>
<div id="main" role="main">
<div class="sidebar sticky">
<div class="back-to-home"><a href="/cn/">首页</a> > 基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统</div>
<div itemscope itemtype="http://schema.org/Person">
<div class="author__avatar">
<img src="/assets/images/ServiceComb-logo-3.jpg" class="author__avatar" alt="" itemprop="image">
</div>
<div class="author__content">
<h3 class="author__name" itemprop="name"></h3>
<p class="author__bio" itemprop="description">
ServiceComb提供了一套关于服务注册,服务发现,服务配置以及管理功能的微服务框架
</p>
</div>
<div class="author__urls-wrapper">
<button class="btn btn--inverse">关注</button>
<ul class="author__urls social-icons">
<li itemprop="homeLocation" itemscope itemtype="http://schema.org/Place">
<i class="fa fa-fw fa-map-marker" aria-hidden="true"></i> <span itemprop="name">中国</span>
</li>
<li>
<a href="mailto:dev@servicecomb.apache.org">
<meta itemprop="email" content="dev@servicecomb.apache.org" />
<i class="fa fa-fw fa-envelope-square" aria-hidden="true"></i> 电子邮箱
</a>
</li>
<li>
<a href="https://github.com/search?q=org:apache+ServiceComb&unscoped_q=ServiceComb" itemprop="sameAs">
<i class="fa fa-fw fa-github" aria-hidden="true"></i> GitHub<br>
</a>
</li>
<!--
<li>
<a href="http://link-to-whatever-social-network.com/user/" itemprop="sameAs">
<i class="fa fa-fw" aria-hidden="true"></i> Custom Social Profile Link
</a>
</li>
-->
</ul>
</div>
</div>
</div>
<article class="page" itemscope itemtype="http://schema.org/CreativeWork">
<meta itemprop="headline" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta itemprop="description" content="基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统">
<meta itemprop="datePublished" content="January 22, 2019">
<meta itemprop="dateModified" content="January 22, 2019">
<div class="page__inner-wrap">
<header>
<h1 class="page__title" itemprop="headline">基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统
</h1>
<p class="page__meta"><i class="fa fa-clock-o" aria-hidden="true"></i>
2 分钟 阅读
</p>
</header>
<section class="page__content" itemprop="text">
<p>基于ServiceComb和Zuul实现微服务网关,如此一来用户只需要专注实现其业务需求。</p>
<h3 id="场景">场景</h3>
<p>本文将以一个简单的Hello服务演示网关的使用。Hello微服务提供一个hello/{name}接口,只要传递路径参数name就可以返回打招呼内容。接口返回结果通过网关将在浏览器界面显示</p>
<p><img src="/assets/images/zuul/demo-theory.png" alt="在这里插入图片描述" /></p>
<h3 id="技术准备">技术准备</h3>
<p><a href="http://servicecomb.apache.org/cn/docs/quick-start/">ServiceComb</a> 作为后端微服务核心框架 <br />
<a href="https://github.com/apache/servicecomb-service-center">ServiceCenter</a> 作为服务发现与注册中心<br />
<a href="https://cloud.spring.io/spring-cloud-netflix/multi/multi__router_and_filter_zuul.html">SpringCloud Zuul</a> 组件做服务网关</p>
<h3 id="环境准备">环境准备</h3>
<p>以下环境为Windows 64位系统</p>
<ul>
<li>
<p>安装git,详情可参考<a href="https://git-scm.com/book/zh/v2/%E8%B5%B7%E6%AD%A5-%E5%AE%89%E8%A3%85-Git">git安装教程</a></p>
</li>
<li>
<p>安装JDK 1.8,详情可参考<a href="https://docs.oracle.com/javase/8/docs/technotes/guides/install/install_overview.html">JDK安装教程</a></p>
</li>
<li>
<p>安装Maven 3.x,详情可参考<a href="https://maven.apache.org/install.html">Maven安装教程</a></p>
</li>
</ul>
<p>ServiceCenter安装<br />
下载地址:http://mirrors.hust.edu.cn/apache/servicecomb/servicecomb-service-center/1.1.0/apache-servicecomb-service-center-1.1.0-windows-amd64.tar.gz
下载后解压如下
<img src="/assets/images/zuul/demo-dir.png" alt="在这里插入图片描述" /></p>
<p>在该目录下双击service-center.exe即可启动,命令窗口中出现如下信息基本代表ServiceCenter启动成功,从这个信息也可以得知ServiceCenter监听的是30100端口,等下配置文件要用到。
<img src="/assets/images/zuul/demo-servicecenter-console1.png" alt="在这里插入图片描述" /></p>
<p>问题点: 有可能会有如下信息,这个一般是端口被占用,很可能你打开了两个ServiceCenter,都关闭后再打开就可以了。
<img src="/assets/images/zuul/demo-servicecenter-console2.png" alt="在这里插入图片描述" /></p>
<h3 id="示例">示例</h3>
<h4 id="一--后端微服务-helloservice">一. 后端微服务 HelloService</h4>
<h5 id="1-添加依赖">1. 添加依赖</h5>
<p>新建maven项目HelloService,pom文件如下</p>
<div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;?xml version="1.0" encoding="UTF-8"?&gt;</span>
<span class="nt">&lt;project</span> <span class="na">xmlns=</span><span class="s">"http://maven.apache.org/POM/4.0.0"</span>
<span class="na">xmlns:xsi=</span><span class="s">"http://www.w3.org/2001/XMLSchema-instance"</span>
<span class="na">xsi:schemaLocation=</span><span class="s">"http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"</span><span class="nt">&gt;</span>
<span class="nt">&lt;modelVersion&gt;</span>4.0.0<span class="nt">&lt;/modelVersion&gt;</span>
<span class="nt">&lt;groupId&gt;</span>com.servicecomb.example<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>HelloService<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.0-SNAPSHOT<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;dependencies&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.springframework.boot<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-starter<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.5.12.RELEASE<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-starter-provider<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.hibernate<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>hibernate-validator<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>5.3.6.Final<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;/dependencies&gt;</span>
<span class="nt">&lt;dependencyManagement&gt;</span>
<span class="nt">&lt;dependencies&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>java-chassis-dependencies<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;type&gt;</span>pom<span class="nt">&lt;/type&gt;</span>
<span class="nt">&lt;scope&gt;</span>import<span class="nt">&lt;/scope&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;/dependencies&gt;</span>
<span class="nt">&lt;/dependencyManagement&gt;</span>
<span class="nt">&lt;build&gt;</span>
<span class="nt">&lt;plugins&gt;</span>
<span class="nt">&lt;plugin&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.springframework.boot<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-maven-plugin<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;/plugin&gt;</span>
<span class="nt">&lt;/plugins&gt;</span>
<span class="nt">&lt;/build&gt;</span>
<span class="nt">&lt;/project&gt;</span>
</code></pre></div></div>
<h5 id="2-配置">2. 配置</h5>
<p>新建ServiceComb配置文件src/main/resources/microservice.yaml,内容如下</p>
<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="na">APPLICATION_ID</span><span class="pi">:</span> <span class="s">helloworld</span> <span class="c1"># 应用名,注意与网关服务器的应用名保持一致</span>
<span class="na">service_description</span><span class="pi">:</span>
<span class="na">name</span><span class="pi">:</span> <span class="s">helloservice</span> <span class="c1"># 微服务名</span>
<span class="na">version</span><span class="pi">:</span> <span class="s">0.0.1</span> <span class="c1"># 微服务版本号</span>
<span class="na">servicecomb</span><span class="pi">:</span>
<span class="na">service</span><span class="pi">:</span>
<span class="na">registry</span><span class="pi">:</span>
<span class="na">address</span><span class="pi">:</span> <span class="s">http://127.0.0.1:30100</span> <span class="c1"># 服务注册中心(重要)</span>
<span class="na">rest</span><span class="pi">:</span>
<span class="na">address</span><span class="pi">:</span> <span class="s">0.0.0.0:7777</span> <span class="c1"># 微服务启动端口</span>
</code></pre></div></div>
<h5 id="3-项目入口">3. 项目入口</h5>
<p>新建启动类HelloApplication.java,内容如下</p>
<div class="language-java highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kn">package</span> <span class="n">com</span><span class="o">.</span><span class="na">servicecomb</span><span class="o">.</span><span class="na">example</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.apache.servicecomb.springboot.starter.provider.EnableServiceComb</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.boot.SpringApplication</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.boot.autoconfigure.SpringBootApplication</span><span class="o">;</span>
<span class="nd">@SpringBootApplication</span>
<span class="c1">//这个注解使Spring能够自动配置ServiceComb模块</span>
<span class="nd">@EnableServiceComb</span>
<span class="kd">public</span> <span class="kd">class</span> <span class="nc">HelloApplication</span> <span class="o">{</span>
<span class="kd">public</span> <span class="kd">static</span> <span class="kt">void</span> <span class="nf">main</span><span class="o">(</span><span class="nc">String</span><span class="o">[]</span> <span class="n">args</span><span class="o">)</span> <span class="o">{</span>
<span class="nc">SpringApplication</span><span class="o">.</span><span class="na">run</span><span class="o">(</span><span class="nc">HelloApplication</span><span class="o">.</span><span class="na">class</span><span class="o">,</span> <span class="n">args</span><span class="o">);</span>
<span class="o">}</span>
<span class="o">}</span>
</code></pre></div></div>
<p>新建Controller类HelloController.java (这里我习惯SpringMvc的叫法,重点看注解)</p>
<div class="language-java highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kn">package</span> <span class="n">com</span><span class="o">.</span><span class="na">servicecomb</span><span class="o">.</span><span class="na">example</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.apache.servicecomb.provider.rest.common.RestSchema</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.web.bind.annotation.GetMapping</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.web.bind.annotation.PathVariable</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.web.bind.annotation.RequestMapping</span><span class="o">;</span>
<span class="c1">//restful服务契约</span>
<span class="nd">@RestSchema</span><span class="o">(</span><span class="n">schemaId</span> <span class="o">=</span> <span class="s">"helloController"</span><span class="o">)</span>
<span class="nd">@RequestMapping</span><span class="o">(</span><span class="n">path</span> <span class="o">=</span> <span class="s">"/"</span><span class="o">)</span>
<span class="kd">public</span> <span class="kd">class</span> <span class="nc">HelloController</span> <span class="o">{</span>
<span class="nd">@GetMapping</span><span class="o">(</span><span class="n">path</span> <span class="o">=</span> <span class="s">"/hello/{name}"</span><span class="o">)</span>
<span class="kd">public</span> <span class="nc">String</span> <span class="nf">hello</span><span class="o">(</span><span class="nd">@PathVariable</span><span class="o">(</span><span class="s">"name"</span><span class="o">)</span> <span class="nc">String</span> <span class="n">name</span><span class="o">)</span> <span class="o">{</span>
<span class="k">return</span> <span class="s">"Hello, "</span> <span class="o">+</span> <span class="n">name</span><span class="o">;</span>
<span class="o">}</span>
<span class="o">}</span>
</code></pre></div></div>
<h5 id="4-启动">4. 启动</h5>
<p>到此,一个微服务就写完了,如下在IDEA里面直接启动应用
<img src="/assets/images/zuul/demo-helloservice-start.png" alt="在这里插入图片描述" /></p>
<h4 id="二-编写zuul网关服务">二. 编写Zuul网关服务</h4>
<h5 id="1-添加依赖-1">1. 添加依赖</h5>
<p>新建maven项目 zuulserver,pom文件如下</p>
<div class="language-xml highlighter-rouge"><div class="highlight"><pre class="highlight"><code>
<span class="cp">&lt;?xml version="1.0" encoding="UTF-8"?&gt;</span>
<span class="nt">&lt;project</span> <span class="na">xmlns=</span><span class="s">"http://maven.apache.org/POM/4.0.0"</span>
<span class="na">xmlns:xsi=</span><span class="s">"http://www.w3.org/2001/XMLSchema-instance"</span>
<span class="na">xsi:schemaLocation=</span><span class="s">"http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"</span><span class="nt">&gt;</span>
<span class="nt">&lt;modelVersion&gt;</span>4.0.0<span class="nt">&lt;/modelVersion&gt;</span>
<span class="nt">&lt;groupId&gt;</span>com.servicecomb.example<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>zuulserver<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.0-SNAPSHOT<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;dependencies&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.springframework.boot<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-starter<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.5.12.RELEASE<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="c">&lt;!-- ServiceComb框架,提供基础能力 --&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-starter-servicecomb<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="c">&lt;!-- ServiceComb与SpringCloud Zuul的集成框架 --&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-starter-discovery<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="c">&lt;!-- SpringCloud Zuul框架 --&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-cloud-zuul<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;/dependencies&gt;</span>
<span class="c">&lt;!-- 导入ServiceComb所需依赖 --&gt;</span>
<span class="nt">&lt;dependencyManagement&gt;</span>
<span class="nt">&lt;dependencies&gt;</span>
<span class="nt">&lt;dependency&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.apache.servicecomb<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>java-chassis-dependencies<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;version&gt;</span>1.1.0<span class="nt">&lt;/version&gt;</span>
<span class="nt">&lt;type&gt;</span>pom<span class="nt">&lt;/type&gt;</span>
<span class="nt">&lt;scope&gt;</span>import<span class="nt">&lt;/scope&gt;</span>
<span class="nt">&lt;/dependency&gt;</span>
<span class="nt">&lt;/dependencies&gt;</span>
<span class="nt">&lt;/dependencyManagement&gt;</span>
<span class="nt">&lt;build&gt;</span>
<span class="nt">&lt;plugins&gt;</span>
<span class="nt">&lt;plugin&gt;</span>
<span class="nt">&lt;groupId&gt;</span>org.springframework.boot<span class="nt">&lt;/groupId&gt;</span>
<span class="nt">&lt;artifactId&gt;</span>spring-boot-maven-plugin<span class="nt">&lt;/artifactId&gt;</span>
<span class="nt">&lt;/plugin&gt;</span>
<span class="nt">&lt;/plugins&gt;</span>
<span class="nt">&lt;/build&gt;</span>
<span class="nt">&lt;/project&gt;</span>
</code></pre></div></div>
<h5 id="2-配置文件">2. 配置文件</h5>
<p>新建springboot配置文件src/main/resources/application.yaml,内容如下</p>
<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="na">zuul</span><span class="pi">:</span>
<span class="na">routes</span><span class="pi">:</span> <span class="c1"># 定义路由转发规则。凡是匹配/helloservice/**的路由都会转发到helloservice服务</span>
<span class="na">helloservice</span><span class="pi">:</span> <span class="s">/helloservice/**</span>
<span class="na">server</span><span class="pi">:</span>
<span class="na">port</span><span class="pi">:</span> <span class="m">8080</span> <span class="c1">#SpringBoot框架的配置,服务启动端口</span>
</code></pre></div></div>
<p>新建ServiceComb配置文件src/main/resources/microservice.yaml,内容如下</p>
<div class="language-yaml highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="na">APPLICATION_ID</span><span class="pi">:</span> <span class="s">helloworld</span> <span class="c1"># 应用ID</span>
<span class="na">service_description</span><span class="pi">:</span>
<span class="na">name</span><span class="pi">:</span> <span class="s">gateway</span> <span class="c1"># 微服务名</span>
<span class="na">version</span><span class="pi">:</span> <span class="s">0.0.1</span> <span class="c1"># 微服务版本</span>
<span class="na">servicecomb</span><span class="pi">:</span>
<span class="na">service</span><span class="pi">:</span>
<span class="na">registry</span><span class="pi">:</span>
<span class="na">address</span><span class="pi">:</span> <span class="s">http://127.0.0.1:30100</span> <span class="c1"># 服务注册中心地址 (重要)</span>
</code></pre></div></div>
<h5 id="3项目入口">3.项目入口</h5>
<p>新建启动类 ZuulApplication.java</p>
<div class="language-java highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kn">package</span> <span class="n">com</span><span class="o">.</span><span class="na">servicecomb</span><span class="o">.</span><span class="na">example</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.apache.servicecomb.springboot.starter.provider.EnableServiceComb</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.boot.SpringApplication</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.boot.autoconfigure.SpringBootApplication</span><span class="o">;</span>
<span class="kn">import</span> <span class="nn">org.springframework.cloud.netflix.zuul.EnableZuulProxy</span><span class="o">;</span>
<span class="nd">@SpringBootApplication</span>
<span class="nd">@EnableZuulProxy</span>
<span class="nd">@EnableServiceComb</span>
<span class="kd">public</span> <span class="kd">class</span> <span class="nc">ZuulApplication</span> <span class="o">{</span>
<span class="kd">public</span> <span class="kd">static</span> <span class="kt">void</span> <span class="nf">main</span><span class="o">(</span><span class="nc">String</span><span class="o">[]</span> <span class="n">args</span><span class="o">)</span> <span class="o">{</span>
<span class="nc">SpringApplication</span><span class="o">.</span><span class="na">run</span><span class="o">(</span><span class="nc">ZuulApplication</span><span class="o">.</span><span class="na">class</span><span class="o">,</span> <span class="n">args</span><span class="o">);</span>
<span class="o">}</span>
<span class="o">}</span>
</code></pre></div></div>
<p>新建静态文件 src/main/resources/static/index.html,内容如下 (static目录是按springboot项目规范,属于应用静态文件根目录)</p>
<div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="cp">&lt;!DOCTYPE HTML&gt;</span>
<span class="nt">&lt;html&gt;</span>
<span class="nt">&lt;head&gt;</span>
<span class="nt">&lt;meta</span> <span class="na">charset=</span><span class="s">"utf-8"</span><span class="nt">&gt;</span>
<span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.min.css"</span> <span class="na">integrity=</span><span class="s">"sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"</span> <span class="na">crossorigin=</span><span class="s">"anonymous"</span><span class="nt">&gt;</span>
<span class="nt">&lt;script </span><span class="na">src=</span><span class="s">"https://code.jquery.com/jquery-3.2.1.min.js"</span> <span class="na">crossorigin=</span><span class="s">"anonymous"</span><span class="nt">&gt;&lt;/script&gt;</span>
<span class="nt">&lt;/head&gt;</span>
<span class="nt">&lt;body&gt;</span>
<span class="nt">&lt;div</span> <span class="na">style=</span><span class="s">"width:300px; margin:0 auto ; margin-top: 50px;"</span><span class="nt">&gt;</span>
<span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"input-group mb-3"</span><span class="nt">&gt;</span>
<span class="nt">&lt;input</span> <span class="na">id=</span><span class="s">"username"</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">class=</span><span class="s">"form-control"</span> <span class="na">placeholder=</span><span class="s">"Username"</span> <span class="na">aria-label=</span><span class="s">"Username"</span> <span class="na">aria-describedby=</span><span class="s">"basic-addon1"</span><span class="nt">&gt;</span>
<span class="nt">&lt;div</span> <span class="na">class=</span><span class="s">"input-group-prepend"</span><span class="nt">&gt;</span>
<span class="nt">&lt;button</span> <span class="na">style=</span><span class="s">""</span> <span class="na">type=</span><span class="s">"button"</span> <span class="na">class=</span><span class="s">"btn btn-primary"</span> <span class="na">onclick=</span><span class="s">"testCall()"</span><span class="nt">&gt;</span>打招呼<span class="nt">&lt;/button&gt;</span>
<span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;div</span> <span class="nt">&gt;</span>
<span class="nt">&lt;div</span> <span class="na">style=</span><span class="s">"height: 200px;"</span> <span class="na">class=</span><span class="s">"form-control"</span> <span class="na">id=</span><span class="s">"resultDiv"</span> <span class="nt">&gt;</span>
<span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/div&gt;</span>
<span class="nt">&lt;/body&gt;</span>
<span class="nt">&lt;script&gt;</span>
<span class="kd">function</span> <span class="nx">testCall</span><span class="p">()</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">username</span> <span class="o">=</span> <span class="nx">$</span><span class="p">(</span><span class="dl">"</span><span class="s2">#username</span><span class="dl">"</span><span class="p">).</span><span class="nx">val</span><span class="p">();</span>
<span class="k">if</span><span class="p">(</span><span class="o">!</span><span class="nx">username</span><span class="p">){</span>
<span class="k">return</span>
<span class="p">}</span>
<span class="nx">$</span><span class="p">.</span><span class="nx">ajax</span><span class="p">({</span>
<span class="na">url</span><span class="p">:</span> <span class="dl">"</span><span class="s2">/helloservice/hello/</span><span class="dl">"</span><span class="o">+</span><span class="nx">username</span><span class="p">,</span>
<span class="na">success</span><span class="p">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">resultDiv</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">"</span><span class="s2">resultDiv</span><span class="dl">"</span><span class="p">);</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span>
<span class="nx">resultDiv</span><span class="p">.</span><span class="nx">innerText</span> <span class="o">=</span> <span class="nx">data</span><span class="p">;</span>
<span class="p">},</span>
<span class="na">error</span><span class="p">:</span> <span class="kd">function</span> <span class="p">(</span><span class="nx">data</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">var</span> <span class="nx">resultDiv</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">"</span><span class="s2">resultDiv</span><span class="dl">"</span><span class="p">);</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="nx">data</span><span class="p">)</span>
<span class="nx">resultDiv</span><span class="p">.</span><span class="nx">innerText</span> <span class="o">=</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">data</span><span class="p">);</span>
<span class="p">}</span>
<span class="p">})</span>
<span class="p">}</span>
<span class="nt">&lt;/script&gt;</span>
<span class="nt">&lt;/html&gt;</span>
</code></pre></div></div>
<h5 id="4-启动-1">4. 启动</h5>
<p>到此,网关服务器写完,如下在IDEA里面直接启动应用
<img src="/assets/images/zuul/demo-zuulservice-start.jpg" alt="在这里插入图片描述" /></p>
<h4 id="三-演示效果">三. 演示效果</h4>
<p>浏览器访问http://localhost:8080/ ,如下图。
在输入框中输入姓名,就可以在下面看到打招呼的信息</p>
<p><img src="/assets/images/zuul/demo-run.png" alt="在这里插入图片描述" /></p>
<h3 id="总结">总结</h3>
<p>从以上的示例可以看出,通过 ServiceComb 结合SpringCloud Zuul 实现服务网关功能只需一些简单的配置。后续可以在网关服务上实现统一的鉴权,日志记录,和自定义过滤器等。</p>
<h3 id="参考">参考</h3>
<ul>
<li>[1] <a href="https://cloud.spring.io/spring-cloud-netflix/multi/multi__router_and_filter_zuul.html">SpringCloud Zuul</a></li>
<li>[2] <a href="http://servicecomb.apache.org/cn/docs/quick-start/">ServiceComb</a></li>
</ul>
</section>
<footer class="page__meta">
<p class="page__taxonomy">
<strong><i class="fa fa-fw fa-tags" aria-hidden="true"></i> 标签: </strong>
<span itemprop="keywords">
<a href="/tags/#servicecomb" class="page__taxonomy-item" rel="tag">ServiceComb</a><span class="sep">, </span>
<a href="/tags/#springcloud-zuul" class="page__taxonomy-item" rel="tag">SpringCloud Zuul</a><span class="sep">, </span>
<a href="/tags/#%E5%BE%AE%E6%9C%8D%E5%8A%A1" class="page__taxonomy-item" rel="tag">微服务</a>
</span>
</p>
<p class="page__date"><strong><i class="fa fa-fw fa-calendar" aria-hidden="true"></i> 最新的:</strong> <time datetime="2019-01-22">2019年1月22日</time></p>
</footer>
<section class="page__share">
<h4 class="page__share-title">分享</h4>
<a href="https://twitter.com/intent/tweet?via=ServiceComb&text=基于 ServiceComb 和 SpringCloud Zuul 快速构建微服务系统 /cn/docs/servicecomb-springcloud-zuul-demo/" class="btn btn--twitter" title="分享 Twitter"><i class="fa fa-fw fa-twitter" aria-hidden="true"></i><span> Twitter</span></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=/cn/docs/servicecomb-springcloud-zuul-demo/" class="btn btn--facebook" title="分享 Facebook"><i class="fa fa-fw fa-facebook" aria-hidden="true"></i><span> Facebook</span></a>
<a href="https://plus.google.com/share?url=/cn/docs/servicecomb-springcloud-zuul-demo/" class="btn btn--google-plus" title="分享 Google Plus"><i class="fa fa-fw fa-google-plus" aria-hidden="true"></i><span> Google+</span></a>
<a href="https://www.linkedin.com/shareArticle?mini=true&url=/cn/docs/servicecomb-springcloud-zuul-demo/" class="btn btn--linkedin" title="分享 LinkedIn"><i class="fa fa-fw fa-linkedin" aria-hidden="true"></i><span> LinkedIn</span></a>
</section>
<nav class="pagination">
<a href="/cn/docs/distributed-transaction-of-services-2/" class="pagination--pager" title="基于服务的分布式事务(下篇)
">向前</a>
<a href="/cn/docs/customized-tracing-with-servicecomb/" class="pagination--pager" title="ServiceComb + Zipkin : 使用篇——自定义追踪
">向后</a>
</nav>
</div>
<div class="page__comments">
<section id="static-comments">
<!-- Start static comments -->
<div class="js-comments">
</div>
<!-- End static comments -->
<!-- Start new comment form -->
<h4 class="page__comments-title">留下评论</h4>
<p class="small">您的电子邮箱地址并不会被展示。请填写标记为必须的字段。 <span class="required">*</span></p>
<form id="new_comment" class="page__comments-form js-form form" method="post" action="https://api.staticman.net/v1/entry/apache/incubator-servicecomb-website/master">
<div class="form__spinner">
<i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
<span class="sr-only">正在加载...</span>
</div>
<fieldset>
<label for="comment-form-message">评论 <small class="required">*</small></label>
<textarea type="text" rows="3" id="comment-form-message" name="fields[message]" tabindex="1"></textarea>
<div class="small help-block"><a href="https://daringfireball.net/projects/markdown/">Markdown语法已支持。</a></div>
</fieldset>
<fieldset>
<label for="comment-form-name">姓名 <small class="required">*</small></label>
<input type="text" id="comment-form-name" name="fields[name]" tabindex="2" />
</fieldset>
<fieldset>
<label for="comment-form-email">电子邮箱 <small class="required">*</small></label>
<input type="email" id="comment-form-email" name="fields[email]" tabindex="3" />
</fieldset>
<fieldset>
<label for="comment-form-url">网站(可选)</label>
<input type="url" id="comment-form-url" name="fields[url]" tabindex="4"/>
</fieldset>
<fieldset class="hidden" style="display: none;">
<input type="hidden" name="options[slug]" value="servicecomb-springcloud-zuul-demo">
<label for="comment-form-location">Not used. Leave blank if you are a human.</label>
<input type="text" id="comment-form-location" name="fields[hidden]" autocomplete="off"/>
</fieldset>
<!-- Start comment form alert messaging -->
<p class="hidden js-notice">
<strong class="js-notice-text"></strong>
</p>
<!-- End comment form alert messaging -->
<fieldset>
<button type="submit" id="comment-form-submit" tabindex="5" class="btn btn--large">提交评论</button>
</fieldset>
</form>
<!-- End new comment form -->
</section>
</div>
</article>
<div class="page__related">
<h4 class="page__related-title">猜您还喜欢</h4>
<div class="grid__wrapper">
<div class="grid__item">
<article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
<h2 class="archive__item-title" itemprop="headline">
<a href="/cn/docs/playing-on-the-open-source-community-with-Apache-ServiceComb-BUPT/" rel="permalink">与Apache ServiceComb一起玩开源-北邮站 (PPT Download)
</a>
</h2>
<p class="archive__item-excerpt" itemprop="description">与Apache ServiceComb一起玩开源-北邮站 (PPT Download)
</p>
<p class="page__meta"><i class="fa fa-clock-o" aria-hidden="true"></i>
少于 1 分钟 阅读
</p>
</article>
</div>
<div class="grid__item">
<article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
<h2 class="archive__item-title" itemprop="headline">
<a href="/docs/servicecomb-accept-newcapec-institute-code-donation/" rel="permalink">Apache ServiceComb Accept Code Donation From NewCapec Institute
</a>
</h2>
<p class="archive__item-excerpt" itemprop="description">Apache ServiceComb Accept Code Donation From NewCapec Institute
</p>
<p class="page__meta"><i class="fa fa-clock-o" aria-hidden="true"></i>
少于 1 分钟 阅读
</p>
</article>
</div>
<div class="grid__item">
<article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
<h2 class="archive__item-title" itemprop="headline">
<a href="/cn/docs/servicecomb-accept-newcapec-institute-code-donation/" rel="permalink">Apache ServiceComb社区接受新开普软件研究院的代码捐赠
</a>
</h2>
<p class="archive__item-excerpt" itemprop="description">Apache Servicecomb社区接受新开普软件研究院的代码捐赠
</p>
<p class="page__meta"><i class="fa fa-clock-o" aria-hidden="true"></i>
少于 1 分钟 阅读
</p>
</article>
</div>
<div class="grid__item">
<article class="archive__item" itemscope itemtype="http://schema.org/CreativeWork">
<h2 class="archive__item-title" itemprop="headline">
<a href="/cn/docs/use-oas-validator-help-standardize-oas-spec/" rel="permalink">使用OAS Validator帮助你规范OpenAPI Spec文档
</a>
</h2>
<p class="archive__item-excerpt" itemprop="description">本文将介绍如何规范你的OpenAPI Spec文档
</p>
<p class="page__meta"><i class="fa fa-clock-o" aria-hidden="true"></i>
1 分钟 阅读
</p>
</article>
</div>
</div>
</div>
</div>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<div align="center" style="margin: 0 0;">
<ins class="adsbygoogle"
style="display:block; border-bottom: initial;"
data-ad-client="ca-pub-7328585512091257"
data-ad-slot="3049671934"
data-ad-format="auto"></ins>
</div>
<div class="page__footer">
<footer>
<!-- start custom footer snippets -->
<!-- end custom footer snippets -->
<div class="container">
<div class="row justify-content-md-center">
<div class="col">
<ul>
<p class="header">资源</p>
<li><a href="/cn/docs/quick-start/">入门指南</a></li>
<li><a href="/cn/users/">用户指南</a></li>
<li><a href="/cn/slides/">资料</a></li>
<li><a href="/cn/users/faq/">常见问题</a></li>
</ul>
</div>
<div class="col">
<ul>
<p class="header">ASF</p>
<li><a href="http://www.apache.org">基金会</a></li>
<li><a href="http://www.apache.org/licenses/">许可证</a></li>
<li><a href="http://www.apache.org/events/current-event">活动</a></li>
<li><a href="http://www.apache.org/foundation/sponsorship.html">赞助</a></li>
<li><a href="http://www.apache.org/foundation/thanks.html">鸣谢</a></li>
</ul>
</div>
<div class="col">
<ul>
<p class="header">贡献</p>
<li><a href="http://issues.apache.org/jira/browse/SCB">报告本网页问题</a></li>
<li><a href="https://github.com/apache/servicecomb-website/edit/master/_posts/cn/2019-01-22-servicecomb-springcloud-zuul-demo.md">在Github上编辑此页</a></li>
<li><a href="/cn/developers/submit-codes/">代码提交指南</a></li>
<li><a href="/cn/security">安全</a></li>
</ul>
</div>
<div class="col">
<ul class="social-icons">
<p class="header">社区</p>
<li>
<a href="mailto:dev-subscribe@servicecomb.incubator.apache.org" rel="nofollow"><span class="mail">邮件列表</span></a>
</li>
<li>
<a href="https://github.com/apache?q=ServiceComb" target="_blank"><span class="github">Github</span></a>
</li>
<li>
<a href="https://twitter.com/ServiceComb" target="_blank"><span class="twitter">Twitter</span></a>
</li>
<li>
<a href="/feed.xml" target="_blank"><span class="rss">Feed</span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="page__footer-bottom">
<div>&copy; 2019 Apache ServiceComb. 技术来自于 <a href="http://jekyllrb.com" rel="nofollow">Jekyll</a> &amp; <a href="https://mademistakes.com/work/minimal-mistakes-jekyll-theme/" rel="nofollow">Minimal Mistakes</a>.</div>
<div>All other marks mentioned may be trademarks or registered trademarks of their respective owners.</div>
</div>
</footer>
</div>
<script src="/assets/js/main.min.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-101622733-1', 'auto');
ga('send', 'pageview');
</script>
<script>
(function ($) {
var $comments = $('.js-comments');
$('#new_comment').submit(function () {
var form = this;
$(form).addClass('disabled');
$('#comment-form-submit').html('<i class="fa fa-spinner fa-spin fa-fw"></i> 正在加载...');
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data: $(this).serialize(),
contentType: 'application/x-www-form-urlencoded',
success: function (data) {
$('#comment-form-submit').html('已提交');
$('.page__comments-form .js-notice').removeClass('notice--danger');
$('.page__comments-form .js-notice').addClass('notice--success');
showAlert('感谢您的评论!被批准后它会立即在此站点展示。');
},
error: function (err) {
console.log(err);
$('#comment-form-submit').html('提交评论');
$('.page__comments-form .js-notice').removeClass('notice--success');
$('.page__comments-form .js-notice').addClass('notice--danger');
showAlert('很抱歉,您的提交存在错误。请确保所有必填字段都已填写正确,然后再试一次。');
$(form).removeClass('disabled');
}
});
return false;
});
function showAlert(message) {
$('.page__comments-form .js-notice').removeClass('hidden');
$('.page__comments-form .js-notice-text').html(message);
}
})(jQuery);
</script>
</body>
</html>