Skip to content

Commit 144fd58

Browse files
QinyouzengQinyouzeng
authored
feat: cdn 上传头像需要指定路径 (#793)
1 parent 5669be3 commit 144fd58

File tree

3 files changed

+93
-85
lines changed

3 files changed

+93
-85
lines changed

‎src/Masa.Stack.Components/Pages/UserCenters/UploadAvatar.razor.cs‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,9 @@ public partial class UploadAvatar : SUploadImage
88
[Parameter]
99
public bool RandomName { get; set; }
1010

11+
[Parameter]
12+
public string RootDirectory { get; set; } = "/avatar/";
13+
1114
[Inject]
1215
public IDccClient Client { get; set; } = default!;
1316

@@ -45,9 +48,9 @@ public override async Task UploadAsync()
4548
response.Bucket,
4649
response.StsToken,
4750
response.CdnHost,
48-
RandomName
51+
RandomName,
52+
RootDirectory
4953
});
5054
await base.UploadAsync();
5155
}
52-
}
53-
56+
}

‎src/Masa.Stack.Components/Shared/IntegrationComponents/Upload/SUploadImage.razor.cs‎

Lines changed: 78 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -5,82 +5,82 @@ namespace Masa.Stack.Components;
55

66
public partial class SUploadImage : SUpload
77
{
8-
[Parameter]
9-
public RenderFragment<List<string>>? ChildContent { get; set; }
10-
11-
[Parameter]
12-
public string? DefaultImage { get; set; }
13-
14-
[Parameter]
15-
public uint PreviewImageWith { get; set; }
16-
17-
[Parameter]
18-
public uint PreviewImageHeight { get; set; }
19-
20-
[Parameter]
21-
public string Icon { get; set; } = "./_content/Masa.Stack.Components/img/upload/upload.svg";
22-
23-
[Parameter]
24-
public bool Avatar { get; set; }
25-
26-
[Parameter]
27-
public uint Size { get; set; }
28-
29-
[Parameter]
30-
public bool IsOverlay { get; set; }
31-
32-
[Parameter]
33-
public int OverlayOpenDelay { get; set; }
34-
35-
[Parameter]
36-
public int OverlayCloseDelay { get; set; }
37-
38-
[Parameter]
39-
public string OverlayTips { get; set; } = string.Empty;
40-
41-
public override async Task SetParametersAsync(ParameterView parameters)
42-
{
43-
Accept = "image/*";
44-
OnInputFileChanged = "GetPreviewImageUrls";
45-
MaximumFileSize = 1024 * 1024 * 2;
46-
await base.SetParametersAsync(parameters);
47-
}
48-
49-
protected override async Task OnParametersSetAsync()
50-
{
51-
if (string.IsNullOrEmpty(DefaultImage) is false && string.IsNullOrEmpty(Value) && MultipleValue.Count == 0)
52-
{
53-
await SetValueAsync(DefaultImage);
54-
}
55-
}
56-
57-
protected override async Task OnAfterRenderAsync(bool firstRender)
58-
{
59-
if (firstRender)
60-
{
61-
var module = await JS.InvokeAsync<IJSObjectReference>("import", "./_content/Masa.Stack.Components/Shared/IntegrationComponents/Upload/SUploadImage.razor.js");
62-
await module.InvokeVoidAsync("calculate");
63-
}
64-
await base.OnAfterRenderAsync(firstRender);
65-
}
66-
67-
string GetClass()
68-
{
69-
var css = Class;
70-
css += " mx-auto hover-misc-transition";
71-
if (Avatar) css += " m-avatar";
72-
return css;
73-
}
74-
75-
string GetStyle()
76-
{
77-
var style = "";
78-
if (Size > 0) style += $"height:{Size}px;width:{Size}px;";
79-
else if (PreviewImageWith > 0) style += $"width:{PreviewImageWith}px;";
80-
else if (PreviewImageHeight > 0) style += $"height:{PreviewImageHeight}px;";
81-
if (Avatar) style += $"border-radius: 50%;";
82-
return $"{style};{Style}";
83-
}
84-
85-
List<string> getSrcList() => MultipleValue.Count == 0 ? new List<string> { Icon } : MultipleValue;
8+
[Parameter]
9+
public RenderFragment<List<string>>? ChildContent { get; set; }
10+
11+
[Parameter]
12+
public string? DefaultImage { get; set; }
13+
14+
[Parameter]
15+
public uint PreviewImageWith { get; set; }
16+
17+
[Parameter]
18+
public uint PreviewImageHeight { get; set; }
19+
20+
[Parameter]
21+
public string Icon { get; set; } = "./_content/Masa.Stack.Components/img/upload/upload.svg";
22+
23+
[Parameter]
24+
public bool Avatar { get; set; }
25+
26+
[Parameter]
27+
public uint Size { get; set; }
28+
29+
[Parameter]
30+
public bool IsOverlay { get; set; }
31+
32+
[Parameter]
33+
public int OverlayOpenDelay { get; set; }
34+
35+
[Parameter]
36+
public int OverlayCloseDelay { get; set; }
37+
38+
[Parameter]
39+
public string OverlayTips { get; set; } = string.Empty;
40+
41+
public override async Task SetParametersAsync(ParameterView parameters)
42+
{
43+
Accept = "image/*";
44+
OnInputFileChanged = "GetPreviewImageUrls";
45+
MaximumFileSize = 1024 * 1024 * 2;
46+
await base.SetParametersAsync(parameters);
47+
}
48+
49+
protected override async Task OnParametersSetAsync()
50+
{
51+
if (string.IsNullOrEmpty(DefaultImage) is false && string.IsNullOrEmpty(Value) && MultipleValue.Count == 0)
52+
{
53+
await SetValueAsync(DefaultImage);
54+
}
55+
}
56+
57+
protected override async Task OnAfterRenderAsync(bool firstRender)
58+
{
59+
if (firstRender)
60+
{
61+
var module = await JS.InvokeAsync<IJSObjectReference>("import", "./_content/Masa.Stack.Components/Shared/IntegrationComponents/Upload/SUploadImage.razor.js");
62+
await module.InvokeVoidAsync("calculate");
63+
}
64+
await base.OnAfterRenderAsync(firstRender);
65+
}
66+
67+
string GetClass()
68+
{
69+
var css = Class;
70+
css += " mx-auto hover-misc-transition";
71+
if (Avatar) css += " m-avatar";
72+
return css;
73+
}
74+
75+
string GetStyle()
76+
{
77+
var style = "";
78+
if (Size > 0) style += $"height:{Size}px;width:{Size}px;";
79+
else if (PreviewImageWith > 0) style += $"width:{PreviewImageWith}px;";
80+
else if (PreviewImageHeight > 0) style += $"height:{PreviewImageHeight}px;";
81+
if (Avatar) style += $"border-radius: 50%;";
82+
return $"{style};{Style}";
83+
}
84+
85+
List<string> getSrcList() => MultipleValue.Count == 0 ? new List<string> { Icon } : MultipleValue;
8686
}

