笔记2021-07

5号

前后端分离项目vue+SSM解决跨域请求post https://www.cnblogs.com/lishanlei/p/8823823.html

页面报错：CORS error

• CORS简介
  浏览器默认的安全限制为同源策略，即JavaScript或Cookie只能访问同源（相同协议，相同域名，相同端口）下的内容。但由于跨域访问资源需要，出现了CORS机制，这种机制让web服务器能跨站访问控制，使跨站数据传输更安全。CORS需要阅览器和服务器同时支持，目前，主流的阅览器都支持cors。

浏览器将CORS请求分为两类：简单请求和非简单请求

（1) 请求方法是以下三种方法之一：
        HEAD
        GET
        POST
（2）HTTP的头信息不超出以下几种字段：
        Accept
        Accept-Language
        Content-Language
        Last-Event-ID
        Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

非简单请求的CORS请求，会在正式通信前进行一次Http查询请求，又称预检请求。
预检请求用的请求方法是OPTIONS,表示这个请求是用来询问的。

• 解决方法：
  1. vue项目结构

2. 第一步

module.exports = {
    devServer: {
        port: 8808,
        proxy: {
            '/api': {  // '/api'只是一个标识，可以写成别的
                target: 'http://39.107.104.254:80', //跨域请求目标信息
                changeOrigin: true, //是否是跨域请求
                pathRewrite: { '^/api':''}  //把”/api“替换成”“
                //pathRewrite的作用是解析最终的url全路径，进行替换。相当于java：String.replace()方法
                //例子 解析前的url：http://39.107.104.254:80/api/xxx.do
                //例子 最终的url：http://39.107.104.254:80/xxx.do
            }
        }
    }
};

3.第二步

<script>
  import axios from "axios";
  export default {
    methods: {
    fun_3() {
      axios.post(
          '/api/Seventh_SSM-2.0-RELEASE/jj/addname.do',
          {name:"终于调通接口了！"}
      );
    }
  }
}

</script>

参考
1.* https://cli.vuejs.org/zh/config/#devserver-proxy

2.https://www.cnblogs.com/zhang-hong/p/13755606.html

6号

跨域：get请求 完美解决跨域请求问题：
可以直接在html页面添加，因为这可以直接调用,

<script src="https://d1.weather.com.cn/sk_2d/101010100.html?_=" ></script>

这是调用天气的接口，使用的get请求，并且返回的内容是

var dataSK = {name:"xxx",weather:"xxx"}

这刚刚好是js格式的，哈哈
然后就可以在自己的页面上操作此接口的返回值啦

  var cityname = dataSK.cityname;
  var temp = dataSK.temp;
  var weather = dataSK.weather;
  var date = dataSK.date;

12号

使用docker容器：nginx
实现一个nginx 开启两个应用
nginx配置文件

#/etc/nginx/conf.d/default.conf

server {
    listen       80;
    listen  [::]:80;
    server_name  localhost;


#应用一  使用root
    location / {
        root   /usr/share/nginx/html/dist;
        index  index.html index.htm;
    }


#应用二 使用alias
    location /b {
        alias /var/dist;
        index index.html index.htm;
    }


#这是配置跨域  代理转发
    location ~*/Seventh_SSM {
            proxy_pass http://39.107.104.254:801;
    }

}

---

还有一个问题：kafka原理

kafka是分布式，订阅发布模式的消息流处理框架
生产者主动发送消息到kafka服务器，消费者主动长轮询kafka服务器接收消息。
kafka逻辑结构是 一个一个服务器节点broker，组成一个kafka集群。
broker下面是一些主题topic，生产者/消费者默认是按照主题topic为单位进行收发数据的。
topic下面是一些分区partiotion，此分区的目的相当于数据库的分区表，目的是为了并发。
为了保证数据的可靠性（备份容灾），每个分区可以有副本replications

实际上kafka收发数据都是根据分区为单位进行的，
生产者可以发送消息到指定的分区，
消费者可以消费指定分区的数据。
因为主题topic下面有很多分区，相应的消费数据的时候会有很多消费者个体组成一个消费者组。
定义一个消费者组，A消费者加入此组，B消费者加入此组。然后我们常轮询此消费者组便可。

19号

git 把本地代码上传到服务命令

git init
git add *
git commit -m "init java"
git branch java_server
git checkout java_server
git remote add  origin git@github.com:shenshuxin01/Ninth_SSM_vue_nodeserver_java.git
git push --set-upstream origin java_server

22号

docker：容器和镜像是两个东西，删除了容器，镜像还在
Docker - 实现本地镜像的导出、导入（save、load）

1. 导出

[root@k8s-master ~]# docker images
REPOSITORY                                        TAG                 IMAGE ID            CREATED             SIZE
nginx                                             latest              ae513a47849c        2 months ago        109MB
debian                                            jessie              4eb8376dc2a3        2 months ago        127MB
rabbitmq                                          3.6.8               8cdcbee37f62        15 months ago       179MB

[root@k8s-master tmp]# docker save ae513a47849c > nginx-save.tar
[root@k8s-master tmp]# ls -lh
total 108M
-rw-r--r-- 1 root root 108M Jul  4 09:32 nginx-save.tar

2. 导入

[root@k8s-master tmp]# ls -lh
total 108M
-rw-r--r-- 1 root root 108M Jul  4 09:32 nginx-save.tar
[root@k8s-master tmp]# docker load < nginx-save.tar 
82b81d779f83: Loading layer [==================================================>]  54.21MB/54.21MB
7ab428981537: Loading layer [==================================================>]  3.584kB/3.584kB
Loaded image ID: sha256:ae513a47849c895a155ddfb868d6ba247f60240ec8495482eca74c4a2c13a881

25号

Jenkins部署报错。找不到maven。、
解决：jenkins配置页面使用maven默认配置。不使用全局maven配置

weblogic11g部署报错：web应用的xml仅支持2.4版本的。4.0太高

• vue执行bulid命令后dist里面文件路径错误修复
  根目录下新建文件vue.config.js
  文件内容如下：

module.exports = {
    devServer: {
        port: 8101,
        // proxy: {
        //
        //     '/Tenth_SSM_Java_war': {  // '/api'只是一个标识，可以写成别的
        //         // target: 'http://39.107.104.254:801', //跨域请求目标信息
        //         target: 'http://localhost:8080', //跨域请求目标信息
        //         changeOrigin: true, //是否是跨域请求
        //
        //     }
        // }
    },
    publicPath: './',
    configureWebpack: {
        resolve: {
            alias: {
                'assets': '@/assets',
                'common': '@/common',
                'components': '@/components',
                'network': '@/network',
                'views': '@/views',
                'plugins': '@/plugins',
            }
        }
    }
};

• vue项目使用Jenkins部署

1. Jenkins构建自由风格的项目
2. linux安装node、tengine
3. Jenkins构建执行shell命令

/root/app_file/node-v14.17.3-linux-x64/bin/node -v

echo '=========='

pwd

source /etc/profile


echo $PATH

cnpm install

cnpm run build


rm -rf /root/web_file/vue_project/*

mv ./dist /root/web_file/vue_project/

/usr/local/nginx/sbin/nginx -s stop

/usr/local/nginx/sbin/nginx -s

 

• jenkins配置vue部署的原理就是

1. linux有node+tengine
2. git上获取源码
3. 
   然后在目录下面直接执行

cnpm install #就会安装上 node_modules
cnpm run build #就会生成dist目录