学习记录分享

登录 注册
首页 友链 关于 技术交流
SOB | 搜索
综合排序时间浏览量
全部分类Android/iOS测试/运维后台/大数据日常随笔前端/Flutter人工智能编程语言
找到约 6 条结果
阳光沙滩博客系统-手机登录
这个评论是从移动端还是PC端来的。 保存token_key到refreshToken里,需要多一个字段。 3、退出登录和过期:之前是做法是干掉所有的refreshToken记录,重新创建新的。不删除,只修改,如果没有就添加。 修改点: 登录 数据库 解析用户流程 退出登录 测试点: 测试登录,测试PC端登录和移动端登录 (pass) 测试权限的使用是否正常(用户解析)(pass) 退出登录,测试PC端退出登录,移动端退出登录 具体的修改请查看视频吧 课程地址:JavaWeb实现个人博客系统
2020-09-08 15:13 4595 博客系统 手机登录 移动端 安卓开发 android
Dodcker创建Mysql容器
Dodcker创建Mysql容器 我们这里通过docker-compose来创建mysql容器 同学们自行安装好docker和docker-compose ubuntu上安装docker docker-compose安装 创建相关目录 mkdir db mkdir conf mkdir log docker-compose.ytml文件 version: '3.1' services: mysql: container_name: "sob-blog-system-mysql" network_mode: "host" environment: MYSQL_ROOT_PASSWORD: "123456" MYSQL_USER: 'root' MYSQL_PASS: '123456' image: "mysql:5.7.30" restart: always ports: - 3306:3306 volumes: - "/home/aosp/docker/mysql/db:/var/lib/mysql" - "/home/aosp/docker/mysql/conf:/etc/mysql" - "/home/aosp/docker/mysql/log:/var/log/mysql" 自行修改容器名称、mysql的root密码,版本,端口,以及参数文件夹地址。 创建容器 docker-compose up [-d] -d选填,如果有-d则为守护式运行,可以先看看有没有出错,再守护式运行。
2020-09-06 16:19 2473 docker mysql 数据库 博客系统 测试
vue.js下载文件
download === 'undefined') { tempLink.setAttribute('target', '_blank') } // 挂载a标签 document.body.appendChild(tempLink); tempLink.click(); document.body.removeChild(tempLink); // 释放blob URL地址 window.URL.revokeObjectURL(blobURL); } }, 测试 如果要下载Pdf的话,修改一下路径即可。 比如说: convertRes2Blob(response) { // 将二进制流转为blob let blob = new Blob([response]); if (typeof window.navigator.msSaveBlob !== '
2020-09-06 15:46 3110 vue.js 前端 开发 测试 下载
阳光沙滩博客系统的部署
阳光沙滩博客系统的部署 基础环境 我们要有docker的环境,在docker上创建mysql的镜像,redis的镜像,接着构建我们的程序镜像 docker docker的安装,这个同学们可以参考官方的文档 参考文章 ubuntu 完全干净的卸载docker docker-compose安装 Docker安装后修改镜像源 ubuntu上安装docker mysql数据库 Dodcker创建Mysql容器 创建完镜像以后,远程登录一下mysql数据库 一是为了检查是否可以连接成功 二是为了执行sql脚本,创建数据库 脚本同学们请到资料里下载: 资料下载 redis docker搭建redis以及项目配置 Nginx 使用docker创建Nginx服务器容器 部署内容 后台程序 管理中心程序 门户程序 部署后台程序 *要确保已经安装了Java环境 这里面同学借给我们的服务器是2g的内存,所以我们只能省着着了。因此,我们的后台程序,不部署到docker里了,如果要部署到docker上,镜像的创建,请参考后台的课程内容,里面有教如何构建镜像的。 JavaWeb实现个人博客系统-后端 这里面我们直接部署到宿主机上 比如说我们打包出来的程序名称是: sob-blog-system-1.0.0.jar 那么我们的脚本为: nohup java -jar sob-blog-system-1.0.0.jar > sob-blog-system-1.0.0.log 2>&1 & 管理中心的部署 管理中心的部署比较简单,直接构建出来,然后上传到nginx的目录下。 构建命令: vue-cli-service build 低版本的可以 node build/build.js 或者直接点击build按钮 当然啦,build之前,我们得修改一些API,这个具体请看视频。 看到如图,则构建成功! 这个就是生成的目录 把此文件夹的内容 ,上传到nginx的目录下。 门户的部署 门户的部署,我们需要把所有的文件上传到服务器中。 先创建一个文件夹,然后再传所有的文件上去。 接着编写Dockerfile文件 #1、基于镜像node,版本自己查看上面的链接 FROM node:10.15.3 #2、作者 MAINTAINER sunofbeach.net #3、参数,node的环境为生产环境 ENV NODE_ENV=production #4、任意ip ENV HOST 0.0.0.0 #5、容器内创建目录sob-blog-nuxt RUN mkdir -p /sobBlogNuxt #6、复制当前的内容到容器内容部目录blog COPY . /sobBlogNuxt #7、切换工作目录到blog WORKDIR /sobBlogNuxt #8、暴露端口3000,默认端口 EXPOSE 3000 #9、配置npm的远程仓库 #RUN npm install cnpm -g --registry=https://registry.npm.taobao.org #10、清除缓存 RUN npm cache clean --force #11、安装依赖 RUN npm install --no-package-lock #12、构建,生成dist文件 RUN npm run build #13、start CMD ["npm","start"] 构建镜像 docker build -t sob-blog-nuxt1.0 . 后面有个点,不要漏掉哦,等待构建完成。 构建完成镜像以后,要以使用docker images查看一下。 我们再创建一个Dockerfile version: '3.1' services: nginx: restart: always image: sob-blog-nuxt1.0 container_name: sob-blog-nuxt ports: - 8080:3000 启动镜像:docker-compose up -d
2020-09-06 16:18 3346 部署 测试 运维 上线 博客系统
前端侧栏Tab和内容滚动联动切换标题
前端侧栏Tab和内容滚动联动切换标题 我们阳光沙滩博客系统课程里有一个关于页面 我们做成这个样子 点击侧栏可以切换右边内容;滚动右侧内容,可以切换左边的内容。 基本UI实现 左侧使用 ElementUI的组件Tabs https://element.eleme.cn/#/zh-CN/component/tabs 同学们可以去这里使用,至于怎么依赖ElementUI,可以参考官方说明,或者学习我们的前端课程。
右侧布局

