fix: unsafe window access on recipe assets (#1613)

resolves 500 error on new recipes page
This commit is contained in:
Hayden 2022-08-28 13:54:32 -08:00 committed by GitHub
parent 789ab27eef
commit 4a0fb56d18
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 13 deletions

View File

@ -81,10 +81,9 @@
import { defineComponent, reactive, useContext } from "@nuxtjs/composition-api"; import { defineComponent, reactive, useContext } from "@nuxtjs/composition-api";
import { useStaticRoutes, useUserApi } from "~/composables/api"; import { useStaticRoutes, useUserApi } from "~/composables/api";
import { alert } from "~/composables/use-toast"; import { alert } from "~/composables/use-toast";
import { detectServerBaseUrl } from "~/composables/use-utils";
import { RecipeAsset } from "~/types/api-types/recipe"; import { RecipeAsset } from "~/types/api-types/recipe";
const BASE_URL = window.location.origin;
export default defineComponent({ export default defineComponent({
props: { props: {
slug: { slug: {
@ -116,7 +115,7 @@ export default defineComponent({
}, },
}); });
const { $globals, i18n } = useContext(); const { $globals, i18n, req } = useContext();
const iconOptions = [ const iconOptions = [
{ {
@ -146,6 +145,8 @@ export default defineComponent({
}, },
]; ];
const serverBase = detectServerBaseUrl(req);
function getIconDefinition(icon: string) { function getIconDefinition(icon: string) {
return iconOptions.find((item) => item.name === icon) || iconOptions[0]; return iconOptions.find((item) => item.name === icon) || iconOptions[0];
} }
@ -156,7 +157,7 @@ export default defineComponent({
} }
function assetEmbed(name: string) { function assetEmbed(name: string) {
return `<img src="${BASE_URL}${assetURL(name)}" height="100%" width="100%"> </img>`; return `<img src="${serverBase}${assetURL(name)}" height="100%" width="100%"> </img>`;
} }
function setFileObject(fileObject: File) { function setFileObject(fileObject: File) {

View File

@ -46,15 +46,13 @@
</v-card> </v-card>
<RecipeNutrition v-if="recipe.settings.showNutrition" v-model="recipe.nutrition" class="mt-10" :edit="isEditForm" /> <RecipeNutrition v-if="recipe.settings.showNutrition" v-model="recipe.nutrition" class="mt-10" :edit="isEditForm" />
<client-only> <RecipeAssets
<RecipeAssets v-if="recipe.settings.showAssets"
v-if="recipe.settings.showAssets" v-model="recipe.assets"
v-model="recipe.assets" :edit="isEditForm"
:edit="isEditForm" :slug="recipe.slug"
:slug="recipe.slug" :recipe-id="recipe.id"
:recipe-id="recipe.id" />
/>
</client-only>
</div> </div>
</template> </template>