当我们使用 Amplify Datastore 时,我们有多种方法来访问数据。我用了其中三个:
我可以看到数据在 Amplify 控制台和移动应用程序之间同步。创建/删除正确传播。
但是,当我使用 App Sync API 使用 Lambda 函数创建记录时,我需要刷新移动应用程序以及 Amplify 控制台。我知道直接将记录添加到 dynamodb 表是行不通的。但是,根据文档,应该将使用应用程序同步的突变传播到客户端。
这需要任何额外的配置吗?我如何实现这个 lambda 函数的用例,创建要在移动应用程序上实时显示的数据? Amplify 控制台和移动应用程序之间的同步非常完美,所以我相信问题出在我的 AWS 配置中,而不是 Flutter 代码。
使用 App Sync 创建记录的 Lambda 函数:
/* Amplify Params - DO NOT EDIT
API_ANANTA_GRAPHQLAPIENDPOINTOUTPUT
API_ANANTA_GRAPHQLAPIIDOUTPUT
API_ANANTA_GRAPHQLAPIKEYOUTPUT
ENV
REGION
Amplify Params - DO NOT EDIT */
import { default as fetch, Request } from "node-fetch";
const GRAPHQL_ENDPOINT = process.env.API_ANANTA_GRAPHQLAPIENDPOINTOUTPUT;
const GRAPHQL_API_KEY = process.env.API_ANANTA_GRAPHQLAPIKEYOUTPUT;
const query = /* GraphQL */ `
mutation CREATE_POST($input: CreatePostInput!) {
createPost(input: $input) {
id
}
}
`;
/**
* @type {import('@types/aws-lambda').APIGatewayProxyHandler}
*/
export const handler = async (event) => {
console.log(`EVENT: ${JSON.stringify(event)}`);
const variables = {
input: {
title: "Lorem ipsum dolor sit amet"
},
};
/** @type {import('node-fetch').RequestInit} */
const options = {
method: "POST",
headers: {
"x-api-key": GRAPHQL_API_KEY,
"Content-Type": "application/json",
},
body: JSON.stringify({ query, variables }),
};
const request = new Request(GRAPHQL_ENDPOINT, options);
let statusCode = 200;
let body;
let response;
try {
response = await fetch(request);
body = await response.json();
if (body.errors) statusCode = 400;
} catch (error) {
statusCode = 400;
body = {
errors: [
{
status: response.status,
message: error.message,
stack: error.stack,
},
],
};
}
return {
statusCode,
body: JSON.stringify(body),
};
};
显示数据的Flutter代码:
Expanded(
child: StreamBuilder<QuerySnapshot<Post>>(
stream: Amplify.DataStore.observeQuery(
Post.classType,
),
builder: (context, snapshot) {
if (snapshot.hasData) {
final posts = snapshot.data!.items;
return ListView.builder(
itemCount: posts.length,
itemBuilder: (context, index) {
final post = posts[index];
return ListTile(
title: Text(post.title),
subtitle: Text(post.description),
);
},
);
} else {
return const Center(child: CircularProgressIndicator());
}
},
),
)