[笔记]qduoj 前端 二次开发总结-1

前言

接了学校一个SRP项目,所以最近一个月都开始搞这个OJ的前端开发,现在分享一些这个OJ部署的一些坑点,帮助大家避坑,也Mark下给自己做笔记用.

启动前端组件

git clone https://github.com/QingdaoU/OnlineJudgeFE.git
npm install
npm run build:dll

配置Config/index.js
第一个target是后端的地址

npm run dev

FE即可成功编译

引入Component

  • 创建Conponent VUE文件
  • 配置route/route.js
  • 配置views/index.js
  • 参考iview语法设置导航栏入口
  • 修改i18n的双语文件即可

    通过上述步骤即可将自己的组件引入到FE之中

关于OJFE使用的CSS坑点

QDUOJ这个平台实际上时使用了两种UI框架
1. iView
2. ElementUI
其中iView是作为UI组件库使用,所以一开始Coding的时候会发现前端的语法与ElementUI对不上.而ElementUI的实际作用仅仅是给OJ提供了动画效果,所以为了让自己的组件也有弹出的效果,我们要使用Panel组件使得自定义的组件具有相同的弹出动画效果.
如果需要自定义动画效果的话,则需要我们自身使用transition标签来创建动画效果

结语

现在其实开刚刚起步,大致把前端摸了一下(后端也会摸,但我不是主要负责这块的),后续应该还有坑点.到时候也会分享出来给大家看的.
小声BB,QDU的文档真的不咋地.(可能是我菜才看不懂吧,若有冒犯请见谅:joy:)

[笔记]如何在linux中挂起进程至后台?

前言:

最近在cent os上部署了SteamBot的程序脚本,出现需要挂起的需求,在此记录一下方法,方便以后查阅学习.

挂起进程的两种方法:

  1. 使用nohup
  2. 使用”&”符号

“&”符号:

在terminal中输入:

command &

即可将进程挂起至后台,但是退出terminal就会结束进程

nohup命令

在terminal中输入

nohup command > /dev/null 2>&1 &

即可将进程挂起至后台,并且退出terminal也不会结束进程

(这里使用 > /dev/null 是为了重定向标准输出到空,屏蔽输出)

(2>&1 的意思就是将标准错误重定向到标准输出,屏蔽错误输出)

(nohup只是防止进程在退出terminal的时候,会结束程序用的,&才是将程序放到后台的)

正确操作方法:

使用nohup command > /dev/null 2>&1 &

例如:

nohup sh ./steambot.sh > /dev/null 2>&1 &

 

[笔记]如何配置Apache+Laravel环境

前言:

由于开发需要,现在的后端统一使用Laravel5.5进行开发,遂整理了一些配置笔记,方便以后配置环境以及减少配置时间.

安装方法:

Laravel配置

1.切换到网站根目录

cd d:\WWW

2.使用composer安装laravel项目

[此处有个注意点,这个代码最后的foldername是指你的项目文件夹名称,如果不改的话,回车之后,composer就会在执行命令时所处的目录下新建”foldername”文件夹作为项目文件夹]

composer create-project  --prefer-dist  laravel/laravel=5.5.*  foldername

Apache配置

1.配置Apache的Httpd.conf文件,对目标端口进行监听

对80和8080端口进行监听

2.配置Httpd.conf文件,启用httpd-vhosts.conf

启用配置文件

3.配置httpd-vhosts.conf文件,对Laravel程序入口(public/)文件夹进行绑定.

对laravel入口文件夹进行绑定[若需要使用80端口做别的开发,务必调回根目录]

结尾:

初次使用Laravel是会有一些迷糊,但只要用熟了,就会使用的很快的了.

 

PyRule34爬虫

简介:

Python版Rule34的图片爬虫,其实本身原理跟PHP版是一样的,这个是用来作为Python的复习&练手的,所以就没啥特别要介绍的了

特性:

  1. Python
  2. 面对象
  3. 使用Pycurl拓展

