Web相关技术
个人Web相关技术专栏,涉及基础知识和进价知识,提供给自己或博友查阅
IT1995
每周个人笔记分享,欢迎广大网友查阅!
展开
-
帆软笔记-表格中自定义现实
在高级,自定义显示中,使用公式,如果不知道公式语法,可以看右下角的公式说明。是否生效查询的时候为1和0,对应的字段是ENABLE,其中1为是,0为否。原创 2024-01-08 08:40:31 · 898 阅读 · 0 评论 -
Vue笔记-在axios中的than函数中使用this需要注意的地方
在Vue中,可以使用this关键字来访问到组件中定义的变量。然而,在axios的then函数中,this关键字的作用域会改变,会指向axios对象本身而不是Vue组件实例。使用箭头函数的好处是不需要额外保存this关键字的值,直接在then函数中使用this关键字来访问Vue组件的变量即可。解决这个问题的一种方法是将Vue组件中定义的变量保存到一个变量中,然后在axios的then函数中使用该变量。另外,也可以使用箭头函数来解决this关键字作用域的问题,因为箭头函数会继承父级作用域的this值。原创 2023-12-11 09:28:34 · 1395 阅读 · 0 评论 -
Web笔记-修改BootStrap5中col标签的间距
这里以BootStrap5为例,估计3和4的思路是一样的。效果是这样的,将这样的效果:改成这样的效果:首先看下BootStrap对col的css描述: 从中可以看到关键的地方就是那个padding-right和padding-left,都是15px,造成的间距空隙过大。对此修改即可:在app.css或者app.scss中,或者自己新建一个css重新加载下: 意思就是,将class为col-*的,后面是通配符,的padding-right和padding-left都改为1px,就可以实现上面的效果原创 2022-07-12 08:52:23 · 1715 阅读 · 0 评论 -
PHP笔记-虚拟空间(虚拟主机)上部署Laravel5.7
网上关于这方面的资料不多,大多是提供思路,估计国内学习Laravel的人不多,学了Laravel后大部分人都用云主机,用虚拟空间(虚拟主机)的人不多,所以很容易出现问题,这里我总结下。我这里的Laravel是5.7版本。①将除public的项目放到local中②将public里面的文件,剪切到wwwroot下面:③修改wwwroot下面的。index.php将这里的..换成local。④删除/wwwroot/local/bootstrap/cache下面的所有文件:⑤删除/wwwroot/local/sto原创 2022-06-16 08:48:37 · 744 阅读 · 0 评论 -
PHP笔记-laravel框架记录session中flash()的一次应用
我这里有个表单提交页面,他的url是get方法/hasLogoIndex。表单提交是post方法/hashLogoSubmit,提交表单后,验证各个参数是否正确,调用三方http的API,得到结果,然后回给/hasLogoIndex页面。也就是重定向到表单提交页面,并且有些图片方面的提示,也在那个页面显示,这里就可以使用flash了。表单页面函数:表单提交函数:原理:submit中通过$request->session()->flash()把参数写入,这个flash相当于一次性的。取出后就无用了原创 2022-06-14 08:50:17 · 815 阅读 · 0 评论 -
GitHub笔记-创建新仓库并将项目初始版本push上去
这里以Windows为例。window上要安装好Git配置好Git的用户名和邮箱生成公钥和私钥按三次回车就可以了。安装好后,申请好github帐号。添加好SSH Keys将刚刚生成好的公钥添加到key里面,在点击Add SSH Key就可以了。 上面这个命令是拿刚刚的公钥。下面创建一个新的repository输入Repository name,即可。这里我推Laravel上去。进入本地项目文件后初始化:上传 这里所有的数都在main这主支上了。...原创 2022-06-07 08:49:47 · 479 阅读 · 0 评论 -
Web前端笔记-使用Webpack调用echarts画图
有如下几个步骤,在此记录下!1. 安装npm;2. 安装cnpm;3. 初始化webpack项目:npm init -y3. 下载依赖:cnpm i -D webpack webpack-cli4. 下载echarts依赖:cnpm i -S echarts5. 这个时候会出现node_modules的文件夹,新建src目录以及src/index.js,新建/index.html及webpack.config.js这里将package.json中的:"原创 2020-11-19 15:23:00 · 656 阅读 · 0 评论 -
Web笔记-html中svg的基本使用
程序运行截图如下:代码如下:<!DOCTYPE html><html><head></head><body> <svg width="200" height="200"> <rect x="0" y="0" width="100" height="100" fill="red"></rect> <line x1="100" y1="0" x2=原创 2020-11-17 22:04:44 · 1313 阅读 · 1 评论 -
Spring Boot笔记-logback-spring.xml获取application.properties中的变量
logback.xml的加载顺序早于springboot的application.yml (或application.properties) 配置文件当然读不到application.yml(或application.properties)文件中的值了。需要通过springProperty标签来引用:<springProperty scope="context" name="log.path" source="path.log"/>这里的name和上面property标签。如..原创 2020-10-28 06:45:52 · 7425 阅读 · 0 评论 -
Java笔记-使用logback按天生成日志并按等级进行分类
按照:error、info、warn进行分类:每个文件里面按日期进行分类:其中对应的Maven如下:<?xml version="1.0" encoding="UTF-8"?><project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.原创 2020-10-17 09:07:34 · 1083 阅读 · 0 评论 -
Java笔记-连接本地代理服务
我这里是这样的:有一个代理端口为1080使用*****,想要程序也用代理,需要设置下(小飞机默认情况下,只有浏览器会走那个,你们懂的,程序默认不走)String proxyHost = "127.0.0.1";String proxyPort = "1080";System.setProperty("http.proxyHost", proxyHost);System.setProperty("http.proxyPort", proxyPort);System.setP.原创 2020-10-17 09:05:31 · 697 阅读 · 0 评论 -
Java笔记-解决java.lang.ClassCastException: javax.xml.bind.JAXBElement cannot be cast to
maven是这样的 <dependencies> ..... ..... ..... <!-- web service 相关 --> <dependency> <groupId>org.springframework.ws</groupId> <artifactId>spring-ws-security</artifactId&原创 2020-10-17 08:50:44 · 2067 阅读 · 0 评论 -
Java文档阅读笔记-Spring Boot JDBC
Spring Boot JDBC提供了使用引导和相关驱动去连接某数据库引用。在Spring Boot JDBC中与数据库相关的bean有DataSouce,JdbcTemplate,NamedParamenterJdbcTemplate。在我们需要使用他的时候,可以使用自动注入的方式,如下例子:@Autowired JdbcTemplate jdbcTemplate; @Autowired private NamedParameterJdbcTemplate jdbcTemplate;原创 2020-10-17 08:46:10 · 485 阅读 · 0 评论 -
Java笔记-Spring Boot使用外部Tomcat及解决Tomcat乱码
首先是解决Tomcat打印乱码问题:修改conf/logging.propertiesjava.util.logging.ConsoleHandler.encoding = GBK如下:即可下面是Spring Boot项目使用外部Tomcatmaven配置:移除嵌入式tomcat:<dependency> <groupId>org.springframework.boot</groupId> <arti原创 2020-10-17 08:42:25 · 1205 阅读 · 0 评论 -
Java笔记-对tomcat进一步认识
tomcat是一个servlet容器。当编写servlet的时候:public class MyHttpServlet extends HttpServlet{ @Override protected void doGet(HttpServeltRequest req, HttpServletResponse resp){ }}这里的HttpServeletRequest和HttpServletResponse其实是接口。tomcat将这两个实例化后,就传给Servlet。逻辑原创 2020-09-08 10:54:51 · 623 阅读 · 0 评论 -
Java笔记-Spring Boot JDBC连接Oracle数据库
首先介绍几个Oracle相关的知识!使用sqlplus进行登录%sqlplusEnter user-name:Enter password:查询数据库版本:select * from v$version;Oracle的jdbc在只能在../oracle/app/product/11.2.0/dbhome_1/jdbc/lib下面有ojdbc6.jar,ojdbc5.jarmvn install:install-file -Dfile=ojdbc6.jar -Dgrou原创 2020-08-28 09:06:21 · 4168 阅读 · 0 评论 -
Java笔记-Spring Boot SSL(https)实例
此篇博文记录了在web程序中使用自签名的SSL(HTTPS)证书及创建SSL认证。SSL关键的配置Spring Boot中HTTPS的配置(application.properties)server.port=8443server.ssl.key-alias=selfsigned_localhost_sslserverserver.ssl.key-password=changeitserver.ssl.key-store=classpath:ssl-server.jksserve.原创 2020-08-27 08:32:24 · 1913 阅读 · 0 评论 -
Java笔记-CXF增加拦截器与自定义拦截器
如下搭建的Webservice:在服务端填写如下代码:这里就是添加进和出的拦截器public class Main { public static void main(String[] args) { MyService myService = new MyServiceImpl(); JaxWsServerFactoryBean factoryBean = new JaxWsServerFactoryBean(); fact原创 2020-08-18 09:47:40 · 1031 阅读 · 0 评论 -
HTTPS-客户端与服务器三次握手过程(含wireshark分析)
流程是这个样子的大体流程是这样的!客户端生成一个随机数,然后把支持的加密套发给服务器:服务器那边随后生成一个随机数,然后把旋转的加密套给客户端:然后服务器把证书(公钥给客户端):并且告诉客户端Over,也就是对应的Server Ky Exchange, Server Hello Done然后客户端拿着服务器的随机数和证书生成预主密钥发给服务端:然后客户端在给服务端说,我现在准备刚刚商量的进行加密了你接收下(客户端随机数 + 服务端随机数 + 预主密钥 =原创 2020-08-11 08:48:00 · 1292 阅读 · 1 评论 -
Java笔记-CXF使用Adapter处理复杂类型(如Map)
当有这个接口时:Map<String, List<Role>>时报如下问题:这里要使用Adapter进行处理:接口换成:@WebServicepublic interface MyService { public String say(String str); @XmlJavaTypeAdapter(MapAdapter.class) public Map<String, List<Role>> getR原创 2020-08-11 08:44:53 · 759 阅读 · 0 评论 -
Java笔记-使用CXF开发WebService服务器
这里使用CXF开发WebService,要引入下面这个Maven <dependency> <groupId>org.apache.cxf</groupId> <artifactId>cxf-core</artifactId> <version>3.1.6</version> </dependency>原创 2020-08-11 08:41:50 · 751 阅读 · 0 评论 -
Nginx&Java笔记-Webservice使用HTTPS协议及Spring Boot配置tomcat
这里最后的效果如下:并且此处soap:address已经换成了https。这里使用Nginx相关配置:server { listen 443 ssl; server_name webservice.it1995.cn; ssl_certificate /root/web/SSL/webservice.it1995.cn.pem; ssl_certificate_key /root/web/SSL/webservice.i.原创 2020-08-11 08:39:50 · 1364 阅读 · 0 评论 -
Web前端笔记-two.js加载图片
目前关于two.js的资料,国内的不是很多,项目中要加载图片,官方文档上没有关于加载图片的相关资料,但在github生态圈找到了,在此记录下。如下图片:图片路径:在JS文件中导入图片:import img from '@/assets/image/pic1.png'代码如下:let pic = two.makeTexture(img);let shape = two.makeRectangle(3000, 3000, 100, 100);shape.fill = pi原创 2020-07-21 08:44:20 · 920 阅读 · 1 评论 -
Web前端笔记-js中加载图片文件(vue cli中同样适用)
这里主要是在vuecli项目中加载图片的时候会出现304,特别是使用自己写的js加载图片的时候,此博文记录了解决办法。在js文件中引用文件import img from '@/assets/image/pic1.png'然后在参数上填写img即可,如下:...原创 2020-07-21 08:37:12 · 1164 阅读 · 0 评论 -
Web前端笔记-字符串自适应tip提示框(适应大小&自动换行&JS中静态工具类实现)思路
程序运行截图如下:下面提几个知识点。第一个是JS中实现静态类,如下utils.jsexport let HHUtils = {}HHUtils .StaticClass = (function(){ let Return = { xxxxxxx: function(xxxx){ let ret= 0; return ret; }, yyyyyyy: function(xxxx, yyyy){ let ret;原创 2020-07-17 08:30:54 · 1301 阅读 · 0 评论 -
Web前端笔记-2D图形平面内平移定位(two.js)
此处是在控制台中输入了window.mainPage.flyToPosition(-1000,500),他是经过平移过去的。整个坐标盘是这样的:这里使用two.bind(‘update’,function(frameCount){})用于平移时的绑定跟新,当平移结束后,使用two.unbind(‘update’);平移相关的代码:export function flyTo({x, y}){ waterWave(x, y); //计算出目前中心点与x,y坐标的差值 ..原创 2020-07-14 09:28:10 · 1381 阅读 · 0 评论 -
Web前端笔记-圆环随时间逐渐缩小(使用two.js)
这里给出效果图:这里就给出截图,不搞gif了:运行时:这里主要是使用了setInterval去操作的,并且设置的timeout为0,这样的效果是比较好的。关键代码如下:画图相关文件:;import * as Two from "JS/two";import * as $ from "JS/jquery";let two;let mouse;let isPressed = false;let originalPositionX = 0;let origi原创 2020-07-14 09:23:19 · 884 阅读 · 0 评论 -
Web前端笔记-two.js实现坐标定位(动画效果非瞬移定位)
先来看下程序运行截图:画图相关代码:;import * as Two from "JS/two";import * as $ from "JS/jquery";let two;let mouse;let isPressed = false;let originalPositionX = 0;let originalPositionY = 0;let map = new Map();let rect;let TWO_PI = Math.PI * 2;export fu原创 2020-07-14 09:14:02 · 1352 阅读 · 0 评论 -
Web前端笔记-two.js图形旋转动画的2种实现方式
这里有两种方式!第一种是使用setInterval:代码如下: let time = setInterval(function(){ if(sun.sun.rotation >= TWO_PI - 0.0625){ sun.sun.rotation = 0; } sun.sun.rotation += (TWO_PI - sun.sun.rotation) * 0.0625; }, 300);运行截图如下:第二种...原创 2020-07-14 09:10:01 · 1412 阅读 · 0 评论 -
计算机图形学&Web前端笔记-定位并移动到指定坐标点(two.js理论及实现)
这里先演示下效果笔记毕竟这是给理论及实践的博文。当按下回车后会到场景600,600中画个圆并且浏览器会移动到场景600,600的位置,并且这个位置将会是圆心。同样,滑动滚轮进行放缩后,还是能进行定位的:这里来说下代码以及算法:这里的dot值存储了当前浏览器屏幕中心点对应在场景坐标点,参数x,y即为要定位的点,也就是屏幕中心会移动到的地方。等会说下getScreenOriginal()这个函数是怎么实现的。得到点后,把dot.x-x及dot.y-y乘以对应的...原创 2020-07-11 09:35:15 · 1413 阅读 · 0 评论 -
计算机图形学&Web前端笔记-浏览器中心点转场景坐标理论及实现(two.js)
实现的功能是这样的:输入window.mainPage.flyTo(xxx,xxx)后会在浏览器中心点画个圆心,使用鼠标及滚轮滚动后。再次运行:前一篇博文已经说了3*3变化矩阵实现图形放缩及平移,这里不再多谈,此处只记录下,将屏幕中心点坐标,转换为two.js的场景坐标点:这里的two.scene._matrix就是3*3的矩阵。cirX=(屏幕坐标X点-水平位移)/水平缩放cirY=(屏幕坐标Y点-垂直位移)/垂直缩放源码如下:...原创 2020-07-11 09:15:44 · 947 阅读 · 0 评论 -
计算机图形学&Web前端笔记-图形平移放缩原理及实现(two.js鼠标事件适用所有渲染)
在two.js中,只提供了svg渲染时的鼠标事件,而canvas和webgl并没有提供,这样就对本人造成了很大的困扰,因此学习了下计算机图形学相关的知识,实现了利用two.js绘图在canvas、svg、webgl渲染方式下,放缩或移动场景,还能使用鼠标对其进行点击交互。下面先演示下截图:点击绿色的矩形:从上面的图可以看出变色了。下面滚动滚轮及拖动下场景:同样点击刚刚那个矩形:还是可以被找到,并且改变颜色。下面先来说下2d图形中平移和放缩的原理(非常重..原创 2020-07-10 09:43:54 · 1478 阅读 · 0 评论 -
Web&QML笔记-qml获取canvas中元素是否被按下
以前出了几个用QWebView,获取html前端数据的博文,使用QWebElement可以直接获取html中元素的填充的值。在此不在多提。这个是纯QML获取canvas中元素是否被按下的思路。这里先演示下程序运行截图如下:点击按钮生成两个元素:点一下第一个红色矩形元素:点一下第二个红色矩形元素:其原理就是qml按钮调用web前端函数,构造出2个canvas矩形。然后web前端还提供了一个函数,这个函数用于查询这个按钮是否被按下,下面这个例子是使用ma.原创 2020-07-08 08:38:14 · 1021 阅读 · 0 评论 -
Web前端笔记-two.js画三角形及画tip含tip旋转
程序运行截图如下:旋转下:代码如下:import * as Two from "JS/two";import * as $ from "JS/jquery";let isPressed = false;let originalPositionX = 0;let originalPositionY = 0;let two;let mouse;export function drawGraphic(){ let elem = document.getEleme原创 2020-07-07 08:49:31 · 1005 阅读 · 0 评论 -
Web前端笔记-移动端触屏移动视角(two.js)
这里主要是利用jquery,在移动端时也可以实现视角的移动效果。程序运行截图如下:这里用触屏操作与鼠标操作一样:关键源码如下://移动端触碰开始$stage.bind('touchstart', function (event){ originalPositionX = event.changedTouches[0].pageX; originalPositionY = event.changedTouches[0].pageY; isPressed = true;原创 2020-07-07 08:47:02 · 852 阅读 · 0 评论 -
Web前端笔记-画布拖动及放缩(two.js)
程序运行截图如下:结构图如下:关键代码如下:界面调用HelloWorld.vue<template> <div> <div id="draw-shapes"></div> </div></template><script> import "JS/two" import "JS/zui"; import {demo1} from "JS/test1"; e原创 2020-07-02 22:28:03 · 1726 阅读 · 0 评论 -
Java笔记-使用RestTemplate发送http数据包(get与post)
最近看项目,方面大佬们都喜欢用RestTemplate去发送http报文,在此记录下,方便下次使用这里只举get和post例子。get例子。程序运行截图如下:后台:源码如下:这里要先配置下config代码如下:package cn.it1995.config;import org.springframework.context.annotation.Bean;import org.springframework.context.annotation..原创 2020-06-21 22:15:12 · 2872 阅读 · 0 评论 -
Web前端笔记-浏览器控制台调用js函数及vue函数
界面是这样的源码如下:index.html<html><head></head><body><h1>Hello World</h1><script type="text/javascript" src="js.js"></script><script type="text/javascript"> function callFunctionDemo(){ a原创 2020-06-19 16:56:42 · 10886 阅读 · 3 评论 -
Web前端笔记-element ui中table中禁止换行,使用...进行省略
效果是这样的:这里就记录下操作添加一个CSS如下: a.TestCSS{ -webkit-line-clamp: 1; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; white-space: normal; }将这个css添加到即可!...原创 2020-06-16 08:54:51 · 2773 阅读 · 1 评论 -
Web前端笔记-element ui中table中某列添加a便签进行跳转
效果是这样的:这里的文章标题和查看都可以进行跳转。其中对应的代码如下: <template style="height: 100%"> <el-table :data="this.tableDataList" height="95%" style="width: 100%" :row-style="iRowStyle" :cell-style="iCellStyle"原创 2020-06-16 08:53:17 · 7107 阅读 · 0 评论