Keleven.Me

发表于 更新于 分类于 Disqus：

无言

没什么要说的了

可能持续到6月

担心粮食储备

发表于 更新于 分类于 Disqus：

无言

不知道说什么

想说的书上都写了

分包顺利进行中

更多的是无力感

新年快乐

并快乐不起来

如果没估计错的话

之后也不会快乐的

纵观千年，一成不变

发表于 更新于 分类于 Disqus：

在 vue 独立组件中使用 laravel echo

引入包

1
2
3
import Echo from "laravel-echo"

window.io = require('socket.io-client');

设置新的Echo,同时监听新的echo

1
2
3
4
5
6
7
8
9
this.echo = new Echo({
                    broadcaster: 'socket.io',
                    host: this.url.host,
                    key: this.url.key,
                })
this.echo.channel(this.url.channel)
                .listen(this.url.listen, (res) => {
                    this.pushData(res)
                })

以上

发表于 更新于 分类于 Disqus：

laravel 包中创建新 view 并使用 vue-route

前言

自行开发的laravel扩展包少不了UI的显示。

官方又没有写明，于是就踩了不少的坑。

填坑方法如下。

js 设置文件

package.json

复制laravel最初的设置就好

webpack.mix.js

注意copy到对应的laravel项目路径

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const mix = require('laravel-mix');
const webpack = require('webpack');


mix.setPublicPath('public')
    .js('resources/js/app.js', 'public')
    .sass('resources/sass/app.scss', 'public')
    .copy('public', '../../../web/public/vendor/logsservice')
    .webpackConfig({
        resolve: {
            symlinks: false,
            alias: {
                '@': path.resolve(__dirname, 'resources/js/'),
            },
        },
        plugins: [new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)],
    });

resources 文件夹

app.js

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
import Vue from 'vue';
import axios from 'axios';
import Routes from './routes';
import VueRouter from 'vue-router';
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue';
import moment from 'moment-timezone';

require('./socket');

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} 

Vue.use(VueRouter);
Vue.use(BootstrapVue);
Vue.use(IconsPlugin);

moment.tz.setDefault(LogsService.timezone);

window.LogsService.basePath = '/' + window.LogsService.path;

let routerBasePath = window.LogsService.basePath + '/';

if (window.LogsService.path === '' || window.LogsService.path === '/') {
    routerBasePath = '/';
    window.LogsService.basePath = '';
}

const router = new VueRouter({
    routes: Routes,
    mode: 'history',
    base: routerBasePath,
});

new Vue({
	router,
	el: '#logs',
})

routes.js

1
2
3
4
5
6
7
8
export default [
	{ path: '/' , redirect: '/home' },
	{ 
		path: '/home' ,
		name: 'home', 
		component: require('./screens/home/index').default,
	},
];

其他vue组件

正常写法，没什么需要注意的

laravel

路由

有使用vue-router,不按照下面的写会404哦。

1
Route::get('/{view?}' , 'LogServiceController@getHome')->where('view', '(.*)' )->name('home');

控制器

传递logsServicePath到页面。

1
return view('logsservice::layout' , [ 'logsServicePath' => [ 'path' => 'logs' ] ]);

blade

注意$logsServicePath有控制器传递了。注意根据需要修改。

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
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>logs {{ config('app.name') ? ' - ' . config('app.name') : ''  }}</title>

    <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
    <link href="{{ asset( 'vendor/logsservice/app.css') }}" rel="stylesheet" type="text/css">

</head>
<body>
	<div id="logs">
        <router-view></router-view>
	</div>
</body>
<script>
    window.LogsService = @json($logsServicePath);
</script>
<script src="{{ asset( 'vendor/logsservice/app.js') }}"></script>
</html>

以上

发表于 更新于 分类于 Disqus：

前言

移动网络天生带墙

v2ray 使用不能

尝试trojan，不能使用 cloudflare ，不能使用nginx反正代理

放弃。

Clashx

mac上v2rayX经常崩溃。换到ClashX

设置全部在config.yml中不复杂

Clash用在windows

ClashX用在mac

设置方向相同

文档使用Clash

发表于 更新于 分类于 Disqus：

为laravel logs添加自定义格式与处理方法

Monolog\Formatter\LineFormatter 用来定义log内容。

Monolog\Processor\IntrospectionProcessor 用来获取控制器、方法、行数。

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
<?php

namespace App\Logging;

use Monolog\Logger;
use Monolog\Formatter\LineFormatter;
use Monolog\Processor\IntrospectionProcessor;

// 接收log
class TestLogging
{
    private $logFormat = "";
    private $dateFormat = 'Y/m/d H:i:s';

    public function __construct()
    {
        // 设置行内容
        $cols = [
            "%datetime%",
            "[%channel%.%level_name%]",
            "%extra.class%@%extra.function%(%extra.line%)", 
            "%message%",
            "%context%",
        ];

        // 成表格
        $this->logFormat = implode("\t", $cols) . PHP_EOL;
    }