安装教程

  1. 安装python&下载仓库数据
  2. 使用指令pip install pycurl,安装pycurl拓展(如果安装失败,可参考https://stackoverflow.com/questions/507927/how-do-i-install-pycurlhttps://blog.csdn.net/weixin_41592575/article/details/78984585)
  3. 编辑bot.py(参数类同PHP版)
  4. python bot.py 即可运行

仓库链接:

https://gitee.com/7gugu/python-rule34Lib

软件截图:

联系方式:

邮箱:gz7gugu@qq.com

Ajax留言板

简介:

一个简易的Ajax-PHP-Vue留言板,这个作品练手用的,很早之前就已经实现出来了,最近两天学习使用Vue框架,所以对前端进行了重写,并且想发出来共同交流学习一下。

特性:

  1. 前后端分离
  2. Vue+axios

安装教程

  1. 导入SQL/comment.sql
  2. 修改ajax.php中的数据库连接信息
  3. 开始使用

仓库链接:

https://gitee.com/7gugu/ajax-comment-vue

软件截图:

联系方式:

Email:gz7gugu@qq.com

[笔记]Steam acceptOffer 403

引言:

这两天帮别人开发了一个自动接收报价的脚本.重新使用SteamBot API的时候,发现API的AcceptOffer函数始终无效,故花了一些时间,琢磨出了解决的办法.(也希望给后来者留下一些帮助)

问题:

原始的代码下,直接向steamcommunity.com/tradeoffer/0000/accept发送请求,Steam就会返回403 forbidden的回应.

解决:

cookie中加入sessionid即可,php中可使用这样子,重新组合一下cookie再发起链接,即可修复该bug.

[笔记]Java报错Local variable XX defined in an enclosing scope …

今天写JAVA代码的时候,碰见了一个这么个报错,由于解决方法第一次知晓,故在此留下笔记。

原代码:

for(int i = 0; i < tabName.length; i++) {
  Btn = new JButton(tabName[i]);
  Btn.setPreferredSize(new Dimension(
    100, 25));
  Btn.addActionListener(new ActionListener() {
      @Override 
      public void actionPerformed(ActionEvent e) {
            tabObj.setSelectedIndex(i); //BUG 
      } 
    }); 
  panel.add(Btn); 
}

原因:

在BUG标识处,我由于使用了一个匿名的未知范围的变量,JAVA编译器就抛出了错误”Local variable i defined in an enclosing scope must be final or effectively final“。

解决方案:

for(int i = 0; i & amp; lt; tabName.length; i++) {
  Btn = new JButton(tabName[i]);
  Btn.setPreferredSize(new Dimension(100, 25));
  final int j = i; //通过这个转换,把一个无范围的匿名变量转换成final变量 //FIX 
  Btn.addActionListener(new ActionListener(){ 
      @Override 
      public void actionPerformed(ActionEvent e){ 
        tabObj.setSelectedIndex(j);//FIX 
      } 
    }); 
  panel.add(Btn); 
}

通过使用final int j这个中间变量,java8的编译器就会认为j是一个常量,是安全可用的,因此就不会抛出上述错误,故解决。

GU直播-简易直播站

性能指标:

  • 支持统计观众个数
  • 支持在线聊天
  • 支持多个房间推流[RTMP流]
  • 支持流鉴权
  • 支持直播流播放

一些想说的:

之所以会写这个东西,仅仅是为了满足我的小愿望[自己做一个直播站试试],这个直播站从功能以及框架上都非常的羸弱,不足以应对复杂场景,仅仅是做着玩,所以有兴趣的朋友可以下下来玩玩,但不建议应用至生产环境之中。这次的下载站代码会放到Github,并且会在这个文章中附上Nginx(带RTMP模块)的下载链接,以及我的Nginx的配置。

安装:

1.下载Nginx-RTMP windows版

[理论上是可以自己编译的,但win版真的超级难编译]

链接: https://github.com/xaccc/nginx-rtmp-win32

2.修改conf/nginx.conf

worker_processes 1;
daemon off;
master_process off;</code>

error_log logs/error.log info;

events {
worker_connections 1024;
}

rtmp {
server {
listen 1935;//本配置文件是使用1935作为直播服务器的端口

application live {
live on;
notify_method POST;
publish_notify on;
on_publish http://localhost:8080/rtmp/index.php?publish;//网站域名在服务器上使用时也要修改成对外的域名
on_publish_done http://localhost:8080/rtmp/index.php?publish&amp;done;
on_play http://localhost:8080/rtmp/index.php?publish&amp;play;
on_play_done http://localhost:8080/rtmp/index.php?publish&amp;play_done;
}
}
}

http {
include mime.types;
default_type application/octet-stream;
server {
listen 8080;
location / {
root D:/phpstudy/PHPTutorial/WWW;//把这个路径改成你的网站的根目录
index index.html index.htm index.php l.php;
autoindex off;
}
location ~ \.php(.*)$ {
root D:/phpstudy/PHPTutorial/WWW;//把这个路径改成你的网站的根目录
fastcgi_pass 127.0.0.1:9000;//Nginx使用php脚本要单独启用php来监听
fastcgi_index index.php;
fastcgi_split_path_info ^((?U).+\.php)(/?.+)$;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
fastcgi_param PATH_INFO $fastcgi_path_info;
fastcgi_param PATH_TRANSLATED $document_root$fastcgi_path_info;
include fastcgi_params;
}
}
}

[不过TX云会屏蔽1935端口,所以使用时要自己修改一下]

3.启用Nginx服务器nginx.exe -c conf/nginx.conf

4.启用php服务器php-cgi -b 127.0.0.1:9000 -c php.ini

5.导入SQL到MYSQL中

6.修改config.php

date_default_timezone_set('Asia/Shanghai');
define("DBIP","localhost");//数据库IP
define("DBPORT","3306");//数据库端口
define("DBUSERNAME","root");//数据库用户名
define("DBPASSWORD","root");//数据库密码
define("DBNAME","rmtp");//数据库名
define('SYSTEM_VER','1.0.0');//系统版本号
define('SYSTEM_NAME',"GU直播");//系统名称
define('SYSTEM_ROOT','D:\phpstudy\PHPTutorial\WWW\rtmp\\');//系统网站根目录
define('SUPPORT_URL', 'https://103.249.111.182');
define('SYSTEM_NO_ERROR', false );//是否开启DEBUG模式
define('AUTH_STATE', true );//是否开启注册
define('RTMP_URL', "rtmp://localhost:1935/live/" );//RTMP链接

7.安装完成!

预览图:

登录页面
登录页面
房间信息
房间信息-推流状态自动识别
直播房间
直播房间

Github链接:

https://github.com/7gugu/gu-rtmp

Lebu-乐步H5计步系统

本项目是基于H5 API开发的健身类网页应用

可改造后使其成为”微信小程序”

Github地址:https://github.com/7gugu/lebu

功能:
1.记录用户运动里程
2.记录用户运动消耗卡路里
3.记录用户运动配速
4.生成配速图
5.统计运动趋势
6.管理用户信息

预览:

计步页面

 

历史记录页面
个人信息页面

 

[笔记][Java]Scanner的一个注意事项

序:

最近入坑Java开发,学习到使用scanner获取用户输入,并且发现了一些入门的坑点,在此写一点笔记方便以后查找。

问题代码:

import java.util.*;

public class Mathmatic {

	public static void main(String[] args) {
		Mathmatic math = new Mathmatic();
		int result;
		result = math.compare();
		System.out.println(result);
		result = math.isPrime();
		System.out.println(result);
	}
	
	public int compare() {
		int num1,num2;
		Scanner input = new Scanner(System.in);
		System.out.println("请输入第一个数字:");
		num1=input.nextInt();
		System.out.println("请输入第二个数字:");
		num2=input.nextInt();
                input.close();
		if(num1==num2) {
			return 0;
		}else if(num1>num2) {
			return 1;
		}else if(num1<num2) {
			return -1;
		}
		return 2;
	}
	
	public int isPrime() {
		int prime;
		Scanner input = new Scanner(System.in);
		System.out.println("请输入一个数字:");
		prime=input.nextInt();
		for(int i=2;i<prime;i++) {
			if(prime%i==0) {
				return 0;
			}
		}
		return 1;
	}
}

此段代码在运行过程中,如果调用了compare函数之后,再调用isPrime函数,将会报以下错误。

错误定位:

 

		num2=input.nextInt();
             -->input.close();<--

这是因为在函数中,声明了一个scanner对象,并且调用了close方法。这可能是由于所有的scanner类共享一个输入流,当其中一个调用关闭函数的时候,所有的scanner对象都关闭了。

解决方法:

在程序的最后,再使用close方法