several simple ways of Cinema4D UV map

2019-06-27

 I’m a programmer and need to make some simple 3D model to showing in web,such as iot-visualization-examples.UV map is one of the most important for making 3D model.There are so many relative tutorial on YouTube.However,some ways is so complex while I just want to map a simple model.There are so many things can make just by box model mapping with relative picture.

阅读全文

canvas:两图片切换的渐变效果

2019-09-07

效果及代码

 canvas两图片切换的渐变效果如下：
canvas两图片切换的渐变

阅读全文

部署parse dashboard 的问题排查记录

2019-09-22

 申请了HTPPS证书后，使用Nginx反向代理parse server与parse dashboard，parse dashboard按照文档配置了parse-dashboard-config.json,发现登陆parse dashboard成功后，仍然显示为无应用数据。在之前测试国，dashboard使用dev模式时，免账号密码登陆时是能正常显示应用数据，所以判断应该是某个环节出了问题所导致了。使用开发者工具打开控制台，报出了一条错误：[Error](https://parse.scaugreen.cn/parse-dashboard-config.json 404 (Not Found))，很显然是由于无法正常读取parse-dashboard-config.json所导致的问题。
 当时我的Nginx.conf配置如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
server {
  listen 443;
  server_name parse.scaugreen.cn;
  # 访问记录，mylog是我自定义的日志格式。
  access_log /var/log/Nginx/parse.log mylog;
  ssl on;
  ssl_certificate 1_parse.scaugreen.cn_bundle.crt;
  ssl_certificate_key 2_parse.scaugreen.cn.key;
  ssl_session_timeout 5m;
  ssl_protocols TLSv1 TLSv1.1 TLSv1.2; 
  ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
  ssl_prefer_server_ciphers on;

  # parse-dashboard
  location / {
    proxy_pass http://localhost:4040;
  }

  # parse-server
  location /parse {
    proxy_pass http://localhost:1337/parse;
  }

  # WebSocket 配置
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection $connection_upgrade;
}

阅读全文

3D温场效果

2019-10-26

效果

 19年国庆节七天假里，花了两三天的时间去尝试研究一直没时间解决的3D温场问题，最终取得了一些效果：
3D温场
 具体完整代码与访问链接可看项目：https://github.com/alwxkxk/iot-visualization-examples

阅读全文

NodeJs搭建简易mock-server

2019-11-09

 最近在工作中开发前端时，后端经常修改代码与数据表导致部分接口异常，而项目框架自带的mock.js由于是改写了XMLHttpRequest变成MockXMLHttpRequest导致很多异常（会导致很多第三方库出现问题，特别是加载文件这一块）。部分接口时常抽风，反复等待了几次感觉浪费太多时间，对我的开发进度不利，网上简单试了几个也不太好用，于是想折腾出mock-server。
 我的需求很简单，就是mock部分接口，没有设置mock的接口正常调用。
 当配置了mock的接口，就响应mock数据（图片来源于mock-server，这个工具符合需求，有nodejs模块，但折腾了几下也无法正常使用。）：

 没有配置mock的接口，就跳转至后端正常访问：

 网上说用Express框架自己搭就行了，但没有相关代码，我简单折腾了几下还真折腾出来了。

1
2
3
4
5
6
7
8
# 创建项目
yarn init
# 安装express 框架 与 代理模块
yarn add express express-http-proxy

# 如果不使用yarn 而是使用npm ，则是：
# npm init
# npm install express express-http-proxy

  将前端的请求都改指向本地mock-server服务器（如const request= axios.create({baseURL: 'http://127.0.0.1:3000/proxy'），mock-server代码如下：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
var express = require('express');
var proxy = require('express-http-proxy');
var app = express();

var url = 'www.host.com:port/api'; // 后端接口网址

// 处理跨域
app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "*");// 允许任意头部信息
  res.header("Access-Control-Request-Method", "*");
  res.header("Access-Control-Allow-Methods", "*");
  res.header("Access-Control-Allow-Credentials", "true");
  next();
});
// 所有因为跨域而发起的 options请求直接响应200
app.options('*',function (req,res) {
  console.log('mock options',req.originalUrl)
  res.send({msg:'mock-server：模拟数据'})
})
// 代理部分请求
app.post('/proxy/user/login', function (req, res) {
  console.log('post /proxy/user/login')
  res.send({
    code: 200,
    data: 'token string',
    msg: 'mock-server：模拟数据'
  })
});

app.get('/proxy/user/info', function (req, res) {
  console.log('post /proxy/user/info')
  const obj = {
    code: 200,
    data: {name:'GoGo'},
    msg: 'mock-server：模拟数据'
  }
  res.send(obj);
});

// 其他代理 走proxy forward 到 后端接口
app.use('/proxy', proxy(url,{
  proxyReqOptDecorator:(proxyReqOpts, originalReq)=>{
    // 打印出 正在代理转发的请求
    console.log('proxy ',originalReq.originalUrl)
    return proxyReqOpts;
  }
}));

app.listen(3000, function () {
  console.log('mock-server listening on port 3000!');
});


  运行上面的mock-server代码，就会mock 所有options请求以及 POST /proxy/user/login与GET /proxy/user/info这两个接口，其它请求都会正常请求后端接口（www.host.com:port/api）。
  利用以下SQL语句，从数据库里直接拿数据生成JSON，再放到mock-server代码里mock出数据来：（使用mysql图形化客户时，点击查询，然后执行SQL命令，复制出来就能当数据。）

阅读全文