mirror of
https://github.com/palxiao/poster-design.git
synced 2025-07-15 16:02:19 +08:00
code: remove gaoding api
This commit is contained in:
ShawnPhang
parent
37ca1619db
commit
4333c714be
17
README.md
17
README.md
@ -42,6 +42,8 @@ cd poster-design
|
||||
npm run prepared
|
||||
```
|
||||
|
||||
> 网络太慢？尝试运行：npm config set registry https://registry.npmmirror.com 再安装依赖
|
||||
|
||||
### 本地运行
|
||||
|
||||
```
|
||||
@ -51,6 +53,7 @@ npm run serve
|
||||
> 将会同时运行前端界面与图片生成服务：
|
||||
>
|
||||
> 
|
||||
> 如果你本地没有成功启动两个服务，可能是 win 系统不兼容，手动进 `screenshot` 目录安装依赖并启动服务，或是使用 VSCode 自带的终端来运行命令，不要使用 CMD。
|
||||
|
||||
合成图片时本地会启动一个 Chrome 浏览器实例。
|
||||
|
||||
@ -69,6 +72,10 @@ npm run build <- 图片生成服务（ sreenshot 目录下）
|
||||
|
||||
代码位于 `screenshots` 目录下，查看[接口 API 文档](https://xp.palxp.com/apidoc/screenshot.html)。
|
||||
|
||||
目录结构比较简单，主要就实现了三个接口，其中 api/screenshots 即是项目中所使用到的图片生成接口，在真实生产项目中可以把该服务单独部署，于内网调用，这样利于做一些鉴权之类的处理。
|
||||
|
||||
另外 api/printscreen 这个接口实现的是网页截图的 API，该接口可以传入一个 URL 对整个网页进行截图，本项目中不依赖此接口。
|
||||
|
||||
### 服务器配置
|
||||
|
||||
在 Linux 环境下，npm 自动安装的 Chrome 浏览器有可能会出错，所以推荐从外部安装好浏览器，再给项目中的配置文件 `config.js` 设置好路径，例如：
|
||||
@ -134,3 +141,13 @@ A：抱歉，本人时间精力有限，无法提供私有化部署或二次开
|
||||
Q：**服务端源码不开源吗？**
|
||||
|
||||
A：考虑到服务端的开发语言、数据库类型都可能不尽相同，且分离代码出来有一定成本，所以暂时不考虑直接开源，只提供接口 API 文档供参考。目前服务端仅是一些简单的增删改查，自行实现的技术难度并不高。
|
||||
|
||||
### 其它
|
||||
|
||||
项目最早使用 Vue2 开发，后改用 Vue3 重构，所以有部分代码混合了 Options 写法。
|
||||
|
||||
如果你也对开发图片编辑器感兴趣，欢迎一起共建项目！
|
||||
|
||||
或许你在工作中有这类需求，如果能给到你一些微薄的帮助，那就更好不过了！
|
||||
|
||||
目前本项目也还在不断迭代中，有很多的不足之处，我也是一边学习一边成长。开源不易，希望看到这里的你可以给本项目点个 Star 支持一下~ 感谢！
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
/*
|
||||
* @Author: ShawnPhang
|
||||
* @Date: 2022-01-22 10:22:53
|
||||
* @Description: 稿定接口
|
||||
* @LastEditors: ShawnPhang <site: book.palxp.com>
|
||||
* @LastEditTime: 2023-06-27 10:38:51
|
||||
*/
|
||||
import httpRequest from '@/utils/http-request'
|
||||
|
||||
export const CORS = 'https://juejin.palxp.com/cors?url='
|
||||
export const GAODING_API_V2 = 'https://www.gaoding.com/api/v2'
|
||||
export const GAODING_FONTER = 'https://fonter.dancf.com'
|
||||
|
||||
export const getFonts = async (pageNum: number): Promise<any> => {
|
||||
return await httpRequest.get(`${CORS}${GAODING_API_V2}/fonts`, {
|
||||
params: {
|
||||
type: 'font',
|
||||
page_size: 100,
|
||||
page_num: pageNum,
|
||||
region_id: 1,
|
||||
biz_code: 1,
|
||||
endpoint: 4,
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const searchFonts = async (name: string): Promise<any> => {
|
||||
const url = `${CORS}https://www.gaoding.com/api/v2/font-fallbacks?font_name=${name}`
|
||||
return await httpRequest.get(url, {})
|
||||
}
|
||||
|
||||
interface GetSubsetFontParams {
|
||||
font_id: number
|
||||
content: string
|
||||
url: string
|
||||
}
|
||||
|
||||
export async function getSubsetFont(params: GetSubsetFontParams) {
|
||||
return await httpRequest.get(`${GAODING_FONTER}/subset`, {
|
||||
params: {
|
||||
from_site: 'gaoding',
|
||||
type: 'woff',
|
||||
...params,
|
||||
},
|
||||
responseType: 'blob',
|
||||
})
|
||||
}
|
||||
@ -2,15 +2,13 @@
|
||||
* @Author: ShawnPhang
|
||||
* @Date: 2021-08-19 18:43:22
|
||||
* @Description:
|
||||
* @LastEditors: ShawnPhang
|
||||
* @LastEditTime: 2022-01-22 18:22:13
|
||||
* @LastEditors: ShawnPhang <site: book.palxp.com>
|
||||
* @LastEditTime: 2023-07-21 13:06:46
|
||||
*/
|
||||
import * as home from './home'
|
||||
import * as material from './material'
|
||||
import * as gaoding from './gaoding'
|
||||
|
||||
export default {
|
||||
home,
|
||||
material,
|
||||
gaoding,
|
||||
}
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
* @Date: 2021-08-27 14:42:15
|
||||
* @Description:
|
||||
* @LastEditors: ShawnPhang <site: book.palxp.com>
|
||||
* @LastEditTime: 2023-07-12 09:50:00
|
||||
* @LastEditTime: 2023-07-21 11:19:04
|
||||
*/
|
||||
import fetch from '@/utils/axios'
|
||||
|
||||
@ -15,6 +15,7 @@ export const getList = (params: Type.Object = {}) => fetch('design/material', pa
|
||||
|
||||
// 获取字体
|
||||
export const getFonts = (params: Type.Object = {}) => fetch('design/fonts', params)
|
||||
export const getFontSub = (params: Type.Object = {}) => fetch('design/font_sub', params)
|
||||
|
||||
// 图库列表
|
||||
export const getImagesList = (params: Type.Object = {}) => fetch('design/imgs', params, 'get')
|
||||
|
||||
@ -2,11 +2,9 @@
|
||||
* @Author: ShawnPhang
|
||||
* @Date: 2022-01-08 09:43:37
|
||||
* @Description: 字体处理
|
||||
* @LastEditors: ShawnPhang
|
||||
* @LastEditTime: 2022-03-30 14:13:26
|
||||
* @LastEditors: ShawnPhang <site: book.palxp.com>
|
||||
* @LastEditTime: 2023-07-21 13:07:08
|
||||
*/
|
||||
|
||||
// import { getFonts } from '@/api/gaoding'
|
||||
// import { isSupportFontFamily, blob2Base64 } from './utils'
|
||||
import { getFonts } from '@/api/material'
|
||||
// import store from '@/store'
|
||||
|
||||
@ -70,10 +70,10 @@ export default {
|
||||
fontSize: 24,
|
||||
zoom: 1,
|
||||
fontClass: {
|
||||
alias: '阿里巴巴普惠体 特粗',
|
||||
id: 206825,
|
||||
value: 'AlibabaPuHuiTi-Heavy',
|
||||
url: 'https://gd-filems.dancf.com/gaoding/editor/20221222-201834-fjfkh.woff',
|
||||
alias: '思源黑体 常规',
|
||||
id: 206607,
|
||||
value: 'SourceHanSansSC-Regular',
|
||||
url: 'https://font.palxp.com/SourceHanSansSC-Regular.woff',
|
||||
},
|
||||
fontFamily: 'SourceHanSansSC-Regular',
|
||||
fontWeight: 'normal',
|
||||
@ -118,33 +118,6 @@ export default {
|
||||
let font = nval.fontClass
|
||||
const isDone = font.value === this.loadFontDone
|
||||
|
||||
// let localFonts = localStorage.getItem('FONTS') ? JSON.parse(localStorage.getItem('FONTS') || '') : []
|
||||
// let gdFont = localFonts.find((font) => font.alias === '思源黑体 常规')
|
||||
// console.log(111, gdFont)
|
||||
|
||||
// if (!font.url && nval.fontFamily) {
|
||||
// this.loading = true
|
||||
// let localFonts = localStorage.getItem('FONTS') ? JSON.parse(localStorage.getItem('FONTS') || '') : []
|
||||
// let gdFont = localFonts.find((font) => font.name === nval.fontFamily)
|
||||
// if (!gdFont) {
|
||||
// const searchFallback = await api.gaoding.searchFonts(nval.fontFamily)
|
||||
// for (let i = 0; i < searchFallback.length; i++) {
|
||||
// const { dest } = searchFallback[i]
|
||||
// gdFont = localFonts.find((font) => font.name === dest)
|
||||
// if (gdFont) {
|
||||
// break
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// if (gdFont) {
|
||||
// font.id = gdFont.id
|
||||
// font.value = gdFont.name
|
||||
// font.url = gdFont.url
|
||||
// font.alias = gdFont.alias
|
||||
// }
|
||||
// delete nval.fontFamily
|
||||
// }
|
||||
|
||||
if (font.url && !isDone) {
|
||||
if (font.id && this.isDraw) {
|
||||
this.loading = false
|
||||
|
||||
@ -1,11 +1,3 @@
|
||||
/*
|
||||
* @Author: ShawnPhang
|
||||
* @LastEditors: ShawnPhang <site: book.palxp.com>
|
||||
* @Description: Setting
|
||||
* @Date: 2021-07-13 02:48:38
|
||||
* @LastEditTime: 2023-07-14 01:03:01
|
||||
*/
|
||||
|
||||
// const prefix = import.meta.env
|
||||
const prefix = process.env
|
||||
|
||||
@ -17,8 +9,8 @@ export default {
|
||||
VERSION: '1.1.0',
|
||||
APP_NAME: '迅排设计',
|
||||
COPYRIGHT: 'ShawnPhang - Palxp.com',
|
||||
// API_URL: isDev ? 'http://localhost:9998' : '${API}',
|
||||
API_URL: 'https://app.palxp.com:8887',
|
||||
API_URL: isDev ? 'http://localhost:9998' : '${API}',
|
||||
// API_URL: 'https://app.palxp.com:8887',
|
||||
SCREEN_URL: isDev ? 'http://localhost:7001' : '${SCREEN_URL}',
|
||||
IMG_URL: 'https://store.palxp.com/',
|
||||
// ICONFONT_URL: '//at.alicdn.com/t/font_3223711_74mlzj4jdue.css',
|
||||
|
||||
@ -93,24 +93,24 @@ export default defineComponent({
|
||||
item.url = list.find((x: any) => x.oid == item.id).ttf
|
||||
})
|
||||
await this.font2style(fontContent, fontData)
|
||||
console.log('1. base64 yes')
|
||||
// console.log('1. base64 yes')
|
||||
const preload = new Preload(imgsData)
|
||||
await preload.doms()
|
||||
console.log('2. image yes')
|
||||
// console.log('2. image yes')
|
||||
const preload2 = new Preload(svgsData)
|
||||
await preload2.svgs()
|
||||
console.log('3. svg yes')
|
||||
// console.log('3. svg yes')
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
}
|
||||
try {
|
||||
await Promise.all(fontLoaders)
|
||||
console.log('4. font yes')
|
||||
// console.log('4. font yes')
|
||||
} catch (e) {
|
||||
// console.log(e)
|
||||
}
|
||||
loadFlag = true
|
||||
console.log('--> now u can start screenshot!')
|
||||
// console.log('--> now u can start screenshot!')
|
||||
setTimeout(() => {
|
||||
try {
|
||||
;(window as any).loadFinishToInject('done')
|
||||
@ -125,19 +125,17 @@ export default defineComponent({
|
||||
async font2style(fontContent: any, fontData: any = []) {
|
||||
return new Promise((resolve: Function) => {
|
||||
Promise.all(
|
||||
// TODO: 临时。拿到所有文字所对应字体子集 base64
|
||||
// 拿到字体子集，只有ttf这种原始字体支持提取，如没有则只能加载整个字体文件
|
||||
Object.keys(fontContent).map(async (key) => {
|
||||
const font = fontData.find((font: any) => font.value === key) as any
|
||||
if (font.id) {
|
||||
try {
|
||||
const blob = await api.gaoding.getSubsetFont({
|
||||
const base64 = await api.material.getFontSub({
|
||||
font_id: font.id,
|
||||
url: font.url,
|
||||
content: 'Aa' + fontContent[key],
|
||||
})
|
||||
const base64 = await blob2Base64(blob as unknown as Blob)
|
||||
fontContent[key] = base64
|
||||
console.log('获取稿定字体: ' + font.id)
|
||||
} catch (e) {
|
||||
console.log('字体获取失败', e)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user