14 KiB
id, title, challengeType, forumTopicId, dashedName
id | title | challengeType | forumTopicId | dashedName |
---|---|---|---|---|
587d824a367417b2b2512c45 | 匿名留言板 | 4 | 301568 | anonymous-message-board |
--description--
构建一个功能上与此相似的全栈式 JavaScript 应用程序:https://anonymous-message-board.freecodecamp.rocks/。
在这个项目中,你将使用以下方法之一编写你的代码:
- 克隆这个 GitHub repo 并在本地完成你的项目。
- 使用 我们的 Replit 启动项目来完成你的项目。
- 使用一个你喜欢的站点生成器来完成项目。 需要确定包含了我们 GitHub 仓库的所有文件。
完成本项目后,请将一个正常运行的 demo(项目演示)托管在可以公开访问的平台。 然后将 URL 提交到 Solution Link
中。 此外,还可以提交一个指向项目源码的 GitHub Link
。
--instructions--
- 当准备写测试和数据库连接字符串时,设置
NODE_ENV
为不带引号的变量(在.env
文件中)。 - 建议在
routes/api.js
中创建控制器/处理器并处理路由。 - 你将在
server.js
中添加任何安全功能。
在 tests/2_functional-tests.js
中编写下以下测试:
- 创建一个新的主题:发送 POST 请求到
/api/threads/{board}
。 - 查看最近的 10 个主题,每个主题有 3 个回复:发送 GET 请求到
/api/threads/{board}
- 使用错误密码删除主题:使用错误的
delete_password
向/api/threads/{board}
发出DELETE请求 - 用正确的密码删除一个主题:向
/api/threads/{board}
发出DELETE请求,并提供有效的delete_password
。 - 报告一个主题:发送 PUT 请求到
/api/threads/{board}
。 - 创建一个新的回复:发送 POST 请求到
/api/replies/{board}
。 - 查看一个带有所有回复的主题:发送 GET 请求到
/api/replies/{board}
。 - 使用错误密码删除一个回复:使用无效的
delete_password
向/api/replies/{board}
发出DELETE请求。 - 使用正确密码删除一个回复:使用有效的
delete_password
向/api/replies/{board}
发出DELETE请求。 - 报告一个回复:发送 PUT 请求到
/api/replies/{board}
。
--hints--
提交自己的项目,而不是示例的 URL。
(getUserInput) => {
assert(
!/.*\/anonymous-message-board\.freecodecamp\.rocks/.test(
getUserInput('url')
)
);
};
只允许你的网站在你自己的页面上以 iFrame 方式加载。
async (getUserInput) => {
const data = await fetch(getUserInput('url') + '/_api/app-info');
const parsed = await data.json();
assert.isTrue(parsed.headers['x-frame-options']?.includes('SAMEORIGIN'));
};
不允许 DNS 预取。
async (getUserInput) => {
const data = await fetch(getUserInput('url') + '/_api/app-info');
const parsed = await data.json();
assert.isTrue(parsed.headers['x-dns-prefetch-control']?.includes('off'));
};
只允许你的网站为你自己的页面发送 referrer 请求头。
async (getUserInput) => {
const data = await fetch(getUserInput('url') + '/_api/app-info');
const parsed = await data.json();
assert.isTrue(parsed.headers['referrer-policy']?.includes('same-origin'));
};
你可以向 /api/threads/{board}
发送一个 POST 请求,其中包括 text
和 delete_password
的表单数据。 保存的数据库记录将至少有 _id
、text
、created_on
(date & time)、bumped_on
(date & time, starts same as created_on
)、reported
(布尔值)、delete_password
、& replies
(数组)。
async (getUserInput) => {
const date = new Date();
const text = `fcc_test_${date}`;
const deletePassword = 'delete_me';
const data = { text, delete_password: deletePassword };
const url = getUserInput('url');
const res = await fetch(url + '/api/threads/fcc_test', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const checkData = await fetch(url + '/api/threads/fcc_test');
const parsed = await checkData.json();
try {
assert.equal(parsed[0].text, text);
assert.isNotNull(parsed[0]._id);
assert.equal(new Date(parsed[0].created_on).toDateString(), date.toDateString());
assert.equal(parsed[0].bumped_on, parsed[0].created_on);
assert.isArray(parsed[0].replies);
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/replies/{board}
发送一个 POST 请求,其中包括字段 text
、delete_password
& thread_id
。 这将更新 bumped_on
日期到评论日期。 在主题的 replies
数组中,将保存一个对象,至少有 _id
、text
、created_on
、delete_password
、& reported
这些属性。
async (getUserInput) => {
const url = getUserInput('url');
const body = await fetch(url + '/api/threads/fcc_test');
const thread = await body.json();
const date = new Date();
const text = `fcc_test_reply_${date}`;
const delete_password = 'delete_me';
const thread_id = thread[0]._id;
const replyCount = thread[0].replies.length;
const data = { text, delete_password, thread_id };
const res = await fetch(url + '/api/replies/fcc_test', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const checkData = await fetch(`${url}/api/replies/fcc_test?thread_id=${thread_id}`);
const parsed = await checkData.json();
try {
assert.equal(parsed.replies.length, replyCount + 1);
assert.equal(parsed.replies[0].text, text);
assert.equal(parsed._id, thread_id);
assert.equal(parsed.bumped_on, parsed.replies[0].created_on);
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/threads/{board}
发送一个 GET 请求。 返回的将是一个数组,包括论坛上最近的 10 个被回复的主题,及每个主题最新的 3 个回帖。 reported
和 delete_password
字段将不会被发送到客户端。
async (getUserInput) => {
const url = getUserInput('url');
const res = await fetch(url + '/api/threads/fcc_test');
if (res.ok) {
const threads = await res.json();
try {
assert.equal(res.status, 200);
assert.isAtMost(threads.length, 10);
for (let i = 0; i < threads.length; i++) {
assert.containsAllKeys(threads[i], ["_id", "text", "created_on", "bumped_on", "replies"]);
assert.isAtMost(threads[i].replies.length, 3);
assert.notExists(threads[i].delete_password);
assert.notExists(threads[i].reported);
for (let j = 0; j < threads[i].replies.length; j++) {
assert.notExists(threads[i].replies[j].delete_password);
assert.notExists(threads[i].replies[j].reported);
}
}
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/replies/{board}?thread_id={thread_id}
发送一个 GET 请求。 返回的将是带有所有的回复的整个主题,不包括与之前测试相同的客户端字段。
async (getUserInput) => {
const url = getUserInput('url');
let res = await fetch(url + '/api/threads/fcc_test');
const threads = await res.json();
const thread_id = threads[0]._id;
res = await fetch(`${url}/api/replies/fcc_test?thread_id=${thread_id}`);
if (res.ok) {
const thread = await res.json();
try {
assert.equal(res.status, 200);
assert.isObject(thread);
assert.containsAllKeys(thread, ["_id", "text", "created_on", "bumped_on", "replies"]);
assert.isArray(thread.replies);
assert.notExists(thread.delete_password);
assert.notExists(thread.reported);
for (let i = 0; i < thread.replies.length; i++) {
assert.notExists(thread.replies[i].delete_password);
assert.notExists(thread.replies[i].reported);
}
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/threads/{board}
发送一个 DELETE 请求,并传递 thread_id
& delete_password
来删除该线程。 返回的将是字符串 incorrect password
或 success
。
async (getUserInput) => {
const url = getUserInput('url');
let res = await fetch(url + '/api/threads/fcc_test');
const threads = await res.json();
const thread_id = threads[0]._id;
let data = { thread_id, delete_password: "wrong_password" };
const res_invalid = await fetch(url + '/api/threads/fcc_test', {
method: 'DELETE',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
data = { thread_id, delete_password: "delete_me" };
res = await fetch(url + '/api/threads/fcc_test', {
method: 'DELETE',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const deleted = await res.text();
const not_deleted = await res_invalid.text();
try {
assert.equal(res.status, 200);
assert.equal(deleted, "success");
assert.equal(not_deleted, "incorrect password");
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/replies/{board}
发送一个 DELETE 请求,并传递 thread_id
、reply_id
、& delete_password
。 返回的将是字符串 incorrect password
或 success
。 成功后,reply_id
的文本将更改为 [deleted]
。
async (getUserInput) => {
const url = getUserInput('url');
const thread_data = {
text: "fcc_test_thread",
delete_password: "delete_me",
};
await fetch(`${url}/api/threads/fcc_test`, {
method: "POST",
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(thread_data)
});
let res = await fetch(`${url}/api/threads/fcc_test`);
let threads = await res.json();
const thread_id = threads[0]._id;
const reply_data = { thread_id, text: "fcc_test_reply", delete_password: "delete_me" };
await fetch(`${url}/api/replies/fcc_test`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(reply_data)
});
res = await fetch(`${url}/api/threads/fcc_test`);
threads = await res.json();
const reply_id = threads[0].replies[0]._id;
const data = { thread_id, reply_id, delete_password: "delete_me" };
res = await fetch(url + '/api/replies/fcc_test', {
method: 'DELETE',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const deleted = await res.text();
try {
assert.equal(res.status, 200);
assert.equal(deleted, "success");
res = await fetch(`${url}/api/replies/fcc_test?thread_id=${thread_id}`);
const thread = await res.json();
assert.equal(thread._id, thread_id);
assert.equal(thread.replies[0]._id, reply_id);
assert.equal(thread.replies[0].text, "[deleted]");
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以向 /api/threads/{board}
发送一个 PUT 请求,并传递 thread_id
。 返回的将是字符串 reported
。 thread_id
回复的 reported
值将改为 true
。
async (getUserInput) => {
const url = getUserInput('url');
let res = await fetch(`${url}/api/threads/fcc_test`);
const threads = await res.json();
const report_id = threads[0]._id;
const data = { report_id };
res = await fetch(`${url}/api/threads/fcc_test`, {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const reported = await res.text();
try {
assert.equal(res.status, 200);
assert.equal(reported, "reported");
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
你可以通过向 /api/replies/{board}
发送 PUT 请求并传递 thread_id
& reply_id
。 返回的将是字符串 reported
。 reply_id
的 reported
值将被改变为 true
。
async (getUserInput) => {
const url = getUserInput('url');
let res = await fetch(`${url}/api/threads/fcc_test`);
const threads = await res.json();
const thread_id = threads[0]._id;
const reply_id = threads[0].replies[0]._id;
const data = { thread_id, reply_id };
res = await fetch(`${url}/api/replies/fcc_test`, {
method: 'PUT',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (res.ok) {
const reported = await res.text();
try {
assert.equal(res.status, 200);
assert.equal(reported, "reported");
} catch (err) {
throw new Error(err.responseText || err.message);
}
} else {
throw new Error(`${res.status} ${res.statusText}`);
}
};
所有 10 项功能测试都已完成并通过。
async (getUserInput) => {
const tests = await fetch(getUserInput('url') + '/_api/get-tests');
const parsed = await tests.json();
assert.isTrue(parsed.length >= 10);
parsed.forEach((test) => {
assert.equal(test.state, 'passed');
assert.isAtLeast(test.assertions.length, 1);
});
};
--solutions--
/**
Backend challenges don't need solutions,
because they would need to be tested against a full working project.
Please check our contributing guidelines to learn more.
*/