4、分布式组件-SpringCloud Alibaba简介
注册中心
配置中心
网关
结合SpringCloud Alibaba我们最终的技术搭配方案
SpringCloud Alibaba - Nacos:注册中心(服务发现/注册)
SpringCloud Alibaba - Nacos:配置中心(动态配置管理)
SpringCloud - Ribbon:负载均衡
SpringCloud - Feign:生声明式HTTP客户端(调用远程服务)
SpringCloud Alibab - Sentinel:服务容错(限流、降级、熔断)
SpringCloud - Gateway:API网关(webflux编程模式)
SpringCloud - Sleuth:调用链监控
SpringCloud Alibab - Seata:原 Fescar:即分布式事务解决方案
在common的pom.xml中加入
<dependencyManagement>
<dependencies>
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-alibaba-dependencies</artifactId>
<version>2021.0.1.0</version>
<type>pom</type>
<scope>import</scope>
</dependency>
</dependencies>
</dependencyManagement>
springBoot和springloud和springCloudAlibab版本号要对应上
4.1、Nacos注册中心
在common模块下pom里引入nacos注册中心依赖
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-starter-alibaba-nacos-discovery</artifactId>
</dependency>
下载nacos地址,可以选择版本
https://github.com/alibaba/nacos/releases
解压nacos
启动nacos
双击bin中的startup.cmd文件
访问http://localhost:8848/nacos
使用默认的nacos/nacos进行登陆
在需要注册nacos的模块yml下配置nacos和服务名称
spring:
cloud:
nacos:
discovery:
server-addr: 127.0.0.1:8848
application:
name: gulimall-product
在需要注册nacos的模块GulimallProductApplication启动类上加上注解
@EnableDiscoveryClient
nacos客户端上发现注册的服务
4.2、远程调用Feign
A调用B
在A和B的pom下引入依赖,在创建Springboot时可以选择feign
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-starter-openfeign</artifactId>
</dependency>
在被调用的服务B的controller中写一个RequestMapping(“/member/list”)方法
@RequestMapping("/member/list")
public R membercoupons() {
CouponEntity couponEntity = new CouponEntity();
couponEntity.setCouponName("满100减10");
return R.ok().put("coupons", Arrays.asList(couponEntity));
}
A调用方创建一个feign的包,创建一个feignService接口,加入@FeignClient(“gulimall-coupon”)注解
gulimall-coupon:被调用服务name名称,如下
/**
* 解释:
* 当调用CouponFeignService下membercoupons这个方法时,
* 会去注册中心找gulimall-coupon这个服务的/coupon/coupon/member/list这个方法
*/
@FeignClient("gulimall-coupon")
public interface CouponFeignService {
@RequestMapping("/coupon/coupon/member/list")
public R membercoupons();
}
A调用方的启动类中接入注解
作用:启动时扫描feign包
@EnableFeignClients("com.atguigu.gulimall.member.feign")
A调用方需要调用时调用接口下这个方法即可
couponFeignService.membercoupons();
因为版本问题如果不好使,需要在A调用方加入一下依赖
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-loadbalancer</artifactId>
</dependency>
4.3、nacos配置中心
1、在common通用服务下引入依赖,所有引入common的服务都可以使用nacos服务注册
<dependency>
<groupId>com.alibaba.cloud</groupId>
<artifactId>spring-cloud-starter-alibaba-nacos-config</artifactId>
</dependency>
2、在需要加入nacos配置中心的模块下创建bootstrap.properties文件
spring.application.name=gulimall-coupon // 服务名称
spring.cloud.nacos.config.server-addr=127.0.0.1:8848 // nacso服务启动
3、在controller中加入nacos配置中心不用重启刷新注解
// 配置中心刷新注解
@RefreshScope
4、在nacos配置中心配置
5、访问测试
@Value("${aaa.user.name}")
private String name;
@Value("${aaa.user.age}")
private Integer age;
@RequestMapping("/test")
public R test(){
return R.ok().put("name",name).put("age",age);
}
6、如果配置不成功需要在springboot加入以下依赖
解释:在SpringBoot 2.4.x的版本之后,对于bootstrap.properties/bootstrap.yaml配置文件(我们合起来成为Bootstrap配置文件)的支持,需要导入如下的依赖
<dependency>
<groupId>org.springframework.cloud</groupId>
<artifactId>spring-cloud-starter-bootstrap</artifactId>
<version>3.1.0</version>
</dependency>
7、nacos命名空间
服务隔离
需要在bootstrap.properties下指定配置管理
spring.cloud.nacos.config.namespace=1b6e5cae-3994-4cba-af8d-fc372bf22a2a
服务下分组隔离
需要在bootstrap.properties下指定配置管理
spring.cloud.nacos.config.group=dev
总结:
1、nacos可以一个命名空间供所有的服务使用
2、nacos可以一个命名空间对应一个服务
3、nacos可以一个命名空间对应一个服务下多个分组,实现单个服务下环境隔离
4.4、Gateway网关
简介:网关作为流量的入口,常用功能包括路由转发、权限效验、限流控制等,而springCloud gateway作为springCloud官方推出的第二代网关框架,取代了Zuul网关。
4.4.1、创建Gateway网关服务
新建module
4.4.2、在pom文件里引入common服务
4.4.3、更改springboot和springcloud版本
4.4.4、开启服务注册发现,在启动类上加注解
@EnableDiscoveryClient
4.4.5、gateway网关不需要数据库,但是引入了common,需要在启动类注解上排除数据库相关配置
4.4.6、服务配置中心
创建bootstrap.properties文件,配置数据
spring.application.name=gulimall-gateway // 服务名称
spring.cloud.nacos.config.server-addr=127.0.0.1:8848 // nacos端口
spring.cloud.nacos.config.namespace=0a798bc0-9267-4676-bed1-4a6ef00911f2 // nacos的dataId
nacos客户端
5、前端知识
5.1、ES6
ECMAScript6.0(以下简称ES6,ECMAScript是一种由Ecma国际通过ECMA-262标准化的脚本),
是JavaScript语言的下一代标准,2015年6月正式发布,从ES6开始的版本号采用年号,如ES2015,就是ES6。ES2016就是ES7。
ECMAScript是规范,JS的规范的具体实现。
5.1.1、let和var和const
var在{}之外也起作用
{
var a = 20;
}
console.log(a); //20
let在{}之外不起作用
{
let b = 22;
}
console.log(b); // 报错
var多次声明同一变量不会报错,let多次声明会报错,只能声明一次。
var a = 10;
var a = 20;
let b = 15;
let b = 25; // 报错
var 会变量提升(打印和定义可以顺序反)。let 不存在变量提升(顺序不能反)
console.log(a);// undefined 未定义
console.log(b);// Cannot access 'b' before initialization
var a = 10;
let b = 20;
const(常量)声明之后不允许改变
const a = 10;
a = 20;
console.log(a); //报错 Assignment to constant variable.
5.1.2、结构表达式
1、数组结构
// 数组结构
let arr = [1,2,3];
let a = arr[0];
let b = arr[1];
let c = arr[2];
let [q,w,e] = arr;
console.log(q,w,e); // 1 2 3
2、对象结构
// 对象结构
const person = {
name:"jack",
age:21,
language:["java","js","css"]
}
const {name:abc,age,language} = person;
console.log(abc,age,language); // jack 21 ['java', 'js', 'css']
3、字符串扩展
// 字符串扩展
let str = "hello.vue";
// 是否以hello开头
console.log(str.startsWith("hello")); //true
// 是否以vue结尾
console.log(str.endsWith("vue")); //true
/// 是否包含e
console.log(str.includes("e")); //true
3.1、对象
4、模块化
模块化就是把代码进行拆分,方便重复利用。类似于java中的导包,而JS换了个概念,是导模块。
模块功能主要有两个命令构成 export 和import
export用于规定模块的对外接口
import用于导入其他模块提供的功能
user.js
var name = "jack"
var age = 21
function add(a,b){
return a + b;
}
让别人调用。类似java里的get和set
export {name,age,add}
分割线-----------------------------
hello.js
export const util = {
sum(a, b) {
return a + b;
}
}
如果是default在导包调用的时候可以随意的起名字
export default {
sum(a, b) {
return a + b;
}
}
export {util}
分割线----------------------------
// `export`不仅可以导出对象,一切JS变量都可以导出。比如:基本类型变量、函数、数组、对象。
main.js
import abc from "./hello.js"
import {name,add} from "./user.js"
abc.sum(1,2);
console.log(name);
add(1,3);
5、目录调用
./ : 表示引用当前同级目录下的文件
5.2、VUE
执行:npm init -y,让npm管理
npm init -y
执行npm install vue@2.6.10 ,执行版本
npm install vue,是直接执行最新版vue
npm install vue@2.6.10
vscond安装: Vue 2 Snippets:语法提示
vue指令
v-on:click :单击事件
v-model :赋值
{{name}} :插值表达式
{{hello()}} :方法的返回值
<div id="app">
<input type="text" v-model="num">
v-model实现双向绑定
<button v-on:click="num++">点赞</button>
v-on:click绑定事件,实现自增
<button v-on:click="cancel">取消</button>
回到自定义的方法
<h1> {{name}} ,非常帅,有{{num}}个人为他点赞{{hello()}}</h1>
</div>
<!-- 导入依赖 -->
<script src="./node_modules/vue/dist/vue.js"></script>
<script>
//1、vue声明式渲染
let vm = new Vue({ //生成vue对象
el: "#app",//绑定元素 div id="app"
data: { //封装数据
name: "李四", // 也可以使用{} //表单中可以取出
num: 1
},
methods:{ //封装方法
cancel(){
this.num -- ;
},
hello(){
return "1"
}
}
});
// 还可以在html控制台vm.name
//2、双向绑定,模型变化,视图变化。反之亦然。
//3、事件处理
//v-xx:指令
//1、创建vue实例,关联页面的模板,将自己的数据(data)渲染到关联的模板,响应式的
//2、指令来简化对dom的一些操作。
//3、声明方法来做更复杂的操作。methods里面可以封装方法。
</script>