    public function __invoke($monolog)
    {
        // 定义新的日记样式
        $formatter = new LineFormatter($this->logFormat, $this->dateFormat, true, true);

        // 控制器 内容追加
        $ip = new IntrospectionProcessor(Logger::DEBUG, [] , 4);

        foreach ($monolog->getHandlers() as $handler) {
            $handler->setFormatter($formatter);
            $handler->pushProcessor($ip);
        }
    }
}

设置logging.php

1
2
3
4
5
6
7
'daily' => [
    'driver' => 'daily',
    'tap' => [App\Logging\TestLogging::class],
    'path' => storage_path('logs/laravel.log'),
    'level' => 'debug',
    'days' => 14,
],

参考1
参考2

发表于 更新于 分类于 Disqus：

2020 新年快乐

希望今年大多数关心事情都有一个好的结果！

健身环

健身环还是有用的，真的会瘦哦~

划分功能

对功能进行划分。

服务器端监听socket有点浪费资源就先不想了。

多服务器控制划分让人一吵都一点烦。

发表于 更新于 分类于 Disqus：

奇怪的梦

太过美好的梦，以至于不愿意醒来……

laravel echo 设置

laravel echo用于提供socket服务，现代网络服务必备。

于是使用laravel-echo-server

注意laravel-echo-server是兼容pusher的。

所以直接安装pusher包 + 设置config/broadcasting.php就可以快速上手。

网络上没人将详细的设置方法写出来不知道是为什么。

需要的包

1
2
composer require pusher/pusher-php-server
npm install --save laravel-echo socket.io-client

设置

.env

1
2
3
BROADCAST_DRIVER=pusher
WEBSOCKET_APPID=your_ID
WEBSOCKET_KEY=your_key

config/broadcasting.php

1
2
3
4
5
6
7
8
9
10
11
'pusher' => [
	'driver' => 'pusher',
	'key' => env('WEBSOCKET_KEY'),
	'app_id' => env('WEBSOCKET_APPID'),
	'secret' => null,
	'options' => [
		'host' => 'localhost',
		'port' => 6001,
		'scheme' => 'http'
	],
],

启动echo-server

laravel-echo-server

官方写的非常清楚了。

注意：非本地使用的情况下建议开启https

1
2
3
laravel-echo-server init
laravel-echo-server client:add APP_ID
laravel-echo-server start

到这里,laravel有可以使用php向频道中推送信息了。

vue前端设置

bootstrap.js中进行设置

注意地址的对应。如果需要laravel-echo-server完全可以拆分为独立服务器。也可以使用docker包。

1
2
3
4
5
6
7
8
9
10
import Echo from "laravel-echo"

window.io = require('socket.io-client');

window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: 'http://localhost:6001',
    key: 'your_key',
    // forceTLS: true
});

使用echo

在laravel中

新建一个事件，laravel中的推送要使用的到队列。

类要implements ShouldBroadcast

__construct的消息为要推送信息。

broadcastOn()用来指定频道。

broadcastAs()用来指定频道名称。

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
<?php

namespace KThree\Test\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;

class TestWebSocket implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    /**
     * Create a new event instance.
     *
     * @return void
     */
    public $message;

    public function __construct($message)
    {
        $this->message = $message;
    }
    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        // return new PrivateChannel('test');
        return ['your_channel'];
    }

    public function broadcastAs()
    {
        return 'your_broadcast_name';
    }
}

在vue组件中

注意listen名字前的.

1
2
3
4
var channel = Echo.channel('your_channel');
channel.listen('.your_broadcast_name', function(data) {
	alert(JSON.stringify(data));
});

发表于 更新于 分类于 Disqus： 

gantt
   dateFormat  YYYY-MM-DD-HH
   section 2019-12-13
   整理  : a1, 2019-12-13-10 , 2h
   早课 :  crit , after a1 , 2h
   程序 :     a2 , after a1 , 4h
   健身环 :   a3 , after a2 , 3h
   晚课 :  crit  , 2019-12-13-19  , 2h
   工作     :  a4 , after a3 , 4h
   休息 : a5 , after a4 , 1h
工作2     : a6 , after a5 , 3h
   整理工作记录 : 2019-12-14-03 , 1h

发表于 更新于 分类于 Disqus：

重新分配服务

重新分配服务，分割功能，创建新的功能包。

laravel horizon 使用vue 对UI进行构建，使文件在不导入的情况下可以使用

方法可以学习，不过无法使用 2FA 验证 与 用户登录。除非使用vuex。

测试 mermaid

mermaid 文档


graph LR
A --> |test| B



gantt
dateFormat  YYYY-MM-DD-HH
section 2019-12-12
整理文档      : done, a1, 2019-12-12-12 , 4h
健身环 :active, a2 , 2019-12-12-16 , 3h
晚课 :crit , a3 , after a2  , 2h
建立对应包     : 2019-12-12-19 , 6h
心理测量者3 : a4 , 2019-12-13-01 , 2h
整理工作记录 : 2019-12-13-03 , 1h
0%