微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅


SpringBoot+Maven+MabatisPlus+Vue

    • 草稿(完成全部项目后再修改)
    • maven在新建springboot项目引入RELEASE版本出错
    • pom.xml文件存在非法字符
    • @注解
    • MP主键 ID_WORKER/ID_WORKER_STR和AUTO注意事项
    • 自定义统一返回JSON字符串以及配置使用
    • 统一数据库和项目传递的SQL语句的编码规则为UTF-8
    • 前端不同VS终端环境下使用babel和webpack等工具
    • npm模块化处理ES6语法的js文件出错
    • webpack打包 错误提示 Error: Can't resolve 'css-loader'或Error: Can't resolve 'style-loader'
    • npm install安装vue模板的依赖出错
    • 跨域问题(Access-Control-Allow-Origin)
    • 新建项目后java文件夹是普通文件夹类型
    • springboot项目启动时加载配置文件出错
    • nginx安装配置后启动出错
    • 修改文件时单词拼写错误
    • 前端属性名和后端接口参数名称不一致

草稿(完成全部项目后再修改) 微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

添加不同项目(微服务),具有不同的端口号
文件上传:图片上传到OSS,文件上传到后端处理数据后存到数据库
maven在新建springboot项目引入RELEASE版本出错 maven笔记
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

