Contents
ObsoleteAttribute
Setting a default value for C# Auto-implemented properties via DefaultValueAttribute
DebuggerBrowsableAttribute
?? Operator
Curry and Partial methods
WeakReference
Lazy
BigInteger
__arglist __reftype __makeref __refvalue
Environment.NewLine
ExceptionDispatchInfo
Environment.FailFast
Debug.Assert, Debug.WriteIf and Debug.Indent
Parallel.For and Parallel.Foreach
IsInfinity
اگر در یک صفحه، سه کامپوننت به این صورت وجود داشته باشند:
<ComponentA/> <ComponentB/> <ComponentC/>
پردازش این‌ها در Blazor SSR، ترتیبی نیست و موازی است (هر کدام، بر روی یک ترد مجزا پردازش می‌شوند). اما اگر کامپوننت B، داخل کامپوننت A باشد، این‌ها با هم و در طی یک ترد پردازش می‌شوند. هرچند این بحث پردازش موازی هم در صورت فراهم بودن منابع سیستمی و سخت‌افزاری، تردهای آزاد در thread-pool و موارد دیگر، ممکن است رخ‌دهد یا خیر. بنابراین گاهی از اوقات، در طول مدتی، خطایی را مشاهده نمی‌کنید؛ اما ... اگر به لاگ‌های سیستم در طول یک روز مراجعه کنید، وجود این خطاها کاملا مشخص است. بنابراین بهتر است بر اساس «شانس» کار نکنید. inject AppDbContext appDbContext@ به این معنا است که فقط یک نمونه از DbContext، در طول درخواست جاری (از این لحاظ، Blazor SSR با ASP.NET Core یکسان رفتار میکند) بین تمام اجزای در حال پردازش صفحهی در حال رندر، به اشتراک گذاشته شود. «ممکن است» در صورت عدم وجود پردازش موازی، هیچ خطایی را دریافت نکنید و یا ... به صورت «اتفاقی» و با مهیا بودن شرایط سیستمی و سخت‌افزاری، خطای یاد شده را مشاهده کنید.
<body>
<div id="app">
<svg class="loading-progress">
<circle r="40%" cx="50%" cy="50%" />
<circle r="40%" cx="50%" cy="50%" />
</svg>
<div class="loading-progress-text"></div>
</div> .loading-progress {
position: relative;
display: block;
width: 8rem;
height: 8rem;
margin: 20vh auto 1rem auto;
}
.loading-progress circle {
fill: none;
stroke: #e0e0e0;
stroke-width: 0.6rem;
transform-origin: 50% 50%;
transform: rotate(-90deg);
}
.loading-progress circle:last-child {
stroke: #1b6ec2;
stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
transition: stroke-dasharray 0.05s ease-in-out;
}
.loading-progress-text {
position: absolute;
text-align: center;
font-weight: bold;
inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}
.loading-progress-text:after {
content: var(--blazor-load-percentage-text, "Loading");
} <body>
<div id="app">
<div class="progress">
<div class="progress-bar progress-bar-striped progress-bar-animated"
role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"
style="width: var(--blazor-load-percentage, 0%)">
<div class="loading-text"></div>
</div>
</div> .loading-text:after {
content: var(--blazor-load-percentage-text, "Loading");
} 
<CascadingValue Value="this" IsFixed="true"> main </CascadingValue>
Failed to load project file BlazorServer.App.csproj. C:\Program Files\dotnet\sdk\5.0.103\Sdks\Microsoft.NET.Sdk.Razor\build\netstandard2.0\Microsoft.NET.Sdk.Razor.Component.targets(107,5): Error: The specified task executable location "C:\Program Files\dotnet\dotnet.exe /M" is invalid.
export function getLocalJwt(){
return localStorage.getItem(tokenKey);
} import * as auth from "./authService"; axios.defaults.headers.common["Authorization"] = "Bearer " + auth.getLocalJwt();
Uncaught ReferenceError: Cannot access 'tokenKey' before initialization
function setJwt(jwt) {
axios.defaults.headers.common["Authorization"] = "Bearer " + jwt;
}
//...
export default {
// ...
setJwt
}; http.setJwt(getLocalJwt());
function checkExpirationDate(user) {
if (!user || !user.exp) {
throw new Error("This access token doesn't have an expiration date!");
}
user.expirationDateUtc = new Date(0); // The 0 sets the date to the epoch
user.expirationDateUtc.setUTCSeconds(user.exp);
const isAccessTokenTokenExpired =
user.expirationDateUtc.valueOf() < new Date().valueOf();
if (isAccessTokenTokenExpired) {
throw new Error("This access token is expired!");
}
} 
if (user.IsAdmin)
{
claims.Add(new Claim(ClaimTypes.Role, CustomRoles.Admin, ClaimValueTypes.String, _configuration.Value.Issuer));
} {
// ...
"http://schemas.microsoft.com/ws/2008/06/identity/claims/role": "Admin",
// ...
} public class User : BaseModel
{
[Required, MinLength(2), MaxLength(50)]
public string Name { set; get; }
[Required, MinLength(5), MaxLength(255)]
public string Email { set; get; }
[Required, MinLength(5), MaxLength(1024)]
public string Password { set; get; }
public bool IsAdmin { set; get; }
} [HttpPost]
public ActionResult<User> Create(
[FromBody]
[Bind(nameof(Models.User.Name), nameof(Models.User.Email), nameof(Models.User.Password))]
User data)
{ <NavBar user={this.state.currentUser} /> <Route
path="/movies"
render={props => <Movies {...props} user={this.state.currentUser} />}
/> class Movies extends Component {
// ...
render() {
const { user } = this.props;
// ... {user && (
<Link
to="/movies/new"
className="btn btn-primary"
style={{ marginBottom: 20 }}
>
New Movie
</Link>
)} 
{
// ...
"http://schemas.microsoft.com/ws/2008/06/identity/claims/role": "Admin",
// ...
} function addRoles(user) {
const roles =
user["http://schemas.microsoft.com/ws/2008/06/identity/claims/role"];
if (roles) {
if (Array.isArray(roles)) {
user.roles = roles.map(role => role.toLowerCase());
} else {
user.roles = [roles.toLowerCase()];
}
}
} export function isAuthUserInRoles(user, requiredRoles) {
if (!user || !user.roles) {
return false;
}
if (user.roles.indexOf(adminRoleName.toLowerCase()) >= 0) {
return true; // The `Admin` role has full access to every pages.
}
return requiredRoles.some(requiredRole => {
if (user.roles) {
return user.roles.indexOf(requiredRole.toLowerCase()) >= 0;
} else {
return false;
}
});
}
export function isAuthUserInRole(user, requiredRole) {
return isAuthUserInRoles(user, [requiredRole]);
} import { adminRoleName, apiUrl } from "../config.json"; {
"apiUrl": "https://localhost:5001/api",
"adminRoleName": "Admin"
} import * as auth from "../services/authService";
class MoviesTable extends Component {
columns = [ ... ];
// ...
deleteColumn = {
key: "delete",
content: movie => (
<button
onClick={() => this.props.onDelete(movie)}
className="btn btn-danger btn-sm"
>
Delete
</button>
)
}; constructor() {
super();
const user = auth.getCurrentUser();
if (user && auth.isAuthUserInRole(user, "Admin")) {
this.columns.push(this.deleteColumn);
}
} <Route
path="/movies"
render={props => <Movies {...props} user={this.state.currentUser} />}
/> <Route path="/movies/:id" component={MovieForm} /> <Route
path="/movies/:id"
render={props => {
if (!this.state.currentUser) {
return <Redirect to="/login" />;
}
return <MovieForm {...props} />;
}}
/> import React from "react";
import { Route, Redirect } from "react-router-dom";
import * as auth from "../../services/authService";
const ProtectedRoute = ({ path, component: Component, render, ...rest }) => {
return (
<Route
{...rest}
render={props => {
if (!auth.getCurrentUser())
return (
<Redirect
to={{
pathname: "/login",
state: { from: props.location }
}}
/>
);
return Component ? <Component {...props} /> : render(props);
}}
/>
);
};
export default ProtectedRoute; import ProtectedRoute from "./components/common/protectedRoute";
// ...
<ProtectedRoute path="/movies/:id" component={MovieForm} /> return (
<Route
{...rest}
render={props => {
console.log(props); 
<Redirect
to={{
pathname: "/login",
state: { from: props.location }
}}
/> doSubmit = async () => {
try {
const { data } = this.state;
await auth.login(data.username, data.password);
const { state } = this.props.location;
window.location = state ? state.from.pathname : "/";
} catch (ex) {
//... import { Redirect } from "react-router-dom";
//...
render() {
if (auth.getCurrentUser()) return <Redirect to="/" />;