Многоплатформенная система управления для UniApp, H5, Android, iOS и мини-программ.
Основана на шаблоне системы управления для UniApp, поддерживающей H5, Android, iOS и мини-программы.
pages.json
, поддержка N языковiconfont
: поддержка огромного количества шрифтов и значковrap2
: поддержка онлайн-симуляции данных MockbaseURL
для разных APIПодсказка: QR-код для Android используйте мобильный браузер для сканирования
Логин: admin Пароль: admin
uniapp-admin — это шаблон системы управления, созданный с использованием uni-app. Этот шаблон включает следующие возможности:
Одним из способов решения проблемы кросс-доменного запроса является использование прокси сервера
manifest.json
, измените часть h5
, добавив порт port
и прокси proxy
. ```json
{
"h5": {
"devServer": {
"порт": 9090,
"отключитьПроверкуХоста": true,
"прокси": {
"/ua/ua-service": {
"цель": "http://localhost:8080",
"изменитьИсточник": true,
"безопасность": false,
"перезаписатьПуть": {
"^/ua": ""
}
},
"/ua-service": {
"цель": "http://localhost:8080",
"изменитьИсточник": true,
"безопасность": false
}
}
},
"название": "uniapp-admin",
"маршрутизация": {
"режим": "хэш",
"основнойПуть": "/ua"
}
}
}* В зависимости от платформы, настраивайте глобальные конфигурационные параметры `baseUrl`, [пример кода](https://github.com/silianpan/uniapp-admin/blob/master/config/index.js).
> Принцип: для веб-платформы (H5) настройте префикс API, а затем используйте прокси-сервер (в файле `manifest.json`); для мобильной платформы (APP) нет проблем с доменом, поэтому можно использовать полный домен или IP-адрес.```js
/**
* IP адрес или домен
*/
const ipAddress = 'http://localhost:8080';
// Адрес доступа к файлам
const fileAddr = 'http://localhost:8082/fileUpload/';
/**
* Префикс API
*/
const apiPrefix = '/ua-service';
/**
* Базовый URL для разных платформ
*/
const getBaseUrl = () => {
// #ifdef H5
return apiPrefix;
// #endif
// #ifndef H5
return ipAddress + apiPrefix;
// #endif
};
export default {
/**
* Базовый URL для разных платформ
*/
baseUrl: getBaseUrl(),
fileAddr,
};
```* Настройте baseUrl в параметрах ui.request, [пример кода](https://github.com/silianpan/uniapp-admin/blob/master/api/api.js)
```js
// Установите базовые настройки
minRequest.setConfig((config) => {
config.baseURL = globalConfig.baseUrl;
return config;
});
Для решения проблемы с доменной зоной в производственной среде обычно используется Nginx-прокси
Настройка:
# Прокси-сервер для доступа к фронтенду
location /ua {
alias /root/ua;
index index.html index.htm;
try_files $uri $uri/ /index.html?/$request_uri;
}
# Прокси-сервер для серверной части, соответствует настройкам прокси в разработочной среде
location ~/ua/ua-service/* {
rewrite ^/ua/(.*)$ /$1 break;
proxy_pass http://service;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_connect_timeout 360000s;
proxy_read_timeout 360000s;
proxy_send_timeout 360000s;
}
# Прокси-сервер для серверной части, соответствует настройкам прокси в разработочной среде
location ~/ua-service/* {
proxy_pass http://service;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_connect_timeout 360000s;
proxy_read_timeout 360000s;
proxy_send_timeout 360000s;
}
Где proxy_pass http://service
— это сервис, настроенный в секции http {}
Nginx.
upstream service {
server 127.0.0.1:8080 max_fails=1 fail_timeout=10s;
}
rewrite ^/ua/(.*)$ /\$1 break;
— это замена пути, где первый параметр является регулярным выражением, а $1 представляет содержание первого скобочного выражения.### 3. Полная версия приложения для мобильных устройств (APP): Обновление и обновление пакета
Ссылка на документацию, uni-app полная замена пакета обновления/обновление схемы, а также uni-app онлайн обновление ресурсов/горячее обновление.В этом проекте используется схема полной замены пакета обновления, как показано ниже:
/**
* проверка обновления приложения
*/
appUpgrade() {
//#ifndef APP-PLUS
uni.showToast({
title: 'Поддерживается только обновление Android версий программного обеспечения',
icon: 'none'
})
//#endif
//#ifdef APP-PLUS
uni.getSystemInfo({
success: sysInfo => {
let platform = sysInfo.platform;
plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => {
// строка версии приложения, например: 1.1.0
// this.appInfo.version = wgtinfo.version;
// имя приложения
// this.appInfo.name = wgtinfo.name;
let params = {
appid: plus.runtime.appid,
// целое число версии приложения, например 110, обязательно использовать versionCode для сравнения
version: wgtinfo.versionCode,
platform: platform
};
this.$minApi.findUpgradeApp(params).then(appRes => {
if (appRes.appid) {
uni.showModal({
title: "Загрузка обновления",
content: appRes.note,
showCancel: false,
confirmText: 'Ок',
success: sucRes => {
if (sucRes.confirm) {
plus.runtime.openURL(appRes.url);
// uni.downloadFile({
// url: appRes.url,
// success: res => {}
// });
}
}
});
} else {
uni.showToast({
title: 'Вы уже используете последнюю версию.',
icon: 'none'
});
}
});
});
}
});
//#endif
}
Внимание: обязательно использовать plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) =>())
, объект wgtinfo
возвращённый обратным вызовом имеет свойство versionCode
для сравнения, wgtinfo.version
— это строка версии, wgtinfo.name
— это имя приложения.### Четвертый раздел. Схема вызова API
Основой является вызов uni.request, пример кода```js request(options = {}) { options.baseURL = options.baseURL || this[config].baseURL; options.dataType = options.dataType || this[config].dataType; options.url = MinRequestisCompleteURL ? options.url : (options.baseURL + options.url); options.data = options.data; options.header = { ...options.header, ...this[config].header }; options.method = options.method || this[config].method; }
См. статью ["uni-app схема отправки уведомлений"](https://github.com/silianpan/uniapp-admin/blob/master/PUSH_MESSAGE.md)
### 6. Решение проблем
#### 6.1 Как получить реальное имя приложения и информацию о версии?
Должно использоваться `plus.runtime.getProperty(plus.runtime.appid, (wgtinfo) => {})`, объект `wgtinfo` возвращаемый обратной вызовом функцией используется для проверки `wgtinfo.versionCode`. `wgtinfo.version` — это строка с номером версии, а `wgtinfo.name` — это название приложения.
#### 6.2 В мобильной части шаблона v-for не может вызывать методы, например: `v-for="xxx in func(xxx)"`. В этом случае метод func не будет вызван. Конкретные причины пока неясны, но если кто-то сможет объяснить, было бы здорово!
Решение: подготовьте данные заранее, затем используйте шаблон.
### 7. Будущие планы
- [x] Отправка уведомлений
Вы также можете предложить свои шаблоны или функции
### 8. Результат
#### Открытие проекта не простое дело, берегите его
#### Поддержка автора

При цитировании указывайте источник: [Лип Бап » Основанный на uni-app многофункциональный менеджер систем uniapp-admin](http://silianpan.cn/index.php/2019/10/26/uniapp_admin/)
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )