我有一个使用把手的网站，但是当我尝试丰富其中一个页面时出现错误
Posted
技术标签:
【中文标题】我有一个使用把手的网站，但是当我尝试丰富其中一个页面时出现错误【英文标题】：I have a website, that uses handlebars, but when I try to rich one of the pages I get an error 【发布时间】：2020-06-07 11:02:49 【问题描述】：我创建了一个使用把手的基于 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 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.tripdata.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" >
/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');
exports = module.exports = function (req, res)
let view = new keystone.View(req, res);
let locals = res.locals;
// Set locals
locals.section = 'tours';
locals.filters =
trip: req.params.trip,
;
locals.data =
trip: [],
;
view.on('init', function (next)
keystone.list('Trip').model.findOne(
slug: locals.filters.trip,
).exec(function (err, results)
locals.data.trip = results;
console.log(locals.data.trip);
next(err);
);
);
view.render('trip');
;
最后，这是模型：
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();
它必须是这样工作的：
这就是它的工作原理：
顺便说一句，我检查了错误中显示的链接，但我不知道我必须在哪里使用allowProtoPropertiesByDefault（我想我必须完全使用这段代码）。
这是链接：https://handlebarsjs.com/api-reference/runtime-options.html#options-to-control-prototype-access
【问题讨论】：
有点旧，但这可能会有所帮助.. ***.com/a/59704492/10431732 @MattOestreich 我看到了这个问题。实际上，它没有帮助:( 我在您的代码中没有看到slug 或name，这让我认为这是cloudinaryUrl 的问题。您可以尝试在渲染时使用这些运行时选项。只是做res.render('YourTemplate.ejs', data: "that", you: "are", passing: "into", the: "template" , allowedProtoMethods: slug: true, name: true );
@MattOestreich 此代码在本地工作。抱歉，此错误与另一个模型有关，我将编辑我的问题。
@MattOestreich 我用正确的信息更新了我的问题:)
【参考方案1】：
我在更新我的 keystonejs 经典项目后遇到了这个问题。
TL;DR 这个快速车把拉动修复了它 https://github.com/express-handlebars/express-handlebars/pull/53
在您的 package.json 文件中将 express-handlebars 更新到 4.0.6 或更高版本（我使用 3.x 中的 5.1.0，它运行良好）
然后您需要在 keystone.js 中 extname: '.hbs' 之后将以下内容添加到您的“自定义引擎”
runtimeOptions:
allowProtoPropertiesByDefault: true,
allowProtoMethodsByDefault: true
瞧
【讨论】：
上帝保佑你的心先生【参考方案2】：我尝试更改车把的版本，但没有成功。但是，在尝试进一步阅读后，我发现了以下内容。
运行 npm install @handlebars/allow-prototype-access
运行 npm install express-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');
然后重新运行您的应用。它对我有用，而我不必降级使用的车把版本。所以我想我会为大多数人工作。
有关更多信息，请阅读我使用的以下文章。 https://www.npmjs.com/package/@handlebars/allow-prototype-access 使用（快速车把和猫鼬）部分
【讨论】：
【参考方案3】：当我有 4.0.3 版本的 express-handlebars 时，我也遇到了同样的问题。我安装了 3.0.2 版本（npm install express-handlebars@3.0.2），我没有这个问题了。
【讨论】：
以上是关于我有一个使用把手的网站，但是当我尝试丰富其中一个页面时出现错误的主要内容，如果未能解决你的问题，请参考以下文章