关于阳光沙滩

阳光沙滩创立于2014年11月22日,那是一个阳光明媚的下午。韩寒的电影《后会无期》里面有一句台词:sun of beach (阳光沙滩),于是阳光沙滩创立。阳光沙滩是一个学习编程的社区网站。 你可以在这里学习,写博客,写笔记,分享经验,提问题,分享链接。你可以遇到志同道合的人,收获知识、经验与同性朋友。

我们的使命

让学习编程变得更加简单。

我们的愿景

让每一个热爱编程的年轻人成为优秀的程序员。

旗下网站

  • 阳光沙滩主站
  • 阳光沙滩商城
  • 阳光沙滩网店

联系我们

广告投放 ad@sunofbeach.net(仅作演示)
商务合作 bd@sunofbeach.net(仅作演示)
内容投诉 rp@sunofbeach.net(仅作演示)

左边固定,右边加个margin值。 事件处理 事件主要包括两部分:滚动、点击左侧 滚动 滚动的话,我们需要处理侧栏悬浮 添加滚动监听: mounted() { ...... window.addEventListener("scroll", this.onWindowScroll); this.onWindowScroll(); }, 记得删除监听哦 beforeDestroy() { window.removeEventListener('scroll', this.onWindowScroll); }, 这里面就是滑动的代码了 onWindowScroll() { let dy = document.documentElement.scrollTop; let dx = document.documentElement.scrollLeft; let leftBox = document.getElementById('about-left-part'); let parentBox = document.getElementById('about-box'); if (leftBox && parentBox) { let parentBoxTop = parentBox.offsetTop; // console.log(parentBoxTop); if (dy > parentBoxTop) { leftBox.style.top = '0px'; } else { leftBox.style.top = (parentBoxTop - dy) + 'px'; } //处理横向滑动 if (dx > 0) { leftBox.style.left = -dx + "px"; } else { leftBox.style.left = parentBox.offsetLeft + "px"; } } if (!this.isClickLeftSwitch) { //处理标签的滚动范围 for (let i = 0; i < this.contentHeaders.length - 1; i++) { let first = this.contentHeaders[i]; let second = this.contentHeaders[i + 1]; if (dy >= first.offTop && dy < second.offTop) { this.target = first.id; //console.log(this.target); break; } } } else { this.isClickLeftSwitch = false; } 点击事件处理 onLeftItemClick() { this.isClickLeftSwitch = true; this.$router.push({ path: '/about#' + this.target }); // console.log(this.target); } 具体的话请去视频教程吧
2020-09-06 16:20 3187 博客系统 前端开发 毕业设计 测试 门户
RecyclerView显示多种类型
RecyclerView显示多种类型 对于这个问题我也好无语呀,这个很简单呀。 纯体力活。 RecyclerView课程地址 Android控件之RecyclerView 相关提问: Recycleview 多种条目类型 如何绑定数据 案例源码地址: https://github.com/TrillGates/RecyclerViewMultiTypeDemo 效果: 解析 网络权限 主布局activity_main.xml 主Activity:MainActivity.kt class MainActivity : AppCompatActivity() { private val contentAdapter by lazy { ContentListAdapter() } override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) //初始化数据 initData() //初始化控件 initView() } private fun initView() { contentListView.apply { layoutManager = LinearLayoutManager(this@MainActivity) this.adapter = contentAdapter addItemDecoration(object : RecyclerView.ItemDecoration() { override fun getItemOffsets( outRect: Rect, view: View, parent: RecyclerView, state: RecyclerView.State ) { outRect.bottom = 2 } }) } } private fun initData() { val dataJson = requestData.resultJson val gson = Gson() val response = gson.fromJson(dataJson, Response::class.java) contentAdapter.addData(response.data) println(response.code) println(response.message) println(response.data.size) } } 适配器ContentListAdapter.kt class ContentListAdapter : RecyclerView.Adapter() { private val data = ArrayList() companion object { const val NONE_IMG: Int = 0 const val ONE_IMG: Int = 1 const val TWO_IMG: Int = 2 const val THREE_IMG: Int = 3 } fun addData(contents: List) { data.clear() data.addAll(contents) notifyDataSetChanged() } class InnerHolder(itemView: View) : RecyclerView.ViewHolder(itemView) { } override fun getItemViewType(position: Int): Int { return when (data[position].covers.size) { 0 -> NONE_IMG 1 -> ONE_IMG 2 -> TWO_IMG else -> THREE_IMG } } override fun onCreateViewHolder( parent: ViewGroup, viewType: Int ): InnerHolder { val itemView: View when (viewType) { NONE_IMG -> { val itemBind = DataBindingUtil.inflate( LayoutInflater.from(parent.context), R.layout.item_no_image, parent, false ) itemView = itemBind.root itemView.tag = itemBind } ONE_IMG -> { val itemBind = DataBindingUtil.inflate( LayoutInflater.from(parent.context), R.layout.item_one_image, parent, false ) itemView = itemBind.root itemView.tag = itemBind } TWO_IMG -> { val itemBind = DataBindingUtil.inflate( LayoutInflater.from(parent.context), R.layout.item_two_image, parent, false ) itemView = itemBind.root itemView.tag = itemBind } else -> { val itemBind = DataBindingUtil.inflate( LayoutInflater.from(parent.context), R.layout.item_three_image, parent, false ) itemView = itemBind.root itemView.tag = itemBind } } return InnerHolder(itemView) } override fun getItemCount(): Int { return data.size } override fun onBindViewHolder(holder: InnerHolder, position: Int) { val dataBinding = holder.itemView.tag val data = data[position] when (dataBinding) { is ItemNoImageBinding -> { dataBinding.item = data } is ItemOneImageBinding -> { dataBinding.item = data } is ItemTwoImageBinding -> { dataBinding.item = data } is ItemThreeImageBinding -> { dataBinding.item = data } } } } 数据bean类 data class ListItem( val title: String, val covers: ArrayList, val viewCount: Int, val commentCount: Int ); 图片加载工具类 class ImageLoadUtils { companion object { @BindingAdapter("imagePath") @JvmStatic fun loadImage(image: ImageView, imageUrl: String?) { if (!TextUtils.isEmpty(imageUrl)) { Glide.with(image.context).load(imageUrl).into(image) } } } } 布局之类的代码请下载吧。 就是这么简单,全部代码请到github上载。 RecyclerViewMultiTypeDemo
2020-09-06 16:22 3976 安卓开发 RecyclerView 控件 博客系统 测试
<<上一页
下一页 >>
热门标签
赞助商广告

    Copyright © 阳光沙滩 (2014-2020) 本网站由程序猿(媛)用爱驱动

    关于我们 联系我们 友情链接 粤ICP备14093694号
    回到
    顶部