分类： 未分类

vue使用tinymce本地加载方案2，更快加载tinymce

提下方案1：是改写tinymce-vue的script加载器，vue的tinymce-vue原来只是个script加载器, 改的地方略微多。

发现了另一个方法：
首先，不能再使用tinymce-vue，只用tinymce，好处是不需要api-key

npm install tinymce

同时将tinymce放到static目录用于引用css

js的部分用import
css的部分用tinymce.init

使用方式如下：

<script setup>
import {onMounted } from 'vue'
import tinymce from 'tinymce' //加载tinymce的js
import 'tinymce/themes/silver/theme' //加载theme
import 'tinymce/models/dom/model' //加载model
import 'tinymce/icons/default/icons' //加载icon

onMounted(() => {
    tinymce.init({
        selector: 'textarea#default', 
        skin_url: 'static/tinymce/skins/ui/oxide', 
        theme_url:'static/tinymce/themes/silver/theme',
        content_css:'static/tinymce/skins/ui/oxide/content.min.css'
    });
})
</script>

<template>
  <textarea id="default">Hello, World!</textarea>
</template>

Caused by: com.oracle.svm.core.jdk.UnsupportedFeatureError: No classes have been predefined during the image build to load from bytecodes at runtime.

spirngboot项目，graalvm native 编译完成后运行服务运行报错，

Caused by: com.oracle.svm.core.jdk.UnsupportedFeatureError: No classes have been predefined during the image build to load from bytecodes at runtime.

看帖子说是jdk版本问题，可我是用的graalvm编译的没错呀。后测试发现跟springboot版本有关，springboot3.1.0会报这个错，3.0.4和3.0.7测试过没问题

http-vue-loader是个好东西

需要写个简单的小项目，3个网页跳转，有些逻辑处理

想到了用vue，简单处理不用构建工具编译，创建了3个html，分别使用vue处理模板和逻辑显示，这时增加了个需求，有个悬停的音频播放按钮要贯穿3个页面，这要分开写，页面一跳转音频就停止了。

这时就需要一个能在html中加载多个vue模板的的功能，终于发现了：
http-vue-loader

官网github例子中主要是用作子组件和如何添加到当前页，实际使用时发现搭配vue-router也十分好用，跟使用构建工具没有什么大差别。


html中： 
const Question=httpVueLoader('question.vue')
  const routes = [
        { path: '/question', component: Question },
    ]

question.vue中：
<script>
    module.exports = {
        data() {
        ......
         }
    }
</script>

//唯一的使用差异可能也就是 module.exports  这里了

阿里云Kubernetes 托管版 起步的经验

服务器原来是部署在swram集群的，后来阿里云不再支持，开始往k8s上迁移。

1，降低成本:
参考了网上的帖子，那贴后来被删了，还好有备份。服务器少的话，可以删掉NAT。只要自己的服务器有公网ip或eip就行了。如果使用NAT每年成本得3-4000元。我们只有2台服务器，就把NAT去掉了。负载均衡也会给分配个公网的，不过这个服务标记了禁止删除，就还是别删了。

2，日志服务。ingress如果一开始没勾选的话，自己配还有点麻烦，并且网页版本的管理命令行不好用。跟客服沟通改用服务器自己的了。改用ingress代替之前的nginx入口服务器。ingress是托管服务的系统组件，日志格式最好就别改了。问题是之前会有个总nginx记录post信息用于调试。现在只能改在应用里记录post信息。

3，ingress里可以配置目录转发。不过阿里云网页编辑的验证不够严谨。如果配置错误会影响全局的ingress路由配置。新增配置会不生效。我是发现不生效后查ingress的日志，在报错，才发现有的配置错了。

hql组合条件查sum的方法

@Query("select sum(r.amount) from RechargeOrder r where 1=1  " +
            "AND (case when (:status is null) then true when(:status=r.status) then true else false end)=true " +
            "AND (case when (:walletType is null) then true when(:walletType=r.walletType) then true else false end)=true " +
            "AND (case when (:payType is null) then true when(:payType=r.payType) then true else false end)=true " +
            "AND (case when (:userId is null) then true when(:payType=r.userId) then true else false end)=true " +
            "AND (case when (:rechargeType is null) then true when(:rechargeType=r.rechargeType) then true else false end)=true " +
            "AND (case when (:successTimeBegin is null) then true when(:successTimeBegin<=r.successTime) then true else false end)=true " + "AND (case when (:successTimeEnd is null) then true when(:successTimeEnd>=r.successTime) then true else false end)=true " +

            "")
    Integer sumAmount(
            @Param("status")  Integer status
            ,@Param("walletType")  Integer walletType
            ,@Param("payType")  Integer payType
            ,@Param("userId")  Integer userId
            ,@Param("rechargeType")  Integer rechargeType
            ,@Param("successTimeBegin")  Date successTimeBegin
            ,@Param("successTimeEnd")  Date successTimeEnd
    );

win中cmd调用npm脚本的办法

打docker包，需要打node环境的镜像
先用bat命令行编译vue的代码
直接用npm install 无法按正常顺序执行，每个npm命令没有阻塞会并发运行
之后改用start /wait 可以顺序执行完但每次会弹出个新窗口，并且子窗口完成后需要手动关闭，并且在主装口选择是否继续
最后改用call 很好用，能正常在一个窗口中顺序执行

springcloud中缓存的小坑坑

在springboot中使用缓存是很随意的，dao中能加缓存 service中能加缓存，crontroller中都能加缓存。
但如果把springcloud包引入后会发现缓存不能随便用了，只能在dao层中使用
别的层如果还想用缓存注解尝试过把核心库中一个jar换成早期测试版可以办到。。。但这样会让微服务间无法正常请求数据。

目前只能在dao中使用缓存
参数设置方式只能是root.args[0],root.args[0].id 这种，不能用其他的别名

Caused by: redis.clients.jedis.exceptions.JedisDataException: ERR unknown command config

在阿里云部署springboot项目发现异常。在测试服是正常的，正式服使用了aliyun的redis服务

异常：
Caused by: redis.clients.jedis.exceptions.JedisDataException: ERR unknown command config

应该是阿里云对redis进行了限制

需要增加：
@Configuration
public class RedisConfig {
@Bean
public static ConfigureRedisAction configureRedisAction() {
return ConfigureRedisAction.NO_OP;
}
}

传base64png图片到AliyunOSS

使用场景是想做图片裁剪，直接传oss

基本步骤：
1，图片裁剪，产生base64字符串，略
2，base64转blob
3，blob添加到表单
4，ajax上传

具体：

/**
     * 将以base64的图片url数据转换为Blob
     * @param urlData
     *            用url方式表示的base64图片数据
     */
    function convertBase64UrlToBlob(urlData){
        var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头，并转换为byte
        //处理异常,将ascii码小于0的转换为大于0
        var ab = new ArrayBuffer(bytes.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < bytes.length; i++) {
            ia[i] = bytes.charCodeAt(i);
        }
        return new Blob( [ab] , {type : 'image/png'});
    }

3添加到表单：

 var formParam = new FormData();
formParam.append("file",convertBase64UrlToBlob(base64Codes));

4，ajax提交：

$.ajax({
            type: 'POST',
            url: host ,
            data:formParam ,
...

OSS需要额外增加授权：具体参考官方例子
额外传这些参数：

 formParam.append("key",g_object_name);
        formParam.append("policy",policyBase64);
        formParam.append("OSSAccessKeyId",accessid);
        formParam.append("success_action_status",'200');
        formParam.append("signature",signature);