‎src/Masa.Stack.Components/wwwroot/js/oss/upload.js‎

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ async function UploadImage(imageFiles, ossParamter) {
2020
// 'x-oss-forbid-overwrite': 'true',
2121
};
2222
console.log(ossParamter);
23-
return await putObject(client, imageFiles[0], headers, cdnHost, ossParamter.randomName);
23+
return await putObject(client, imageFiles[0], headers, cdnHost, ossParamter.randomName, ossParamter.rootDirectory);
2424
}
2525

2626
function getCdnHost(ossParamter) {
@@ -52,9 +52,14 @@ function formatTime(date) {
5252
return `${year}${month}${day}${hour}${minute}${second}_${sign}${offset}`;
5353
}
5454

55-
async function putObject(client, file, headers, cdnHost, randName) {
55+
async function putObject(client, file, headers, cdnHost, randName, rootDirectory) {
5656
try {
57-
let fileName = getFileName(file, randName);
57+
if (!rootDirectory) rootDirectory = '/';
58+
else rootDirectory = rootDirectory.trim();
59+
if (rootDirectory == '') rootDirectory = '/';
60+
else if (rootDirectory[0] != '/') rootDirectory = '/' + rootDirectory;
61+
if (rootDirectory[rootDirectory.length - 1] != '/') rootDirectory = rootDirectory + '/';
62+
let fileName = `${rootDirectory}${getFileName(file, randName)}`;
5863
// 填写Object完整路径。Object完整路径中不能包含Bucket名称。
5964
// 您可以通过自定义文件名（例如exampleobject.txt）或文件完整路径（例如exampledir/exampleobject.txt）的形式实现将数据上传到当前Bucket或Bucket中的指定目录。
6065
// data对象可以自定义为file对象、Blob数据或者OSS Buffer。
@@ -66,7 +71,7 @@ async function putObject(client, file, headers, cdnHost, randName) {
6671
}
6772
);
6873
console.log(result);
69-
let url = cdnHost ? (cdnHost + "/" + result.name) : result.url;
74+
let url = cdnHost ? (cdnHost + fileName) : result.url;
7075
console.log(url)
7176
return [url];
7277
} catch (e) {

0 commit comments

Comments
 (0)