Javascript 我有一个网站,使用把手,但当我试图丰富其中一个页面时,我得到了一个错误
我创建了一个基于KeystoneJS的网站,它使用把手。我已经为他们创建了一些模型和模板。但是,当我尝试访问我的某个网站页面时,我会出现以下错误:Javascript 我有一个网站,使用把手,但当我试图丰富其中一个页面时,我得到了一个错误,javascript,node.js,handlebars.js,keystonejs,Javascript,Node.js,Handlebars.js,Keystonejs,我创建了一个基于KeystoneJS的网站,它使用把手。我已经为他们创建了一些模型和模板。但是,当我尝试访问我的某个网站页面时,我会出现以下错误: Handlebars: Access has been denied to resolve the property "title" because it is not an "own property" of its parent. You can add a runtime option to disable the check or this
Handlebars: Access has been denied to resolve the property "title" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "coverImage" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "duration" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "distance" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "price" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "content" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
Handlebars: Access has been denied to resolve the property "images" because it is not an "own property" of its parent.
You can add a runtime option to disable the check or this warning:
See https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access for details
以下是我试图访问的页面的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>{{#if data.trip}}{{data.trip.title}}{{/if}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="/styles/custom/trip.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
<script>
function showDiv () {
let order = document.getElementById("order");
if (order.style.display === 'flex') {
order.style.display = 'none';
} else {
order.style.display = 'flex';
}
}
</script>
</head>
<body>
{{#if data.trip}}
<div class="container" style="background: url('{{ cloudinaryUrl data.trip.coverImage }}') center no-repeat; background-size: cover; ">
<div class="tour">
<div class="content">
<h1 class="title">{{data.trip.title}}</h1>
<div class="info">
<p class="item">Duration: <br>{{data.trip.duration}}</p>
<p class="item">Distance: <br>{{data.trip.distance}}</p>
<p class="item">Price: <br>{{data.trip.price}}€</p>
</div>
{{#if data.trip.content.additional}}
<div class="additional">
<p>{{{data.trip.content.additional}}}</p>
</div>
{{/if}}
</div>
</div>
</div>
<div class="extended">
<p class="text">{{# if data.trip.content.extended }} {{{data.trip.content.extended}}} {{/if}}</p>
</div>
<div class="photos">
{{#each data.trip.images }}
<img src="{{cloudinaryUrl}}" class="list-photo" alt="{{../data.trip.title}} Photo">
{{/each}}
</div>
<div class="order-container">
<button class="order" onclick="showDiv()">Order</button>
<div id="order" class="order-form">
<h1 class="form-title">Order</h1>
<form class="form-container" id="order-trip-form" name="simple-contact-form" accept-charset="utf-8" action="https://formspree.io/info@seebelarus.by" method="post">
<div class="input-1">
<input class="input input-name" type="text" name="name" placeholder="Name" required="required">
<input class="input input-email" type="email" name="email" placeholder="Email" required="required">
<input class="input input-phone" type="telephone" name="telephone" placeholder="Phone (Optional)" required="">
<input class="input input-number" type="number" name="plus" placeholder="Number of people" required="required">
</div>
<div class="input-2">
<input class="input input-place" type="text" name="street" placeholder="Place to meet" required="required">
<input class="input input-date" type="date" name="date" placeholder="Date" required="required">
<textarea class="comments" name="message" placeholder="Any comments" required=""></textarea>
</div>
<div class="submit-buttons">
<input type="hidden" name="_subject" id="email-subject" value="Contact Form Submission">
<input type="submit" value="Submit" class="input-button" id="button-submit">
</div>
</form>
</div>
</div>
{{/if}}
</body>
</html>
最后,这里是模型:
let keystone = require('keystone');
let Types = keystone.Field.Types;
let Trip = new keystone.List('Trip', {
map: { name: 'title' },
singular: 'Trip',
plural: 'Trips',
autokey: { path: 'slug', from: 'title', unique: true },
});
Trip.add({
title: { type: String, required: true },
content: {
extended: { type: Types.Html, wysiwyg: true, height: 400 },
additional: { type: Types.Html, wysiwyg: true, height: 300 },
},
category: { type: Types.Relationship, ref: 'TripCategory' },
duration: { type: Types.Html, wysiwyg: false },
distance: { type: Types.Html, wysiwyg: false },
price: { type: Number },
images: { type: Types.CloudinaryImages },
coverImage: { type: Types.CloudinaryImage },
});
Trip.register();
这就是它的工作原理:
这就是它的工作原理:
顺便说一下,我检查了错误中显示的链接,但我不知道默认情况下必须在哪里使用allowprotoproperties
(我想我必须完全使用此代码)
这里有一个链接:当我有4.0.3版本的express Handlebar时,我也遇到了同样的问题。我安装了3.0.2版本(npm install express-handlebars@3.0.2)我不再有这个问题了。当我有4.0.3版本的express Handlebar时,我也遇到了同样的问题。我安装了3.0.2版本(npm install express-handlebars@3.0.2)我不再有这个问题了。我尝试过改变车把的版本,但没有成功。然而,在尝试进一步阅读之后,我发现了以下内容
// require these packages into your target, in my case I required it in app.js where I run my server and other sets the templating engine.
const Handlebars = require('handlebars')
const { allowInsecurePrototypeAccess } = require('@handlebars/allow-prototype-access')
const exphbs = require('express-handlebars');
// load engines as such
app.engine('handlebars', exphbs({
defaultLayout: 'home',
handlebars: allowInsecurePrototypeAccess(Handlebars)
}));
app.set('view engine', 'handlebars');
// require these packages into your target, in my case I required it in app.js where I run my server and other sets the templating engine.
const Handlebars = require('handlebars')
const { allowInsecurePrototypeAccess } = require('@handlebars/allow-prototype-access')
const exphbs = require('express-handlebars');
// load engines as such
app.engine('handlebars', exphbs({
defaultLayout: 'home',
handlebars: allowInsecurePrototypeAccess(Handlebars)
}));
app.set('view engine', 'handlebars');
在使用部分(快速车把和猫鼬)我尝试更改车把的版本,但没有成功。然而,在尝试进一步阅读之后,我发现了以下内容
// require these packages into your target, in my case I required it in app.js where I run my server and other sets the templating engine.
const Handlebars = require('handlebars')
const { allowInsecurePrototypeAccess } = require('@handlebars/allow-prototype-access')
const exphbs = require('express-handlebars');
// load engines as such
app.engine('handlebars', exphbs({
defaultLayout: 'home',
handlebars: allowInsecurePrototypeAccess(Handlebars)
}));
app.set('view engine', 'handlebars');
// require these packages into your target, in my case I required it in app.js where I run my server and other sets the templating engine.
const Handlebars = require('handlebars')
const { allowInsecurePrototypeAccess } = require('@handlebars/allow-prototype-access')
const exphbs = require('express-handlebars');
// load engines as such
app.engine('handlebars', exphbs({
defaultLayout: 'home',
handlebars: allowInsecurePrototypeAccess(Handlebars)
}));
app.set('view engine', 'handlebars');
在使用部分(快速车把和猫鼬)更新keystonejs经典项目后,我遇到了这个问题 TL;DR这款快速把手拉手修复了它 在package.json文件中将expresshandlebar更新为4.0.6或更高版本(我使用了3.x中的5.1.0,效果很好) 然后,您需要在keystone.js中的
extname:'.hbs'
之后添加以下内容到“自定义引擎”
runtimeOptions: {
allowProtoPropertiesByDefault: true,
allowProtoMethodsByDefault: true
}
瞧,在更新keystonejs经典项目后,我遇到了这个问题 TL;DR这款快速把手拉手修复了它 在package.json文件中将expresshandlebar更新为4.0.6或更高版本(我使用了3.x中的5.1.0,效果很好) 然后,您需要在keystone.js中的
extname:'.hbs'
之后添加以下内容到“自定义引擎”
runtimeOptions: {
allowProtoPropertiesByDefault: true,
allowProtoMethodsByDefault: true
}
瞧有点老了,但这可能会有所帮助@我看到了这个问题。事实上,它没有任何帮助:(我在你的代码中没有看到
slug
或name
,这让我觉得cloudinaryUrl
有问题。你可以尝试在渲染时使用这些运行时选项。。只需执行res.render('YourTemplate.ejs',{data:'that',your:'are',passing:'into',the:'template},{allowedProtoMethods:{slug:true,name:true}}});
@MattOestreich此代码在本地工作。抱歉,此错误与另一个模型有关,我将编辑我的问题。@MattOestreich我已使用正确的信息更新了我的问题:)有点旧,但这可能会有所帮助。@MattOestreich我看到了此问题。实际上,它没有帮助:(我在你的代码中没有看到slug
或name
,这让我觉得这是cloudinaryUrl
的问题。你可以尝试在渲染时使用这些运行时选项。只需执行res.render('YourTemplate.ejs',{data:'that',your:'are',passing:'into',the:'template'},{allowedProtoMethods:{slug:true,name:true}});
@MattOestreich此代码在本地工作。很抱歉,此错误与另一个模型有关,我将编辑我的问题。@MattOestreich我已使用正确的信息更新了我的问题:)上帝保佑你的心脏先生上帝保佑你的心脏先生