springframework.boot:spring-boot-starter-parent:2.2.1.RELEASE’ not found
若出现jar包下载不了只有两个办法
要么换个仓库,要么换个版本
解决办法
因为RELEASE版本是不稳定的,于是需要指定spring的仓库,在pom.xml最后,project里面添加如下代码,然后保存pom.xml文件,就会重新从repo.spring.io中引入jar包:`
spring-snapshots http://repo.spring.io/libs-snapshot spring-snapshots http://repo.spring.io/libs-snapshot

pom.xml文件存在非法字符 报错:Element ‘project’ cannot have character [children], because the type’s content type is element-only.
原因:pom中存在非法字符
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

@注解 spring
  • 简单粗暴介绍:使用注解的类都是交给spring管理,需要spring实例化出bean对象,这样才能调用对应实例方法处理需求。
    spring中的bean都是项目装配启动时要实例化的bean,这样才能使用bean调用实例化方法提供服务。
  • java网站开发(请求-响应模型):url触发bean然后调用方法从而进行逻辑处理最后返回结果,而框架会根据设置的单例或者多例进行bean的管理。
例如:
@controller,只有项目启动时提前实例化bean才能对前端传递的需求进行处理。
MP主键 ID_WORKER/ID_WORKER_STR和AUTO注意事项 微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

自定义统一返回JSON字符串以及配置使用 微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

最后返回一个R的实例对象,封装为JSON形式。
统一数据库和项目传递的SQL语句的编码规则为UTF-8 url=jdbc:mysql://localhost:3306/education?useUnicode=true&characterEncoding=utf-8
涉及汉字操作需要设置?useUnicode=true&characterEncoding=utf-8用来统一编码规则。
因为有关汉字的编码规则有很多,需要统一编码规则才不会解码出错。
而乱码的原因就是编码和解码的规则不统一
之前无汉字不会出错的原因是UTF-8兼容ASCALL编码。
信息编码部分
# 服务端口 #http://localhost:8001/eduservice/teacher/ server.port=8001 # 服务名 spring.application.name=service-edu # 环境设置:dev、test、prod spring.profiles.active=dev # mysql数据库连接 spring.datasource.driver-class-name=com.mysql.jdbc.Driver spring.datasource.url=jdbc:mysql://localhost:3306/education?useUnicode=true&characterEncoding=utf-8 #涉及汉字操作需要设置?useUnicode=true&characterEncoding=utf-8用来统一编码。 spring.datasource.username=root spring.datasource.password= #mybatis日志,可以查看使用的SQL语句 mybatis-plus.configuration.log-impl=org.apache.ibatis.logging.stdout.StdOutImpl

前端不同VS终端环境下使用babel和webpack等工具 在powershell中使用babel --version
babel : 无法加载文件 C:\Users\hp\AppData\Roaming\npm\babel.ps1,因为在此系统上禁止运行脚本。
powershell和cmd
个人猜测cmd可以运行babel的原因是因为cmd的配置简单,所以缺少插件的识别作用,可以直接运行babel,而powershell工作详细,识别权限然后阻止babel运行。
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

总结:powershell安装配置前端工具,cmd使用前端工具。
npm模块化处理ES6语法的js文件出错 ES6入门
Cannot use import statement outside a module
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

解决办法
在package.json中添加
“type”:“module”
声明要进行ES6语法的模块化处理。
若是处理ES5语法的模块化就不需要声明了,否则会导致以下问题
require is not defined in ES module scope, you can use import instead
拓展:
  • ES5使用exports 和require 来导出、导入模块
  • ES6使用 export 和 import 来导出、导入模块
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

webpack打包 错误提示 Error: Can’t resolve 'css-loader’或Error: Can’t resolve ‘style-loader’ 原答案
报错提示
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

1.网上查资料发现原来’css-loader’和’style-loader’未安装
2.正确做法cnpm install css-loader style-loader --save
3.打包运行成功
npm install安装vue模板的依赖出错 npm8.3.1版本-这个解决方案是使用的是未安装依赖的vue-admin-template-master。如果想看自己安装依赖的话
这边小结一下:
  1. 需要使用cnpm,可以看成的npm升级版:cnpm安装命令:npm install cnpm -g
  2. 本来是打算自己下载依赖的,结果发现下载不了,转成使用现成的vue-element-admin-master,也就是视频中的1010项目。
  3. 这个项目和npm7版本可能有冲突,因为我这里启动的时候发现找不到命令,解决办法是删除node_modules文件夹,使用cnpm install重新安装.
具体步骤:
  1. 导入下载好依赖的步骤
  2. 安装cnpm :npm install cnpm -g
  3. 安装 node-sass: cnpm install node-sass
  4. 继续安装 : cnpm i node-sass -D
  5. 删除node_modules文件夹
  6. 根据package.json重新安装依赖:cnpm install
  7. 启动项目:npm run dev
跨域问题(Access-Control-Allow-Origin) 跨域问题的本质就是前后端交互失败,比如:忘记开nginx以致于无后端响应,也会导致跨域问题
http:本地的协议
https:认证过的协议
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

  • @CrossOrigin//解决跨域问题
    端口号,协议,IP地址不同会导致跨域,但是同一个电脑端口号又不能相同,否则会导致占用问题,不能同时使用一个端口号
  • 跨域问题:也可能是后端和前端的请求方式不对应。
新建项目后java文件夹是普通文件夹类型 【微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅】微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

springboot项目启动时加载配置文件出错 Failed to configure a DataSource: 'url' attribute is not specified and no embedded datasource could be configured.
错误原因:springboot项目启动的时候加载resources中的application.properties全局配置文件,加载时没有找到有关数据库配置。
但是当前项目不需要使用数据库配置,所以没有配置数据库,解决办法如图所示。
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

nginx安装配置后启动出错 nginx: [emerg] bind() to 0.0.0.0:80 failed (10013: An attempt was made to access a socket in a way forbidden by its access permissions)
nginx的配置文件一开始默认是80端口,出现这个错误多半是80端口已经被占用。这时候只需要把
server { listen 80; server_name localhost lcsf.com; #charset koi8-r; #access_log logs/host.access.log main; location / { proxy_pass http://lcsf.com; proxy_redirect default; }

这个地方的listen改成一个没有被占用过的端口然后重启nginx就可以解决,例如81
微服务|尚硅谷_谷粒学苑-微服务+全栈在线教育实战项目之旅
文章图片

修改文件时单词拼写错误 localtion是错误的,正确的是location
localhost是正确的
前端属性名和后端接口参数名称不一致 前端标识符属性值和后端参数名称(实体类中属性名)保持一致,否则无法直接映射传参,导致后端接收不到数据。

    推荐阅读